安卓基础学习 Day 20|安卓高级控件---翻页视图

翻页视图（ViewPager）

提出要求

保存图片

主布局资源文件

翻页视图（ViewPager）

翻页视图允许页面在水平方向左右滑动

提出要求

保存图片

我这里将图片放在mipmap中的，也可以放在drawable

放在drawable中的直接修改实体类

主布局资源文件


<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:orientation="vertical"
    tools:context=".MainActivity">
 
    <androidx.viewpager.widget.ViewPager
        android:id="@+id/vp_content"
        android:layout_width="match_parent"
        android:layout_height="370dp" />
 
</LinearLayout>

实体类

关于商品的图片和名称信息


import java.util.ArrayList;
 
public class GoodsInfo {
    public int id;
    public String name;//名称
    public String picPath;//大图的保存路径
    public int pic;//大图的资源编号
 
    //声明一个手机商品的名称数组
    private static String[] mNameArray = {
            "iPhone11", "Mate30", "小米10", "OPPO Reno3", "vivo X30", "荣耀30S"
    };
 
    //图片
    private static int[] mPicArray = {
            R.mipmap.iphone11, R.mipmap.mate30, R.mipmap.xiaomi10,
            R.mipmap.opporeno3, R.mipmap.vivox30, R.mipmap.rongyao30
    };
 
    public static ArrayList<GoodsInfo> getDefaultList() {
        ArrayList<GoodsInfo> goodsList = new ArrayList<>();
        for (int i = 0; i < mNameArray.length; i++) {
            GoodsInfo info = new GoodsInfo();
            info.id = i;
            info.name = mNameArray[i];
            info.pic = mPicArray[i];
            goodsList.add(info);
        }
        return goodsList;
    }
}

适配器类


import android.content.Context;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
 
import androidx.annotation.NonNull;
import androidx.viewpager.widget.PagerAdapter;
 
import java.util.ArrayList;
import java.util.List;
 
public class ImagePagerAdapater extends PagerAdapter {
    private final Context mContext;
    private final ArrayList<GoodsInfo> mGoodsList;
    //声明一个图像试图列表
    private List<ImageView> mViewList = new ArrayList<>();
 
    public ImagePagerAdapater(Context mContext, ArrayList<GoodsInfo> mGoodsList) {
        this.mContext = mContext;
        this.mGoodsList = mGoodsList;
 
        //给每个商品分配一个专用的图像视图
        for (GoodsInfo info : mGoodsList) {
            ImageView view = new ImageView(mContext);
            //设置宽高
            view.setLayoutParams(new ViewGroup.LayoutParams(
                    ViewGroup.LayoutParams.MATCH_PARENT,
                    ViewGroup.LayoutParams.WRAP_CONTENT
            ));
            view.setImageResource(info.pic);
            mViewList.add(view);
        }
    }
 
    @Override
    public int getCount() {
        return mViewList.size();
    }
 
    @Override
    public boolean isViewFromObject(@NonNull View view, @NonNull Object object) {
        return view == object;
    }
 
    //实例化指定位置的页面，并将其添加到容器中
    @NonNull
    @Override
    public Object instantiateItem(@NonNull ViewGroup container, int position) {//初始化
        //添加一个view到container中，而后返回到一个跟这个view可以关联起来的对象
        //这个对象可以是view自生，也能够是其余对象
        //关键是在isViewFromObject可以将view和这个object关联起来
        ImageView item = mViewList.get(position);
        container.addView(item);
        return item;
    }
 
    //从容器中销毁指定位置的页面
    @Override
    public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {//销毁
        container.removeView(mViewList.get(position));
    }
}

主界面


import androidx.appcompat.app.AppCompatActivity;
import androidx.viewpager.widget.ViewPager;
 
import android.os.Bundle;
import android.widget.Toast;
 
import java.util.ArrayList;
 
public class MainActivity extends AppCompatActivity implements ViewPager.OnPageChangeListener {
    ArrayList<GoodsInfo> mGoodsList;
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ViewPager vp_content = findViewById(R.id.vp_content);
        mGoodsList = GoodsInfo.getDefaultList();
        ImagePagerAdapater adapter = new ImagePagerAdapater(this, mGoodsList);
        vp_content.setAdapter(adapter);
 
        // 给翻页视图添加一个页面变更监听器
        vp_content.addOnPageChangeListener(this);
    }
 
    // 翻页状态改变时触发。state取值说明：0表示静止，1表示正在滑动，2表示滑动完毕
    // 在翻页过程中，状态值变化依次为：正在滑动-->滑动完毕-->静止
    @Override
    public void onPageScrollStateChanged(int state) {
 
    }
 
    // 在翻页过程中触发。该方法的三个参数取值说明：
    // 第一个参数表示当前页面的序号；
    // 第二个参数表示页面偏移的百分比，取值为0到1；
    // 第三个参数表示页面的偏移距离
    @Override
    public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
 
    }
 
    //在翻页结束后触发，position表示当前滑倒了哪一个界面
    @Override
    public void onPageSelected(int position) {
        Toast.makeText(MainActivity.this, "您当前浏览的手机品牌是" + mGoodsList.get(position).name, Toast.LENGTH_SHORT).show();
    }
}

实现效果

翻页标签栏（PagerTabStrip）

翻页标签栏能够在翻页视图上方显示页面标题，点击页面标题即可切换到对应页面

提出要求

主布局资源


<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:orientation="vertical"
    tools:context=".MainActivity">
 
    <androidx.viewpager.widget.ViewPager
        android:id="@+id/vp_content"
        android:layout_width="match_parent"
        android:layout_height="400dp">
 
        <androidx.viewpager.widget.PagerTabStrip
            android:id="@+id/pts_tap"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </androidx.viewpager.widget.ViewPager>
</LinearLayout>

这里的实体类和上面的一样

适配器类发生了小小的修改

添加上这个获取标签栏上的内容

主界面


import androidx.appcompat.app.AppCompatActivity;
import androidx.viewpager.widget.PagerTabStrip;
import androidx.viewpager.widget.ViewPager;
 
import android.graphics.Color;
import android.os.Bundle;
import android.util.TypedValue;
import android.widget.Toast;
 
import java.util.ArrayList;
 
public class MainActivity extends AppCompatActivity implements ViewPager.OnPageChangeListener {
    ArrayList<GoodsInfo> mGoodsList;
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initPagerStrip();
        initViewPager();
    }
 
    //初始化翻页标签
    private void initViewPager() {
        PagerTabStrip pts_tap = findViewById(R.id.pts_tap);
        //设置翻页标签栏的文本大小
        pts_tap.setTextSize(TypedValue.COMPLEX_UNIT_SP, 20);
        // 设置翻页标签栏的颜色
        pts_tap.setTextColor(Color.BLACK);
    }
 
    //初始化翻页视图
    private void initPagerStrip() {
        ViewPager vp_content = findViewById(R.id.vp_content);
        mGoodsList = GoodsInfo.getDefaultList();
        ImagePagerAdapater adapter = new ImagePagerAdapater(this, mGoodsList);
        vp_content.setAdapter(adapter);
 
        // 给翻页视图添加一个页面变更监听器
        vp_content.addOnPageChangeListener(this);
    }
 
    @Override
    public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
 
    }
 
    @Override
    public void onPageSelected(int position) {
        Toast.makeText(MainActivity.this, "您当前浏览的手机品牌是" + mGoodsList.get(position).name, Toast.LENGTH_SHORT).show();
 
    }
 
    @Override
    public void onPageScrollStateChanged(int state) {
 
    }
}

实现效果

简单的启动引导页

当用户安装一个新应用时，首次启动大多出现欢迎页面，这个引导因为要往右翻好几页，才会进入应用主页，这种启动引导页就是通过翻页试图实现的。

准备图片

【明日继续更】

相关阅读:
stable diffusion实践操作-LyCORIS
JSON端口操作实例
 接口自动化中cookies的处理技术
 【Leetcode】【每日一题】【中等】1465. 切割后面积最大的蛋糕
 wpf menu 菜单快捷键
 线性代数 --- 四个基本子空间（个人学习笔记）
C++——内联函数|auto关键字
 pytest-xdist分布式测试原理浅析
 drf-yasg 的 Swagger 文檔
 【Spring Boot】Day01
原文地址：https://blog.csdn.net/m0_64018773/article/details/125621470