Android中使用ViewPager实现一屏多页面的功能

最新推荐文章于 2024-09-06 16:52:55 发布

四月有雨

最新推荐文章于 2024-09-06 16:52:55 发布

阅读量3.1k

点赞数 1

分类专栏： Android 文章标签： android 一屏多页 viewpager

本文链接：https://blog.csdn.net/tangzhide/article/details/76507980

版权

本文介绍了如何在Android中利用ViewPager实现一屏显示多个页面的功能，强调了Adapter的getPageWidth()方法、clipChildren属性以及ShadowTransformer的使用。通过调整clipChildren属性，可以实现一屏显示两页或三页的效果，同时提供了代码示例和接口定义，帮助开发者进行自定义扩展。

摘要由CSDN通过智能技术生成

效果图【录制后使用扣扣秀视频制作的gif，看见水印请别见怪】：

这里写图片描述

实现的主要注意点【关于view pager的使用就忽略了】

1、
Adapter需要重写函数——
@Override
public float getPageWidth(int position)；

2、clipChildren属性的使用—-决定了一屏三页还是一屏两页，三页的就比如爱奇艺的横向滑动的左右两边有相互接壤的页面一部分，两页的就是效果图展示。
当前页所占屏幕宽度，不可以设置ViewPager属性clipToPadding=”false”
* 或者clipChildren=”false”,否则不起作用，设置clipToPadding=”false”同一屏幕将会出现三个页，true时仅有一个页。
3、
ShadowTransformer的使用。

下面上做过简要封装后的代码（代码中因为需要有三个部分的页面样式，故而有做过一个分组，具体可见Adapter抽象基类）：
1) 定义接口：

public interface ICardViewPagerAdapter {
   
    /*
    用于计算阴影
     */
    int MAX_ELEVATION_FACTOR = 8;
    /*
    CardView阴影
     */
    float getBaseElevation();

    View getCardViewAt(int position);

    int getCount();
    /**
     是否使用阴影效果【主要针对CardView言】
     false:
     app:cardElevation="0px" //阴影大小
     app:cardMaxElevation="2px"//最大阴影大小，该值最小2px
     app:cardUseCompatPadding="false"//不显示阴影
     app:contentPaddingBottom="-20dp"
     app:contentPaddingTop="-20dp"
     */
    boolean elevatieUsable();
}

2) Adapter基类实现

public abstract class CardPagerAdapter<T>  extends PagerAdapter implements ICardViewPagerAdapter {

    private List<View> mViews;
    /**
     * 数据源
     */
    private List<T> mResourceData;
    private float mBaseElevation;

    protected boolean isUsableEleVation = true;

    protected TypeInflateView mTypeInflateView;
    /**
     * 子控件-亨元.
     */
    private SparseArray<View> viewWidgets = new SparseArray<>();

    /**
     * 缓存-避免多次新建对象
     */
    private SparseArray<View> rootViews = new SparseArray<>();

    public boolean isUsableEleVation() {
        return isUsableEleVation;
    }

    public void setUsableEleVation(boolean usableEleVation) {
        isUsableEleVation = usableEleVation;
    }

    public CardPagerAdapter() {
        mResourceData = new ArrayList<>();
        mViews = new ArrayList<>();
    }

    public void addCardItem(T item) {
        mViews.add(null);
        mResourceData.add(item);
    }

    public void addAllCardItem(List<T> allData){
        mResourceData.addAll(allData);
        int i = 0;
        while (i < allData.size()){
            mViews.add(null);
            i++;
        }
    }

    public View findWidgetViewById(View view , int resId){
        View viewWidget = viewWidgets.get(resId);
        if (viewWidget == null){
            viewWidget = view.findViewById(resId);
            viewWidgets.put(resId, viewWidget);
        }
        return viewWidget;
    }

    public float getBaseElevation() {
        return mBaseElevation;
    }

    public enum TypeInflateView{
        FirstPageType, CenterPageType, LastPageType
    }

    /**
     * 当前页所占屏幕宽度，不可以设置ViewPager属性clipToPadding="false"
     * 或者clipChildren="false",否则不起作用，设置clipToPadding="false"同一屏幕将会出现三个页，true时仅有一个页。
     * @param position
     * @return
     */
    @Override
    public float