如何在 viewpager 中显示片段之间的高程阴影?
How to show elevation shadow between fragments in a viewpager?
我有一个 ViewPager2,其中的页面是片段。用户可以从屏幕右侧在当前页面(静止)上方轻扫页面。我遇到的问题是,虽然在 viewpager 动画期间右侧页面的高度高于当前页面,但我似乎无法显示投影。缩小当前页面并降低 alpha(如下面的屏幕截图所示)效果不错,但这并不是我想要的。
这是我设置高度的页面转换器 (translationZ):
class DepthPageTransformer : ViewPager2.PageTransformer {
override fun transformPage(view: View, position: Float) {
view.apply {
val pageWidth = width
when {
position < -1 -> { // [-Infinity,-1)
// This page is way off-screen to the left.
alpha = 0f
}
position <= 0 -> { // [-1,0]
// Fade the page out
alpha = 1f + position
// Counteract the default slide transition
translationX = pageWidth * -position
translationZ = 0f
val scaleFactor = (MIN_SCALE + (1 - MIN_SCALE) * (1 - abs(position)))
scaleX = scaleFactor
scaleY = scaleFactor
}
position <= 1 -> { // (0,1]
// Use the default slide transition when moving to the right page
alpha = 1f
translationZ = 20f
scaleX = 1f
scaleY = 1f
}
else -> { // (1,+Infinity]
// This page is way off-screen to the right.
alpha = 0f
}
}
}
}
}
我已经在片段的 onCreateView
方法中设置了背景颜色(我认为高程阴影需要它):
val view = inflater.inflate(R.layout.fragment_item_list, container, false)
view.setBackgroundColor(Color.WHITE)
有人知道我可能遗漏了什么或做错了什么吗?谢谢。
这似乎是 ViewPager2 组件当前版本 (beta04) 的错误。阴影在较旧的 ViewPager 中正确显示。
与 Google 创建了一个 issue,希望他们能调查一下。
我有一个 ViewPager2,其中的页面是片段。用户可以从屏幕右侧在当前页面(静止)上方轻扫页面。我遇到的问题是,虽然在 viewpager 动画期间右侧页面的高度高于当前页面,但我似乎无法显示投影。缩小当前页面并降低 alpha(如下面的屏幕截图所示)效果不错,但这并不是我想要的。
这是我设置高度的页面转换器 (translationZ):
class DepthPageTransformer : ViewPager2.PageTransformer {
override fun transformPage(view: View, position: Float) {
view.apply {
val pageWidth = width
when {
position < -1 -> { // [-Infinity,-1)
// This page is way off-screen to the left.
alpha = 0f
}
position <= 0 -> { // [-1,0]
// Fade the page out
alpha = 1f + position
// Counteract the default slide transition
translationX = pageWidth * -position
translationZ = 0f
val scaleFactor = (MIN_SCALE + (1 - MIN_SCALE) * (1 - abs(position)))
scaleX = scaleFactor
scaleY = scaleFactor
}
position <= 1 -> { // (0,1]
// Use the default slide transition when moving to the right page
alpha = 1f
translationZ = 20f
scaleX = 1f
scaleY = 1f
}
else -> { // (1,+Infinity]
// This page is way off-screen to the right.
alpha = 0f
}
}
}
}
}
我已经在片段的 onCreateView
方法中设置了背景颜色(我认为高程阴影需要它):
val view = inflater.inflate(R.layout.fragment_item_list, container, false)
view.setBackgroundColor(Color.WHITE)
有人知道我可能遗漏了什么或做错了什么吗?谢谢。
这似乎是 ViewPager2 组件当前版本 (beta04) 的错误。阴影在较旧的 ViewPager 中正确显示。
与 Google 创建了一个 issue,希望他们能调查一下。