安卓实训之——页面滑动ViewPager

制作滑动页面

第一步：

新建四个布局文件：page1.xml;page2.xml;page3.xml;并在每个xml中添加<ImageView>

pager1.xml:

<span style="font-size:18px;"><?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <!-- 添加ImageView控件用于显示图片 -->
    <ImageView
        android:id="@+id/page01"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:src="@drawable/a"
        android:scaleType="fitXY"
        />
</RelativeLayout></span>

page2.xml;page3.xml;同上.

第二步：在activity_main.xml中添加：

<android.support.v4.view.ViewPager

        android:id="@+id/viewpager"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

    </android.support.v4.view.ViewPager>

第三步：在Mainactivity中编辑：

import android.content.Context;
import android.graphics.Color;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.view.ViewGroup;
import android.widget.Button;

/*
ViewPage实现页面滑动,步骤：
1，声明控件：ViewPager
             View(数组)
2，在onCreate中查找控件；
3，声明实例化View数组
            指定数组长度，
4，将布局文件映射到数组。
    数组文件=布局文件
    View.inflate(参数1，参数2，参数3);
5，声明并新建PagerAdapter
6,为ViewPager设置adapter
*/
public class MainActivity extends AppCompatActivity{

    //1，声明控件：
    private ViewPager vp;
    private View[] childviews;
    private View[] childDots;

    //声明适配器
    private PagerAdapter adapter;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        Button btn=(Button)this.findViewById(R.id.btn01);
        btn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {

            }
        });

        //设置程序运行时首次加载的页面
        setContentView(R.layout.activity_main);
        //2,查找空件
        vp=(ViewPager)findViewById(R.id.viewpager);
        //3，实例化数组
        childviews=new View[3];
        childDots=new View[3];

        childDots[0]=(View)findViewById(R.id.dot1);
        childDots[1]=(View)findViewById(R.id.dot2);
        childDots[2]=(View)findViewById(R.id.dot3);

        //4,将4个布局文件映射到数组文件中
        childviews[0]=View.inflate(
                this,//上下文对象
                R.layout.page1,//布局文件
                null//根结点，用null即可
        );
        childviews[1]=View.inflate(
                this,
                R.layout.page2,
                null
        );
        childviews[2]=View.inflate(
                this,
                R.layout.page3,
                null
        );

        //新建一个PagerAdapter，但是不可以直接new
        adapter=new InnerAdapter();

        //6,为View设置adapter
        vp.setAdapter(adapter);

        //7，改变四个按钮的颜色

        //设置第一个按钮背景颜色
        childDots[0].setBackgroundColor(Color.WHITE);
            vp.setOnPageChangeListener(
                    new ViewPager.OnPageChangeListener() {
                        @Override
                        public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

                        }
                        //滑动
                        @Override
                        public void onPageSelected(int arg0) {
                        for (int i=0;i<childDots.length;i++){
                            //设置底部按钮的颜色
                            childDots[i].setBackgroundColor(Color.BLACK);
                        }
                            childDots[arg0].setBackgroundColor(Color.WHITE);
                        }

                        @Override
                        public void onPageScrollStateChanged(int state) {

                        }
                    }
            );
    }

    //真正的去实现滑动效果
    class InnerAdapter extends PagerAdapter{
        //Context context;

        //返回滑动页面的数量
        @Override
        public int getCount() {
            return childviews.length;
        }

        @Override
        public boolean isViewFromObject(View age0, Object age1) {
            return age0==age1;
        }

       /* 方法作用：
       * 方法进行图片的初始化工作
       * */
        @Override
        public Object instantiateItem(ViewGroup container, int position) {
           // return super.instantiateItem(container, position);
            container.addView(childviews[position]);
            return  childviews[position];
        }
        //当滑动图片超过三张时，会调用此方法
        @Override
        public void destroyItem(ViewGroup container, int position, Object object) {
            container.removeView(childviews[position]);
        }
    }
}

效果图：