Viewpager显示前后两页部分界面

作者: 蓝不蓝编程 | 来源:发表于2019-07-29 18:01 被阅读5次

    背景

    UI设计中,为了提醒用户当前是一个可横向滑动的列表,所以在显示时,希望显示出前后两页部分界面.

    实现方案1及效果

    • 效果


      静图
      动图
    • 关键代码
      在ViewPager中设置如下三项属性
    android:clipToPadding="false"
    android:paddingLeft="20dp"
    android:paddingRight="20dp"
    

    完整代码如下(也可以通过代码中设置)

    <androidx.viewpager.widget.ViewPager
        android:id="@+id/viewPager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:clipToPadding="false"
        android:paddingLeft="20dp"
        android:paddingRight="20dp" />
    

    实现方案2及效果(代码复杂一些,但是更加炫酷)

    • 效果


      静图
      动图
    • 代码
      因代码较多,请直接下载源代码库查看showneighbour2工程

    源代码

    https://github.com/cxyzy1/viewPagerDemos/tree/master/showNeighbours

    相关文章

      网友评论

        本文标题:Viewpager显示前后两页部分界面

        本文链接:https://www.haomeiwen.com/subject/ookirctx.html