Android基础之欢迎滑动页面(页面布局&底部点点)

一、效果图

二、源码

1.view_pager_first.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:scaleType="centerCrop"
        android:src="@mipmap/bg_splash_01" />

</LinearLayout>

2.activity_guide.xml

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/flyt_main"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical">

    <android.support.v4.view.ViewPager
        android:id="@+id/viewPager"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content" />

    <RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical">

        <Button
            android:id="@+id/btn_im_exp"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_centerHorizontal="true"
            android:layout_marginBottom="@dimen/DIMEN_88PX"
            android:background="@mipmap/bg_imexp" />
    </RelativeLayout>

    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">

        <LinearLayout
            android:id="@+id/llyt_dots"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_marginBottom="@dimen/DIMEN_50PX"
            android:gravity="center"
            android:orientation="horizontal"></LinearLayout>
    </RelativeLayout>
</FrameLayout>

3.SlidePagerAdapter.java

/**
 * 适配器
 *
 * @author Guan
 * @file com.guan.o2o.adapter
 * @date 2015/8/10
 * @Version 1.0
 */
public class SlidePagerAdapter extends PagerAdapter {

    private ArrayList<View> mList;
    private Activity mActivity;

    public SlidePagerAdapter(ArrayList<View> list, Activity activity) {
        this.mList = list;
        this.mActivity = activity;
    }

    @Override
    public int getCount() {
        // 返回页面数目实现有限滑动效果
        if (mList != null) {
            return mList.size();
        }
        return 0;
    }

    @Override
    public boolean isViewFromObject(View arg0, Object arg1) {
        return arg0 == arg1;
    }

    @Override
    public int getItemPosition(Object object) {
        return super.getItemPosition(object);
    }

    @Override
    public Object instantiateItem(View container, int position) {
        ((ViewPager) container).addView(mList.get(position), 0);
        return mList.get(position);
    }

    @Override
    public void destroyItem(View container, int position, Object object) {
          // 注销父类销毁item的方法，因为此方法并不是使用此方法
//        super.destroyItem(container, position, object);
        ((ViewPager) container).removeView(mList.get(position));
    }
}

4.GuideActivity.java

/**
 * 引导页面
 *
 * @author Guan
 * @file com.guan.o2o.activity
 * @date 2015/9/23
 * @Version 1.0
 */
public class GuideActivity extends FrameActivity {

    @InjectView(R.id.viewPager)
    ViewPager viewPager;
    @InjectView(R.id.llyt_dots)
    LinearLayout layoutDots;

    private ArrayList<View> mList;
    private ImageView[] mImageViews;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_guide);
        ButterKnife.inject(this);

        /**
         * 初始化ViewPager
         */
        initViewPager();
    }

    /**
     * 初始化ViewPager
     */
    private void initViewPager() {
        LayoutInflater inflater = getLayoutInflater();
        mList = new ArrayList<View>();
        mList.add(inflater.inflate(R.layout.view_pager_first, null));
        mList.add(inflater.inflate(R.layout.view_pager_second, null));
        mList.add(inflater.inflate(R.layout.view_pager_third, null));

        // 底部点点实现
        mImageViews = new ImageView[mList.size()];
        for (int i = 0; i < mList.size(); i++) {
            mImageViews[i] = new ImageView(GuideActivity.this);
            LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(20,20);
            // 设置边界
            params.setMargins(7, 10, 7, 10);
            mImageViews[i].setLayoutParams(params);
            if (0 == i) {
                mImageViews[i].setBackgroundResource(R.mipmap.ic_indicator_c);
            } else {
                mImageViews[i].setBackgroundResource(R.mipmap.ic_indicator);
            }
            layoutDots.addView(mImageViews[i]);
        }

        viewPager.setAdapter(new SlidePagerAdapter(mList, GuideActivity.this));
        // 绑定回调
        viewPager.addOnPageChangeListener(new onPageChangeListener());
//        viewPager.setCurrentItem(0);
    }

    /**
     * 立刻体验按钮监听
     */
    @OnClick(R.id.btn_im_exp)
    public void onButtonClick() {
        // 写入是否引导记录
        SharedUtil.setIsFirst(GuideActivity.this);
        // 跳转到LoginActivity
        openActivityFn(LoginActivity.class);
    }

    /**
     * 监听ViewPager滑动效果
     */
    private class onPageChangeListener implements ViewPager.OnPageChangeListener {

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

        }

        @Override
        public void onPageSelected(int position) {
            // 更新小圆点图标
            for (int i = 0; i < mList.size(); i++) {
                if (position == i) {
                    mImageViews[i].setBackgroundResource(R.mipmap.ic_indicator_c);
                } else {
                    mImageViews[i].setBackgroundResource(R.mipmap.ic_indicator);
                }
            }

//        // 滑动到最后pager时显示“立刻体验”按钮并监听
//        if (position == mList.size() - 1) {
//            onButtonClick();
//        } else {
//            btnImExp.setVisibility(View.INVISIBLE);
//        }
        }

        @Override
        public void onPageScrollStateChanged(int state) {

        }
    }
}