背景

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

实现方案1之效果1

• 效果

  
  
  静图
  
  
  动图
• 关键代码
  在ViewPager中设置如下三项属性

android:clipToPadding="false"
android:paddingLeft="20dp"
android:paddingRight="20dp"

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

<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" />

实现方案1之效果2

• 效果

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

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

• 效果

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

完整源代码(一共包括5种demo)

https://gitee.com/cxyzy1/viewPagerDemo/tree/master/showneighbour
https://gitee.com/cxyzy1/viewPagerDemo/tree/master/showneighbour2