ViewPager与Fragment配合使用实现引导页

1.主界面布局:


<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1">
            <android.support.v4.view.ViewPager
                android:id="@+id/view_pager"
                android:layout_width="match_parent"
                android:layout_height="match_parent" />
            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_alignParentBottom="true"
                android:layout_marginBottom="18dp"
                android:gravity="center_horizontal">

                <LinearLayout
                    android:id="@+id/ll_point_group"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_margin="5dp"
                    android:gravity="center_vertical"
                    android:orientation="horizontal"/>
            RelativeLayout>
        RelativeLayout>

LinearLayout>

2.MainActivity代码:

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentStatePagerAdapter;
import android.support.v4.view.ViewPager;
import android.widget.ImageView;
import android.widget.LinearLayout;

import java.util.ArrayList;
import java.util.List;

public class MainActivity extends FragmentActivity {

    private ViewPager viewPager;

    private LinearLayout ll_point_group;

    private int[] imageIds = new int[]{R.drawable.guide1, R.drawable.guide2, R.drawable.guide3};

    private List imageList;
    private List fragmentList;


    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        viewPager = (ViewPager) findViewById(R.id.view_pager);
        ll_point_group = (LinearLayout) findViewById(R.id.ll_point_group);



        imageList = new ArrayList<>();

        for (int imageId : imageIds) {
            ImageView image = new ImageView(this);
            image.setBackgroundResource(imageId);
            imageList.add(image);

            // 添加指示点
            ImageView point = new ImageView(this);
            point.setBackgroundResource(R.drawable.point_bg);

            // 创建一个线性布局使用的布局参数
            LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(-2, LinearLayout.LayoutParams.WRAP_CONTENT);
            layoutParams.leftMargin = 20;

            // 添加子view,同时,指定该子view的布局参数
            ll_point_group.addView(point, layoutParams);

            if (imageId == R.drawable.guide1) {
                // 让第一个点,显示,选中的背景图片
                point.setEnabled(true);
            } else {
                point.setEnabled(false);
            }

        }
        ll_point_group.getChildAt(0).setEnabled(true);
        viewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {

            @Override
            public void onPageSelected(int position) {

                position = position % imageIds.length;
                // 切换指示点的选中状态
                // 让上一个选中的点,显示为普通色
                ll_point_group.getChildAt(lastPosition).setEnabled(false);
                // 让当前选中的点显示为白色
                ll_point_group.getChildAt(position).setEnabled(true);
                // 为lastPosition 设值
                lastPosition = position;

            }


            @Override
            public void onPageScrolled(int position, float positionOffset,int positionOffsetPixels) {}

            @Override
            public void onPageScrollStateChanged(int state) {
            }
        });

        fragmentList = new ArrayList<>();

        fragmentList.add(new ChildFragment1());
        fragmentList.add(new ChildFragment2());
        fragmentList.add(new ChildFragment3());

        fragmentAdapter = new MyFragmentPagerAdapter(getSupportFragmentManager());
        viewPager.setAdapter(fragmentAdapter);
    }

    // 上一个选中的页面的下标
    private int lastPosition = 0;


    private MyFragmentPagerAdapter fragmentAdapter;

    private class MyFragmentPagerAdapter extends FragmentStatePagerAdapter {

        public MyFragmentPagerAdapter(FragmentManager fm) {
            super(fm);
        }

        @Override
        public Fragment getItem(int position) {
            return fragmentList.get(position);
        }

        @Override
        public int getCount() {
            return fragmentList.size();
        }

    }

}

3.ChildFragment代码:

ViewPager与Fragment配合使用实现引导页_第1张图片

你可能感兴趣的:(Android)