ViewPager

最新推荐文章于 2021-12-21 00:05:51 发布

青素i

最新推荐文章于 2021-12-21 00:05:51 发布

阅读量198

点赞数

分类专栏： Android开发文章标签： android

本文链接：https://blog.csdn.net/carryi/article/details/120762530

版权

Android开发专栏收录该内容

17 篇文章 6 订阅

订阅专栏

Android ViewPager

布局
代码
引入新的布局文件
综合效果
addOnPageChangeListener监听

布局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".ViewPagerActivity">


    <androidx.viewpager.widget.ViewPager
        android:id="@+id/viewpage"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        />

</LinearLayout>

代码

初始化组件

private ViewPager mViewPager;
 mViewPager = findViewById(R.id.viewpage);

初始化数据

 int[] pics = {R.mipmap.back,R.mipmap.back2,R.mipmap.back3,R.mipmap.back4};

适配器设置

class  MyPagerAdapter extends PagerAdapter {

        //数量
        @Override
        public int getCount() {
            return pics.length;
        }


        //判断view是不是来自object
        @Override
        public boolean isViewFromObject(@NonNull View view, @NonNull Object object) {
            return view==object;
        }

        @NonNull
        @Override
        public Object instantiateItem(@NonNull ViewGroup container, int position) {
            //创建一个ImageView
           ImageView imageView = new ImageView(ViewPagerActivity.this);
           imageView.setImageResource(pics[position]);
           //设置背景
           imageView.setBackgroundResource(pics[position]);

           imageView.setScaleType(ImageView.ScaleType.FIT_XY);

            //将图片添加到容器

            //返回ImageView
          //返回ImageView
            container.addView(imageView);

            return imageView;
        }


        //进行销毁
        @Override
        public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {
            View v  = (View) object;

            //移除
            container.removeView(v);
            //移除所以view
            //container.removeAllViews();

        }




    }
}

创建适配器

 MyPagerAdapter adapter = new MyPagerAdapter();

引入适配器

 mViewPager.setAdapter(adapter);

现行效果

在这里插入图片描述

引入新的布局文件

布局文件

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

    <LinearLayout
        android:id="@+id/ll_back"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="bottom"
        android:orientation="vertical">


        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="100dp"
            android:gravity="center"
            android:orientation="vertical">

            <TextView
                android:id="@+id/tv_go"
                android:layout_width="200dp"
                android:layout_height="50dp"
                android:background="#A2DCF6"
                android:gravity="center"
                android:text="立即开始"
                android:textColor="#000"
                android:textSize="30sp"
                android:visibility="gone" />


            <LinearLayout
                android:id="@+id/dot_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentBottom="true"
                android:layout_centerHorizontal="true"
                android:layout_marginTop="30dp"
                android:gravity="center"
                android:orientation="horizontal">

            </LinearLayout>
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="10dp"
            android:layout_marginLeft="10dp"
            android:layout_marginRight="10dp"
            android:gravity="center"
            android:orientation="horizontal">

            <TextView
                android:id="@+id/tv_up"
                android:layout_width="0dp"
                android:layout_height="50dp"
                android:layout_weight="1"
                android:background="#A2DCF6"
                android:gravity="center"
                android:text="上一张"
                android:textColor="#000"
                android:textSize="30sp" />

            <TextView
                android:id="@+id/tv_under"
                android:layout_width="0dp"
                android:layout_height="50dp"
                android:layout_weight="1"
                android:background="#A2DCF6"
                android:gravity="center"
                android:layout_marginLeft="10dp"
                android:text="下一张"
                android:textColor="#000"
                android:textSize="30sp" />

            <EditText
                android:id="@+id/et_num"
                android:layout_width="0dp"
                android:layout_height="50dp"
                android:layout_weight="1"
                android:layout_marginLeft="10dp"
                android:gravity="center"
                android:inputType="number"
                android:textColor="#000"
                android:textSize="20sp" />

            <TextView
                android:id="@+id/tv_goto"
                android:layout_width="0dp"
                android:layout_height="50dp"
                android:layout_weight="1"
                android:layout_marginLeft="10dp"
                android:background="#A2DCF6"
                android:gravity="center"
                android:text="跳转"
                android:textColor="#000"
                android:textSize="30sp" />

        </LinearLayout>


    </LinearLayout>

</LinearLayout>

载入布局和组件（ViewHoled）缓存处理


        class  ViewHoled{
            LinearLayout lBack,lDot;
            TextView     tvGo,tvUp,tvUnder,tvGoTo;
            EditText     etNum;
        }

 View view = null;
            ViewHoled viewHoled = new ViewHoled();
            if(view == null){
                view =  LayoutInflater.from(ViewPagerActivity.this).inflate(R.layout.item_view_page,null);
                viewHoled.lBack = view.findViewById(R.id.ll_back);
                viewHoled.tvGo = view.findViewById(R.id.tv_go);
                viewHoled.lDot = view.findViewById(R.id.dot_layout);
                viewHoled.tvUp = view.findViewById(R.id.tv_up);
                viewHoled.tvUnder = view.findViewById(R.id.tv_under);
                viewHoled.tvGoTo = view.findViewById(R.id.tv_goto);
                viewHoled.etNum = view.findViewById(R.id.et_num);
                view.setTag(viewHoled);
            }else {
                viewHoled = (ViewHoled) container.getTag();
            }

实现最后一张进行页面跳转

            viewHoled.lBack.setBackgroundResource(pics[position]);
            if((pics.length-1)==position){
                viewHoled.tvGo.setVisibility(View.VISIBLE);
            }else {
                viewHoled.tvGo.setVisibility(View.GONE);
            }
            
          viewHoled.tvGo.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    startActivity(new Intent(ViewPagerActivity.this,MainActivity.class));
                    finish();
                }
            });

在这里插入图片描述

实现底部滚动

            //底部滚动
            LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.MATCH_PARENT);
            params.setMargins(15,0,15,0);


            for(int i = 0;i<pics.length;i++){
                ImageView imageView = new ImageView(ViewPagerActivity.this);
                imageView.setLayoutParams(params);
                //imageView.setImageResource(R.drawable.selector);

                if(i == position){
                    imageView.setBackgroundResource(R.drawable.xuanzhong);
                }else {
                    imageView.setBackgroundResource(R.drawable.weixuanzhong);
                }
                viewHoled.lDot.addView(imageView);
            }

实现指向跳转

setCurrentItem()；方法跳转指定页面

            viewHoled.tvGo.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    startActivity(new Intent(ViewPagerActivity.this,MainActivity.class));
                    finish();
                }
            });
            viewHoled.tvUp.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    if(position == 0 ){
                        Toast.makeText(ViewPagerActivity.this,"没有上一张了",Toast.LENGTH_SHORT).show();
                    }else {
                        mViewPager.setCurrentItem(position-1);
                    }

                }
            });
            viewHoled.tvUnder.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    if(position == (pics.length-1) ){
                        Toast.makeText(ViewPagerActivity.this,"没有下一张了",Toast.LENGTH_SHORT).show();
                    }else {
                        mViewPager.setCurrentItem(position+1);
                    }
                }
            });
            final EditText editText = viewHoled.etNum;
            viewHoled.tvGoTo.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                   int i =  Integer.valueOf(editText.getText().toString())-1;


                    if( i<0 || i>=pics.length){
                        Toast.makeText(ViewPagerActivity.this,"越界",Toast.LENGTH_SHORT).show();
                    }else {
                        mViewPager.setCurrentItem(i);
                    }
                }
            });

综合效果

在这里插入图片描述

addOnPageChangeListener监听

 mViewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {


            //position，代表哪个页面被选中
            //positionOffset是当前页面滑动比例，如果页面向右翻动，这个值不断变大，最后在趋近1的情况后突变为0。如果页面向左翻动，这个值不断变小，最后变为0。
            //positionOffsetPixels是当前页面滑动像素，变化情况和positionOffset一致。
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

            }


            //这个方法有一个参数position，代表哪个页面被选中
            @Override
            public void onPageSelected(int position) {

            }


            /*
            * state有三个值：0（END）,1(PRESS) , 2(UP) 。当用手指滑动翻页时，手指按下去的时候会触发这个方法，state值为1，
            * 手指抬起时，如果发生了滑动（即使很小），这个值会变为2，然后最后变为0 。
            * 总共执行这个方法三次。
            * 一种特殊情况是手指按下去以后一点滑动也没有发生，这个时候只会调用这个方法两次，state值分别是1,0 。
            *    当setCurrentItem翻页时，会执行这个方法两次，state值分别为2 , 0 。
            */
            @Override
            public void onPageScrollStateChanged(int state) {

            }
        });