ViewPager可以在每个页面有多个视图吗?
在尝试了图库和水平滚动视图后,我发现View Pager可以完成我所需要的function,但是还有一个小小的缺失。 查看传呼机可以每页有多个视图吗?
我知道View Pager每次只能显示1个视图/页面。 我想知道如果我可以限制我的意见宽度,所以我的第二个视图后面会显示?
例如:我有3个视图,我希望屏幕显示视图1和视图2的一部分,所以用户知道有更多的内容,所以他们可以刷卡查看2。
|view 1|view 2|view 3| |screen |
通过为ViewPager指定负边距,我发现了一个更简单的解决scheme。 我已经在GitHub上创build了MultiViewPager项目,你可能想看看:
尽pipeMultiViewPager需要一个用于指定尺寸的子视图,但是原则还是围绕设置页面边距进行的:
ViewPager.setPageMargin( getResources().getDimensionPixelOffset(R.dimen.viewpager_margin));
然后我在我的dimens.xml
指定了这个维度:
<dimen name="viewpager_margin">-64dp</dimen>
为了弥补重叠的页面,每个页面的内容视图都有相反的余量:
android:layout_marginLeft="@dimen/viewpager_margin_fix" android:layout_marginRight="@dimen/viewpager_margin_fix"
再次在dimens.xml
:
<dimen name="viewpager_margin_fix">32dp</dimen>
(请注意, viewpager_margin_fix
尺寸是绝对viewpager_margin
尺寸的一半。)
我们在荷兰的报纸应用De Telegraaf Krant中实现了这个function :
马克墨菲有一个有趣的博客文章解决这个问题 。 尽pipe我最终在这个主题中使用了自己的解决scheme ,但是值得一提的是Dave Smith的代码,Mark在博客文章中引用了这个代码:
警告! 在采取这种方法之前,请注意这个方法中的一些非常严重的问题,在本文末尾和下面的评论中提到。
你会最终这样做:
它通过将ViewPager
包装到FrameLayout
的子类中,将其设置为特定的大小并调用setClipChildren(false)
。 这会阻止Android剪切超出ViewPager
边界的ViewPager
,并在视觉上实现您想要的效果。
在XML中,它非常简单:
<com.example.pagercontainer.PagerContainer android:id="@+id/pager_container" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="#CCC"> <android.support.v4.view.ViewPager android:layout_width="150dp" android:layout_height="100dp" android:layout_gravity="center_horizontal" /> </com.example.pagercontainer.PagerContainer>
添加一些代码,用于处理ViewPager
外部的触摸事件,并在滚动时使显示无效,从而完成。
这就是说,虽然这一般工作很好,但我注意到有一个边缘情况下,这个相当简单的结构没有解决:在ViewPager
上调用setCurrentPage()
。 我能find解决这个问题的唯一方法是通过ViewPager
本身,并使其invalidate()
函数也使PagerContainer
无效。
可以在同一个屏幕上显示多个页面。 其中一种方法是通过覆盖PAgerAdapter中的getPageWidth()方法。 getPageWidth()返回一个介于0和1之间的浮点数,表示页面占用多lessViewpager的宽度。 默认情况下,它被设置为1.所以,你可以把它改成你想要的宽度。 你可以阅读更多关于这里 & github项目 。
这是我如何得到它:
<android.support.v4.view.ViewPager android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_gravity="center" android:layout_marginBottom="8dp" android:clipToPadding="false" android:gravity="center" android:paddingLeft="36dp" android:paddingRight="36dp"/>
在活动中,我使用这个:
markPager.setPageMargin(64);
希望它有帮助!
我有同样的问题,唯一的区别,我需要一次显示3页(前,现在和下一页)。 在经过了很长时间的研究之后,我觉得我find了最好的解决scheme。 解决scheme是这里几个答案的组合:
正如@Paul Lammertsma的回答所指出的 – Dave Smith在Mark Murphy博客中的代码是解决scheme的基础。 对我来说唯一的问题是,由于ViewPager
在xml文件中的大小, ViewPager
只能在屏幕的顶部显示:
android:layout_width="150dp" android:layout_height="100dp"
这不利于我的目的,因为我正在寻找一些将在整个屏幕上传播的东西。 所以我改变它来包装的内容,你可以看到这里:
<com.example.nutrino_assignment.PagerContainer android:id="@+id/pager_container" android:layout_width="match_parent" android:layout_height="match_parent" android:background="#CCC"> <android.support.v4.view.ViewPager android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" /> </com.example.nutrino_assignment.PagerContainer>
现在我失去了教程所要做的一切。 使用@ andro的答案,我能够一次显示多于1页:正好2! 目前和未来。 是否按如下重写:
@Override public float getPageWidth(int position) { return(0.9f); }
这几乎是我所需要的…(尽pipe我认为它足以满足你所要求的),但是对于其他需要类似我所需要的东西的人来说:对于解决scheme的最后部分,我在这个答案中使用了这个想法,再次由@Paul Lammertsma。 在Dave Smith的代码中,你可以在onCreate
方法中find这一行:
//A little space between pages pager.setPageMargin(15);
我replace为:
//A little space between pages pager.setPageMargin(-64);
现在在第一页看起来:
|view 1|view 2|view 3| |screen |
而在2日看起来像:
|view 1|view 2|view 3| |screen |
希望它会帮助别人! 我浪费了2天的时间…祝你好运。
viewPager.setPageMargin(-18);// adjust accordingly ,-means less gap
在imageadapter
private class ImagePagerAdapter2 extends PagerAdapter { private int[] mImages = new int[] { R.drawable.add1, R.drawable.add3, R.drawable.add4, R.drawable.add2, }; @Override public float getPageWidth(int position) { return .3f; }
调整返回值…较小意味着更多的图像…… 0.3意味着一次至less3个图像。
LayoutParams lp = new LayoutParams(width,height); viewpager.setLayoutParams(lp);