带卡片叠的Android垂直视图寻呼机

qnzebej0  于 2023-01-24  发布在  Android
关注(0)|答案(5)|浏览(501)

我正在尝试实现一个垂直滑动ViewPager与堆栈卡一样的外观。
我能够使用ViewPager.PageTransformer和交换触摸点实现VerticalViewPager。我得到以下卡外观-x1c 0d1x
我想实现以下外观-

怎样才能达到这个效果呢?先谢了.

tcomlyy6

tcomlyy61#

要实现此垂直视图分页器而不依赖任何库,请执行以下步骤:
1.在您的activity_main.xml

<android.support.v4.view.ViewPager
    android:layout_gravity="center"
    android:layout_width="match_parent"
    android:layout_height="600dp"
    android:id="@+id/viewpager">
</android.support.v4.view.ViewPager>

1.在您的查看页内容.xml
您可以根据上图创建您想要的设计。
1.创建适配器模型类来保存数据。
4.在MainActivity.java中,在设置适配器和pageTransformer之后添加以下代码。

private class ViewPagerStack implements ViewPager.PageTransformer {
    @Override
    public void transformPage(View page, float position) {
        if (position >= 0) {
            page.setScaleX(0.7f - 0.05f * position);
            page.setScaleY(0.7f);
            page.setTranslationX(-page.getWidth() * position);
            page.setTranslationY(30 * position);
        }
    }
}

有关详细参考,您可以观看此视频:CLICK HERE
希望你能得到你所需要的输出!!

4szc88ey

4szc88ey2#

上面的解决方案都不适合我。这是我的解决方案:

我的页面转换器类:

class ViewPagerCardTransformer : ViewPager.PageTransformer {
  override fun transformPage(page: View, position: Float) {
    if (position >= 0) {
      page.scaleX = 0.9f - 0.05f * position
      page.scaleY = 0.9f
      page.alpha = 1f - 0.3f * position
      page.translationX = -page.width * position
      page.translationY = -30 * position
    } else {
      page.alpha = 1 + 0.3f * position
      page.scaleX = 0.9f + 0.05f * position
      page.scaleY = 0.9f
      page.translationX = page.width * position
      page.translationY = 30 * position
    }
  }
}

片段中的代码:

val adapter = MyPagerAdapter(pageItems)
viewPager.adapter = adapter
/*below line will increase the number of cards stacked on top of 
each other it is set to 1 by default. don't increase it too much as you
will end up with too much view page items in your memory
*/
mDaysViewPager.offscreenPageLimit = 3 
viewPager.setPageTransformer(true, ViewPagerCardTransformer())
zy1mlcev

zy1mlcev3#

您可以使用the SwipeStack library,它完全符合您的要求--它基本上是一个视图组,根据适配器实现膨胀视图,将它们一个放在另一个的顶部。

li9yvcax

li9yvcax4#

神奇之处就在这里https://github.com/yuyakaido/CardStackView。你可以很容易地定制你想要的。快乐编码:)

相关问题