英文:
ViewPager2 Stack PageTransform
问题
我需要一些关于 ViewPager2 的 PageTransformer
的帮助。
我的 ViewPager2 中有3个页面。
每个页面都应该被下一个页面部分覆盖。
此外,这些页面都应该紧紧居中,只能侧滑。
示例:
页面1:蓝色
页面2:紫色
页面3:绿色
页面1被页面2部分覆盖,页面2被页面3部分覆盖。
我已经设置第3页可以首先显示,通过将 currentItem
设置为2。
您可以看到绿色的页面,如果向右滑动,您应该能够看到紫色的页面(即使在滑动过程中)。
然后,如果您将紫色的页面向右滑动,您应该可以看到蓝色的页面。
页面不应该移动(除了向侧边移动,当然)。
类似于这个示例,但重叠的方式相反,因为我从第3页开始,且不改变缩放。(透明度的变化 是完全可以的,也是期望的)。
希望有人能够帮助我,提前感谢。
英文:
I need some help with a PageTransformer for ViewPager2.
I have 3 pages in my ViewPager2.
Each page should be overlapped by the next.
In addition, the pages should all be firmly in the middle and only be slidable to the side.
<br><br>
Example:<br>
Page 1: blue color<br>
Page 2: purple color<br>
Page 3: green color
Page 1 is overlapped by Page 2 and page 2 is overlapped by Page 3.
I have set that the 3rd page can be seen first by setting the currentItem to 2
You can see the green page and if you push it to the right you should be able to see the purple page (even while pushing)
If you then push the purple page to the right you should see the blue page
And the pages should not move (except to the side of course)
Something similar to this but the overlap the other way around because i start at page 3 and without changing the scaling. (The alpha change is totally okay and wanted)
I hope someone can help me and thanks in advance
答案1
得分: 1
几个小时的尝试后,我得到了期望的结果。
class StackTransformer : ViewPager2.PageTransformer {
override fun transformPage(view: View, position: Float) {
view.apply {
when {
position < -1 -> {
alpha = 0f
}
position <= 0 -> {
alpha = 1 - position
translationX = width * -position
ViewCompat.setTranslationZ(this, -1f)
}
position <= 1 -> {
alpha = 1f
translationX = 0f
ViewCompat.setTranslationZ(this, 0f)
}
else -> {
alpha = 0f
}
}
}
}
}
英文:
After a few hours of trying, I have the desired result
class StackTransformer : ViewPager2.PageTransformer {
override fun transformPage(view: View, position: Float) {
view.apply {
when {
position < -1 -> {
alpha = 0f
}
position <= 0 -> {
alpha = 1 - position
translationX = width * -position
ViewCompat.setTranslationZ(this, -1f)
}
position <= 1 -> {
alpha = 1f
translationX = 0f
ViewCompat.setTranslationZ(this, 0f)
}
else -> {
alpha = 0f
}
}
}
}
}
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论