ViewPager的使用

敬往事一杯酒哈

已于 2023-04-06 16:29:05 修改

阅读量2.8k

点赞数 2

分类专栏： UI 文章标签： android android studio ide

于 2022-08-16 10:10:04 首次发布

本文链接：https://blog.csdn.net/A125679880/article/details/126356183

版权

UI 专栏收录该内容

15 篇文章 1 订阅

订阅专栏

一、ViewPager的介绍

ViewPager的功能就是可以使视图滑动，就像Lanucher左右滑动或者自动滑动那样。ViewPager用于实现多页面的切换效果，该类存在于Google的兼容包androidx.viewpager.widget.ViewPager里面。

ViewPager是一个非常实用的安卓视图容器，可以用于创建具有多个页面的应用程序界面。ViewPager是一种实现滑动翻页效果的Android控件，通常用于展示图片、文章等多页内容。下面我们来介绍如何使用ViewPager。

二、例子：

效果图：

布局：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">
    <com.example.viewpagertest.MyViewPager
        android:id="@+id/view_pager"
        android:layout_width="match_parent"
        android:layout_height="200dp"/>


</RelativeLayout>

MainActivity的代码：

package com.example.viewpagertest;

import androidx.appcompat.app.AppCompatActivity;
import androidx.viewpager.widget.ViewPager;

import android.os.Bundle;
import android.os.Handler;
import android.view.View;
import android.widget.LinearLayout;

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

public class MainActivity extends AppCompatActivity implements MyViewPager.onViewPagerTouchListener {

    private MyViewPager mViewPager;
    // 定义集合，用来储存数据
    private static final List<Integer> mPic = new ArrayList<>();
    // 定义静态代码块，给集合添加数据
    static {
        mPic.add(R.drawable.img1);
        mPic.add(R.drawable.img2);
        mPic.add(R.drawable.img3);
    }
    private ViewPagerAdapter mAdapter;
    private Handler mHandler;
    private boolean mIsTouch = false;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        // 初始化界面
        initView();
        // 创建handler对象
        mHandler = new Handler();
    }

    @Override
    public void onAttachedToWindow() {
        super.onAttachedToWindow();
        // 绑定窗口时，启动任务(实现自动翻转)
        mHandler.post(mRunnable);
    }

    @Override
    public void onDetachedFromWindow() {
        // 销毁窗口时，取消任务
        super.onDetachedFromWindow();
        mHandler.removeCallbacks(mRunnable);
    }


    private Runnable mRunnable = new Runnable() {
        @Override
        public void run() {
            // 用mIsTouch来控制是否翻转
            if(!mIsTouch){
                int currentItem = mViewPager.getCurrentItem();
                // 这里实现了图片自动翻转
                mViewPager.setCurrentItem(++currentItem,true);
            }
            // 每次任务完成后，就停3秒，然后再启动任务
            mHandler.postDelayed(this,3000);
        }
    };

    private void initView() {
        // 找到viewpager控件
        mViewPager = this.findViewById(R.id.view_pager);
        // 创建适配器
        mAdapter = new ViewPagerAdapter(mPic);
        // 设置适配器
        mViewPager.setAdapter(mAdapter);
        // 设置触摸接口,重写onTouch方法
        mViewPager.setOnViewPagerTouchListener(this);
        // 设置当前界面
        mViewPager.setCurrentItem(mPic.size()*100,true);
    }
    @Override
    public void onTouch(boolean isTouch) {
        // 将类MyViewPager传过来的mIsTouch的值赋给isTouch，来控制图片的自动翻转
        mIsTouch = isTouch;
    }
}

适配器：

package com.example.viewpagertest;

import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;

import androidx.annotation.NonNull;
import androidx.viewpager.widget.PagerAdapter;
import java.util.List;
public class ViewPagerAdapter extends PagerAdapter {
    private final List<Integer> mPic;
    // 这里是获取MainActivity传过来的图片数据
    public ViewPagerAdapter(List<Integer> pic){
        mPic = pic;
    }
    @NonNull
    @Override
    public Object instantiateItem(@NonNull ViewGroup container, int position) {
        // 图片的真实位置
        int realPosition = position % mPic.size();
        // 创建imageView对象
        ImageView imageView = new ImageView(container.getContext());
        // 将图片拉伸
        imageView.setScaleType(ImageView.ScaleType.FIT_XY);
        // 绑定图片
        imageView.setImageResource(mPic.get(realPosition));
        // 将图片加到容器里面
        container.addView(imageView);
        return imageView;
    }

    @Override
    public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {
        // 当销毁时，容器移除图片，释放资源
        container.removeView((View) object);
    }
    // 这方法是实现翻转多少次
    @Override
    public int getCount() {
        if (mPic != null) {
            // 这里返回一个很大的数，表示可以翻转很多很多次（相当于实现图片无限翻转）。
            return Integer.MAX_VALUE;
        }
        return 0;
    }

    @Override
    public boolean isViewFromObject(@NonNull View view, @NonNull Object object) {
        // 这里一般写成下面的样子就可以了
        return view == object;
    }
}

实现 PagerAdapter 时，必须至少重写以下方法：

`instantiateItem`	为给定位置创建页面。
`destroyItem`	删除给定位置的页面。
`getCount`	返回可用的视图数
`isViewFromObject`	确定页面 View 是否与返回的特定键对象相关联。一般写成：return view == object

MyViewPager类：

package com.example.viewpagertest;

import android.content.Context;
import android.util.AttributeSet;
import android.view.MotionEvent;
import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import androidx.viewpager.widget.ViewPager;

public class MyViewPager extends ViewPager {

    private onViewPagerTouchListener mListener = null;

    public MyViewPager(@NonNull Context context) {
        super(context);
    }
    public MyViewPager(@NonNull Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
    }
    // 这里是监听触摸事件
    @Override
    public boolean onTouchEvent(MotionEvent ev) {
        switch (ev.getAction()) {
            // 这里是指当用户按着图片的时候
            case MotionEvent.ACTION_DOWN:
                if (mListener != null) {
                    // 调用onTouch方法，将isTouch（true）传到MainActivity，实现图片停止自动翻转
                    mListener.onTouch(true);
                }
                break;
                // 这里是指当手松开的时候
            case MotionEvent.ACTION_CANCEL:
            case MotionEvent.ACTION_UP:
                if (mListener != null) {
                    // 调用onTouch方法，将isTouch（false）传到MainActivity，实现图片继续翻转
                    mListener.onTouch(false);
                }
                break;
        }
        return super.onTouchEvent(ev);
    }
    // 下面是用了接口的回调
    // 设置回调方法
    public void setOnViewPagerTouchListener(onViewPagerTouchListener listener){
        mListener = listener;
    }
    // 定义接口
    public interface onViewPagerTouchListener{
        // 定义一个onTouch方法
        void onTouch(boolean isTouch);
    }
}