具有上一页和下一页边界的ViewPager

我正在devise一个多页的视图。 我希望前面的和下一个页面的边缘像下面一样显示，实现一个两指滑动来切换页面。

我尝试使用ViewPager负面页边距如这里所build议的，但只显示在屏幕上的边缘之一，而不是两个同时。

或者，有什么办法可以将我的视图的一部分ViewPager在屏幕之外，然后给它赋予一个ViewPagertypes的效果。

我应该怎么做呢？ 谢谢 ！

Answer 1

引用自己在这个主题上的博客文章 ：

第三种方法来自着名书籍Android Recipes的合着者Dave Smith。 他走了一个非常不同的方向，使用一个自定义的容器，禁用儿童裁剪一次显示多个页面。

他公布的示例代码显示了整个行动。 他的容器（ com.example.pagercontainer.PagerContainer ）包装ViewPager并调用setClipChildren(false); 所以即使ViewPager专注于一个选定的页面，其他具有超出ViewPager边界的坐标的页面仍然可见，只要它们适合在PagerContainer 。 通过将ViewPager大小ViewPager为小于PagerContainer ， ViewPager可以将其页面大小设置为该大小，为其他页面留出空间。 但是， PagerContainer需要帮助一些触摸事件，因为ViewPager只能在自己的可见边界上处理滑动事件，忽略任何可见的页面。

Answer 2

1. 为整个项目视图设置左右填充。 示例xml（page_item.xml）：

    <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:paddingLeft="20dp" android:paddingRight="20dp"/> <TextView android:id="@+id/text1" android:text="Large Text" android:textAppearance="?android:attr/textAppearanceLarge" /> </LinearLayout> 

2. 然后将PageView负页面边距设置为2 *（以前的视图填充）

    int margin = (int)TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 20*2, getResources().getDisplayMetrics()); mViewPager.setPageMargin(-margin); 

3. 可选的。 将第一个项目的零左填充和零右填充设置为最后一个项目以隐藏空白边缘。 您可以在PageAdapter或Page片段中执行此操作。

Answer 3

我有一个类似的解决scheme：

在viewpager上设置左右填充，例如20dp。 也可以在viewpager上设置页面边距，例如传呼机填充的一半。 不要忘记禁用剪辑填充。

 tilePager.setPadding(defaultGap, 0, defaultGap, 0); tilePager.setClipToPadding(false); tilePager.setPageMargin(halfGap); 

Answer 4

要显示左侧和右侧页面的预览，请设置以下两个值

 viewpager.setClipToPadding(false) viewpager.setPadding(left,0,right,0) 

如果你在viewpager的两个页面之间需要空间，那么添加viewpager.setPageMargin（int）

Android ViewPager – 在左侧和右侧显示页面的预览

Answer 5

从这里下载源代码（ 带有上一页和下一页边界的ViewPager ）

MainActivity.java

 package com.deepshikha.viewpager; import android.content.Context; import android.content.res.Configuration; import android.os.Build; import android.support.v4.app.Fragment; import android.support.v4.app.FragmentActivity; import android.support.v4.app.FragmentManager; import android.support.v4.app.FragmentPagerAdapter; import android.support.v4.app.FragmentStatePagerAdapter; import android.support.v4.view.ViewPager; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.util.DisplayMetrics; import android.util.Log; import android.util.SparseArray; import android.view.ViewGroup; import java.util.ArrayList; import java.util.List; public class MainActivity extends FragmentActivity { ViewPager pager; MyPageAdapter obj_adapter; String str_device; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); init(); } private void init() { pager = (ViewPager) findViewById(R.id.viewpager); differentDensityAndScreenSize(getApplicationContext()); List<Fragment> fragments = getFragments(); pager.setAdapter(obj_adapter); pager.setClipToPadding(false); if (str_device.equals("normal-hdpi")){ pager.setPadding(160, 0, 160, 0); }else if (str_device.equals("normal-mdpi")){ pager.setPadding(160, 0, 160, 0); }else if (str_device.equals("normal-xhdpi")){ pager.setPadding(160, 0, 160, 0); }else if (str_device.equals("normal-xxhdpi")){ pager.setPadding(180, 0, 180, 0); }else if (str_device.equals("normal-xxxhdpi")){ pager.setPadding(180, 0, 180, 0); }else if (str_device.equals("normal-unknown")){ pager.setPadding(160, 0, 160, 0); }else { } obj_adapter = new MyPageAdapter(getSupportFragmentManager(), fragments); pager.setPageTransformer(true, new ExpandingViewPagerTransformer()); pager.setAdapter(obj_adapter); } class MyPageAdapter extends FragmentPagerAdapter { private List<Fragment> fragments; public MyPageAdapter(FragmentManager fm, List<Fragment> fragments) { super(fm); this.fragments = fragments; } @Override public Fragment getItem(int position) { return this.fragments.get(position); } @Override public int getCount() { return this.fragments.size(); } } private List<Fragment> getFragments() { List<Fragment> fList = new ArrayList<Fragment>(); fList.add(MyFragment.newInstance("Fragment 1",R.drawable.imags)); fList.add(MyFragment.newInstance("Fragment 2",R.drawable.image1)); fList.add(MyFragment.newInstance("Fragment 3",R.drawable.image2)); fList.add(MyFragment.newInstance("Fragment 4",R.drawable.image3)); fList.add(MyFragment.newInstance("Fragment 5",R.drawable.image4)); return fList; } public int differentDensityAndScreenSize(Context context) { int value = 20; String str = ""; if ((context.getResources().getConfiguration().screenLayout & Configuration.SCREENLAYOUT_SIZE_MASK) == Configuration.SCREENLAYOUT_SIZE_SMALL) { switch (context.getResources().getDisplayMetrics().densityDpi) { case DisplayMetrics.DENSITY_LOW: str = "small-ldpi"; // Log.e("small 1","small-ldpi"); value = 20; break; case DisplayMetrics.DENSITY_MEDIUM: str = "small-mdpi"; // Log.e("small 1","small-mdpi"); value = 20; break; case DisplayMetrics.DENSITY_HIGH: str = "small-hdpi"; // Log.e("small 1","small-hdpi"); value = 20; break; case DisplayMetrics.DENSITY_XHIGH: str = "small-xhdpi"; // Log.e("small 1","small-xhdpi"); value = 20; break; case DisplayMetrics.DENSITY_XXHIGH: str = "small-xxhdpi"; // Log.e("small 1","small-xxhdpi"); value = 20; break; case DisplayMetrics.DENSITY_XXXHIGH: str = "small-xxxhdpi"; //Log.e("small 1","small-xxxhdpi"); value = 20; break; case DisplayMetrics.DENSITY_TV: str = "small-tvdpi"; // Log.e("small 1","small-tvdpi"); value = 20; break; default: str = "small-unknown"; value = 20; break; } } else if ((context.getResources().getConfiguration().screenLayout & Configuration.SCREENLAYOUT_SIZE_MASK) == Configuration.SCREENLAYOUT_SIZE_NORMAL) { switch (context.getResources().getDisplayMetrics().densityDpi) { case DisplayMetrics.DENSITY_LOW: str = "normal-ldpi"; // Log.e("normal-ldpi 1","normal-ldpi"); str_device = "normal-ldpi"; value = 82; break; case DisplayMetrics.DENSITY_MEDIUM: // Log.e("normal-mdpi 1","normal-mdpi"); str = "normal-mdpi"; value = 82; str_device = "normal-mdpi"; break; case DisplayMetrics.DENSITY_HIGH: // Log.e("normal-hdpi 1","normal-hdpi"); str = "normal-hdpi"; str_device = "normal-hdpi"; value = 82; break; case DisplayMetrics.DENSITY_XHIGH: //Log.e("normal-xhdpi 1","normal-xhdpi"); str = "normal-xhdpi"; str_device = "normal-xhdpi"; value = 90; break; case DisplayMetrics.DENSITY_XXHIGH: // Log.e("normal-xxhdpi 1","normal-xxhdpi"); str = "normal-xxhdpi"; str_device = "normal-xxhdpi"; value = 96; break; case DisplayMetrics.DENSITY_XXXHIGH: //Log.e("normal-xxxhdpi","normal-xxxhdpi"); str = "normal-xxxhdpi"; str_device = "normal-xxxhdpi"; value = 96; break; case DisplayMetrics.DENSITY_TV: //Log.e("DENSITY_TV 1","normal-mdpi"); str = "normal-tvdpi"; str_device = "normal-tvmdpi"; value = 96; break; default: // Log.e("normal-unknown","normal-unknown"); str = "normal-unknown"; str_device = "normal-unknown"; value = 82; break; } } else if ((context.getResources().getConfiguration().screenLayout & Configuration.SCREENLAYOUT_SIZE_MASK) == Configuration.SCREENLAYOUT_SIZE_LARGE) { switch (context.getResources().getDisplayMetrics().densityDpi) { case DisplayMetrics.DENSITY_LOW: str = "large-ldpi"; // Log.e("large-ldpi 1","normal-ldpi"); value = 78; break; case DisplayMetrics.DENSITY_MEDIUM: str = "large-mdpi"; //Log.e("large-ldpi 1","normal-mdpi"); value = 78; break; case DisplayMetrics.DENSITY_HIGH: //Log.e("large-ldpi 1","normal-hdpi"); str = "large-hdpi"; value = 78; break; case DisplayMetrics.DENSITY_XHIGH: // Log.e("large-ldpi 1","normal-xhdpi"); str = "large-xhdpi"; value = 125; break; case DisplayMetrics.DENSITY_XXHIGH: //Log.e("large-ldpi 1","normal-xxhdpi"); str = "large-xxhdpi"; value = 125; break; case DisplayMetrics.DENSITY_XXXHIGH: // Log.e("large-ldpi 1","normal-xxxhdpi"); str = "large-xxxhdpi"; value = 125; break; case DisplayMetrics.DENSITY_TV: //Log.e("large-ldpi 1","normal-tvdpi"); str = "large-tvdpi"; value = 125; break; default: str = "large-unknown"; value = 78; break; } } else if ((context.getResources().getConfiguration().screenLayout & Configuration.SCREENLAYOUT_SIZE_MASK) == Configuration.SCREENLAYOUT_SIZE_XLARGE) { switch (context.getResources().getDisplayMetrics().densityDpi) { case DisplayMetrics.DENSITY_LOW: // Log.e("large-ldpi 1","normal-ldpi"); str = "xlarge-ldpi"; value = 125; break; case DisplayMetrics.DENSITY_MEDIUM: // Log.e("large-ldpi 1","normal-mdpi"); str = "xlarge-mdpi"; value = 125; break; case DisplayMetrics.DENSITY_HIGH: //Log.e("large-ldpi 1","normal-hdpi"); str = "xlarge-hdpi"; value = 125; break; case DisplayMetrics.DENSITY_XHIGH: // Log.e("large-ldpi 1","normal-hdpi"); str = "xlarge-xhdpi"; value = 125; break; case DisplayMetrics.DENSITY_XXHIGH: // Log.e("large-ldpi 1","normal-xxhdpi"); str = "xlarge-xxhdpi"; value = 125; break; case DisplayMetrics.DENSITY_XXXHIGH: // Log.e("large-ldpi 1","normal-xxxhdpi"); str = "xlarge-xxxhdpi"; value = 125; break; case DisplayMetrics.DENSITY_TV: //Log.e("large-ldpi 1","normal-tvdpi"); str = "xlarge-tvdpi"; value = 125; break; default: str = "xlarge-unknown"; value = 125; break; } } return value; } } 

Answer 6

前段时间我需要这样的function，并准备了一个使用RecyclerView和PagerSnapHelper的小型库（在v7支持库的版本25.1.0中添加），而不是传统的ViewPager ：

MetalRecyclerPagerView – 你可以在那里find所有的代码和例子。

主要由一个类文件组成： MetalRecyclerViewPager.java （和两个xmls： attrs.xml和ids.xml ）。

希望它有助于某人:)