ViewPager如何做到一屏显示多个页面

如图所示

如上图所示,中间完全显示,两边只显示一部分,那么用Viewpager我们怎么做到呢?

设置clipChildren属性

要实现这个效果,我们要用到clipChildren这个属性,对于这个属性,你可能还很陌生,当clipChildren为true时(默认显示为true),系统会将超出当前View的子页面切掉,就是仍然会显示这个View。
当clipChildren为false时,超出View的子页面,不会被切掉,仍然可以显示。
简单来说,如果你将clipChildren设置为true,那么不管你的子View设置为多大(后面会讲到如何设置左右间距),子View左右的View都不会显示,会用空白代替。
需要注意的是,需要把ViewPgaer和他的父布局都设置clipChildren为false,否则不会生效。

<FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:clipChildren="false"
        android:layout_alignParentBottom="true">

        <ViewPager
            android:layout_width="match_parent"
            android:layout_height="92dp"
            android:layout_gravity="bottom|center_horizontal"
            android:layout_marginBottom="20dp"
            android:background="@color/transparent"
            android:clipChildren="false" />
</FrameLayout>

设置ViewPager的LayoutParams

ViewGroup.LayoutParams layoutParams = mViewPager.getLayoutParams();
layoutParams.width = PhoneUtil.getScreenWidth(mContext) - PhoneUtil.dip2px(mContext, 80);
mViewPager.setLayoutParams(layoutParams);

这里的80dp/2就是你希望Viewpager的子页面左右的间距,可以自己调整。

设置左右页面缓存

mViewPager.setOffscreenPageLimit(2);

设置后可以优化滑动效果,左右两个页面足够了,太多会加大内存消耗,不建议。

补充

TopicPager.setPageMargin(PhoneUtil.dip2px(mContext, **));

这个方法可以结合上面的第二步使用,但其实不用也行,这个方法会给Viewpager的子View设置margin值,如果设置,会继续拉大Viewpager子View的间距。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容