Android ViewPager简单使用

Posted 森然献凉i

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Android ViewPager简单使用相关的知识,希望对你有一定的参考价值。

效果图

功能代码

创建一个集合,存储ViewPager的四张图片

//四张广告图片添加到集合中进行保存
        List<View>listPics=new ArrayList<>();
        //第一张
        ImageView img1=new ImageView(this);
        img1.setBackgroundResource(R.drawable.img1);
        listPics.add(img1);
        //第二张
        ImageView img2=new ImageView(this);
        img2.setBackgroundResource(R.drawable.img2);
        listPics.add(img2);
        //第三张
        ImageView img3=new ImageView(this);
        img3.setBackgroundResource(R.drawable.img3);
        listPics.add(img3);
        //第四张
        ImageView img4=new ImageView(this);
        img4.setBackgroundResource(R.drawable.img4);
        listPics.add(img4);

动态设置ViewPager右下角四个小圆点的属性

 //动态设置四个圆点的属性
        indicators=new ImageView[listPics.size()];
        //遍历该数组一个个动态加载
        for (int i=0;i<indicators.length;i++){
            indicator=new ImageView(this);
            //设置这张图片在布局中的参数(指定宽度和高度)
            indicator.setLayoutParams(new LinearLayout.LayoutParams(40,40));
            //小圆点的间隔
            indicator.setPadding(5,5,5,5);
            //
            indicators[i]=indicator;
            if (i==0){
                indicators[i].setBackgroundResource(R.drawable.dian_f);
            }else {
                indicators[i].setBackgroundResource(R.drawable.dian_b);
            }
            group.addView(indicators[i]);
        }

设置viewPager的监听器

  //设置viewPager的监听器
        viewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            //当页面翻滚
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

            }
            //当页面被选中
            @Override
            public void onPageSelected(int position) {
                //记录当前位置
//                index.getAndSet(position);
                for (int i=0;i<indicators.length;i++){
                    //如果数组的当前下标就是当前位置
                    if (i==position){
                        indicators[i].setBackgroundResource(R.drawable.dian_f);
                    }else {
                        indicators[i].setBackgroundResource(R.drawable.dian_b);
                    }

                }
            }

            @Override
            public void onPageScrollStateChanged(int state) {

            }
        });

 

适配器

//创建一个适配器
class MyPagerAdapter extends PagerAdapter{
    private List<View>viewList;
    //将集合作为构造方法的参数传递进来
    public MyPagerAdapter(List<View>viewList){
        this.viewList=viewList;
    }
    @Override
    public int getCount() {
        return viewList.size();
    }

    @Override
    public boolean isViewFromObject(@NonNull View view, @NonNull Object object) {
        return view==object;
    }

    //视图的创建,创建每一页viewpager的时候instantiateItem将会被自动调用
    @NonNull
    @Override
    public Object instantiateItem(@NonNull ViewGroup container, int position) {
        container.addView(viewList.get(position),0);
        return viewList.get(position);
    }
    //视图的移除
    @Override
    public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {
        container.removeView(viewList.get(position));
    }
}

自动翻页功能(两秒)

使用多线程

//使用多线程自动定时切换page
        new Thread(new Runnable() {
            @Override
            public void run() {
                while (true){
                    //循环一直执行,每隔两秒,通过Handler,发出一条消息带去当前ViewPager所显示的页的索引号
                    if (isContinue){
                        viewHandler.sendEmptyMessage(index.get());
                        whatOption();
                    }
                }

            }
        }).start();
    }
    private void whatOption(){
        index.incrementAndGet();//将当前位置值加1
        if (index.get()>indicators.length-1){
            index.getAndAdd(-4);
        }
        //设置一个线程每隔两秒启动
        try {
            Thread.sleep(2000);
        } catch (InterruptedException e) {
            e.printStackTrace();
        }
    }

声明一个 Handler,接收指令并更换视图

   private Handler viewHandler=new Handler(){
      public void handleMessage(Message msg){
          super.handleMessage(msg);
          //将当前的msg.what,也就是index的值置为当前page的值
          viewPager.setCurrentItem(msg.what);
      }
    };

监听viewPager按压,如果按压则停止线程,放开则继续

      viewPager.setOnTouchListener(new View.OnTouchListener() {
            @Override
            public boolean onTouch(View view, MotionEvent motionEvent) {
                switch (motionEvent.getAction()){
                    //如果状态为压下,则停止
                    case MotionEvent.ACTION_DOWN:
                        isContinue=false;
                        break;
                    case MotionEvent.ACTION_UP:
                        isContinue=true;
                        break;
                }
                return false;
            }
        });

全部代码

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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=".MainActivity">

  <LinearLayout
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:orientation="vertical">
      <RelativeLayout
          android:layout_width="match_parent"
          android:layout_height="wrap_content">
          <androidx.viewpager.widget.ViewPager
              android:id="@+id/vp_adv"
              android:layout_width="match_parent"
              android:layout_height="160dp">
          </androidx.viewpager.widget.ViewPager>
          <LinearLayout
              android:id="@+id/view_indicators"
              android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:layout_below="@+id/vp_adv"
              android:layout_marginTop="-25dp"
              android:gravity="right"
              android:orientation="horizontal">
          </LinearLayout>
      </RelativeLayout>
  </LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
MainActivity.java
package com.cdw.study6;

import androidx.annotation.NonNull;
import androidx.appcompat.app.AppCompatActivity;
import androidx.viewpager.widget.PagerAdapter;
import androidx.viewpager.widget.ViewPager;

import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.LinearLayout;

import java.util.ArrayList;
import java.util.List;
import java.util.concurrent.atomic.AtomicInteger;

public class MainActivity extends AppCompatActivity {
    private ImageView indicator;//表示圆点指示器
    private ImageView[] indicators;//保存四个圆点指示器的数组
    private boolean isContinue=true;
    private ViewPager viewPager;
    private ViewGroup group;
    private AtomicInteger index=new AtomicInteger();
    private Handler viewHandler=new Handler(){
      public void handleMessage(Message msg){
          super.handleMessage(msg);
          //将当前的msg.what,也就是index的值置为当前page的值
          viewPager.setCurrentItem(msg.what);
      }
    };

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initView();
    }
    private void initView(){
        viewPager=findViewById(R.id.vp_adv);
        group=findViewById(R.id.view_indicators);

        //四张广告图片添加到集合中进行保存
        List<View>listPics=new ArrayList<>();
        //第一张
        ImageView img1=new ImageView(this);
        img1.setBackgroundResource(R.drawable.img1);
        listPics.add(img1);
        //第二张
        ImageView img2=new ImageView(this);
        img2.setBackgroundResource(R.drawable.img2);
        listPics.add(img2);
        //第三张
        ImageView img3=new ImageView(this);
        img3.setBackgroundResource(R.drawable.img3);
        listPics.add(img3);
        //第四张
        ImageView img4=new ImageView(this);
        img4.setBackgroundResource(R.drawable.img4);
        listPics.add(img4);

        //动态设置四个圆点的属性
        indicators=new ImageView[listPics.size()];
        //遍历该数组一个个动态加载
        for (int i=0;i<indicators.length;i++){
            indicator=new ImageView(this);
            //设置这张图片在布局中的参数(指定宽度和高度)
            indicator.setLayoutParams(new LinearLayout.LayoutParams(40,40));
            //小圆点的间隔
            indicator.setPadding(5,5,5,5);
            //
            indicators[i]=indicator;
            if (i==0){
                indicators[i].setBackgroundResource(R.drawable.dian_f);
            }else {
                indicators[i].setBackgroundResource(R.drawable.dian_b);
            }
            group.addView(indicators[i]);
        }
        //设置viewPager的适配器
        viewPager.setAdapter(new MyPagerAdapter(listPics));
        //设置viewPager的监听器
        viewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            //当页面翻滚
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

            }
            //当页面被选中
            @Override
            public void onPageSelected(int position) {
                //记录当前位置
//                index.getAndSet(position);
                for (int i=0;i<indicators.length;i++){
                    //如果数组的当前下标就是当前位置
                    if (i==position){
                        indicators[i].setBackgroundResource(R.drawable.dian_f);
                    }else {
                        indicators[i].setBackgroundResource(R.drawable.dian_b);
                    }

                }
            }

            @Override
            public void onPageScrollStateChanged(int state) {

            }
        });

        viewPager.setOnTouchListener(new View.OnTouchListener() {
            @Override
            public boolean onTouch(View view, MotionEvent motionEvent) {
                switch (motionEvent.getAction()){
                    //如果状态为压下,则停止
                    case MotionEvent.ACTION_DOWN:
                        isContinue=false;
                        break;
                    case MotionEvent.ACTION_UP:
                        isContinue=true;
                        break;
                }
                return false;
            }
        });

        //使用多线程自动定时切换page
        new Thread(new Runnable() {
            @Override
            public void run() {
                while (true){
                    //循环一直执行,每隔两秒,通过Handler,发出一条消息带去当前ViewPager所显示的页的索引号
                    if (isContinue){
                        viewHandler.sendEmptyMessage(index.get());
                        whatOption();
                    }
                }

            }
        }).start();
    }
    private void whatOption(){
        index.incrementAndGet();//将当前位置值加1
        if (index.get()>indicators.length-1){
            index.getAndAdd(-4);
        }
        //设置一个线程每隔两秒启动
        try {
            Thread.sleep(2000);
        } catch (InterruptedException e) {
            e.printStackTrace();
        }
    }

}
//创建一个适配器
class MyPagerAdapter extends PagerAdapter{
    private List<View>viewList;
    //将集合作为构造方法的参数传递进来
    public MyPagerAdapter(List<View>viewList){
        this.viewList=viewList;
    }
    @Override
    public int getCount() {
        return viewList.size();
    }

    @Override
    public boolean isViewFromObject(@NonNull View view, @NonNull Object object) {
        return view==object;
    }

    //视图的创建,创建每一页viewpager的时候instantiateItem将会被自动调用
    @NonNull
    @Override
    public Object instantiateItem(@NonNull ViewGroup container, int position) {
        container.addView(viewList.get(position),0);
        return viewList.get(position);
    }
    //视图的移除
    @Override
    public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {
        container.removeView(viewList.get(position));
    }
}

万分感谢您在百忙之中阅读此文

结束

以上是关于Android ViewPager简单使用的主要内容,如果未能解决你的问题,请参考以下文章

Android使用片段在viewpager中的页面滚动上放置动画

Android TabLayout ViewPager 不会在 backstack 上膨胀标签片段

ViewPager 未从代码、android、eclipse 更新

使用viewpager时,片段不会全屏显示

在android中使用viewpager的带有多个片段的SearchView

滑动时 ViewPager 更新片段