一屏显示多个ViewPager的子item(中间显示完全，左右显示部分)

ViewPager多Item显示

最新推荐文章于 2025-08-20 18:34:09 发布

原创最新推荐文章于 2025-08-20 18:34:09 发布 · 1.4w 阅读

8 ·

CC 4.0 BY-SA版权

文章标签：

#viewpager #一屏多个item

学习笔记专栏收录该内容

65 篇文章

订阅专栏

本文介绍如何使用ViewPager在一屏内显示多个子项，并通过设置android:clipChildren=false解除子视图显示范围限制，实现更好的视觉效果。文章还提供了设置PageMargin及OffscreenPageLimit的方法。

这个就不上效果图了，大家应该都能想到样子。我之后的博客会用到这种效果，想看效果的朋友可以去看一下。

直接上代码：

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:clipChildren="false">

        <TextView
            android:id="@+id/tv_title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerHorizontal="true"
            android:layout_gravity="center_horizontal"
            android:text="显示多个item"
            android:paddingTop="60dp"
            android:paddingBottom="45dp"
            android:textColor="#fff"
            android:textSize="18sp"/>

        <android.support.v4.view.ViewPager
            android:layout_below="@+id/tv_title"
            android:id="@+id/vp_pager"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="45dp"
            android:layout_marginRight="45dp"
            android:layout_marginBottom="30dp"
            android:clipChildren="false"/>
    </RelativeLayout>

重点就是

android:clipChildren="false"

这个属性默认是true，作用就是限制子view在父View范围内显示。
注意RelativeLayout和ViewPager都要设置，否则没有效果。

在Activity中设置一下

mViewPager.setPageMargin(getResources().getDimensionPixelSize(R.dimen.page_margin));

mViewPager.setOffscreenPageLimit(3);

这样基本上就可以了，感觉效果不好的，可以自己再调整一下。

下一篇博客是关于ViewPager在一屏显示多个子item后的滑动效果的，欢迎大家结合着看。