android - Android：创建自定义recyclerview进入动画

Question

我正在尝试在 Android 的 RecyclerView 中重新创建我在网上找到的用于加载图片网格的动画。特别是，我正在尝试重新创建“Seker”运行效果。这是右侧底部的第三个选项：

https://tympanus.net/Development/GridLoadingAnimations/

我的应用程序中有一个回收站视图，显示了一个 2 列、3 行的图像网格，每当我第一次加载回收站视图项时，我希望以相同的“显示”效果显示这些图像。

我的第一个想法是创建一个项目动画 XML 和一个布局动画 XML，它将项目动画应用于布局中的每个子项：

项目动画 XML：

<alpha
    android:duration="400"
    android:fromAlpha="0"
    android:interpolator="@android:anim/linear_interpolator"
    android:toAlpha="1" />

<translate
    android:fromYDelta="100"
    android:toYDelta="0" />

<scale
    android:fromXScale="80%"
    android:fromYScale="80%"
    android:interpolator="@android:anim/accelerate_decelerate_interpolator"
    android:pivotX="50%"
    android:pivotY="50%"
    android:toXScale="100%"
    android:toYScale="100%" />

布局动画 XML：

<gridLayoutAnimation xmlns:android="http://schemas.android.com/apk/res/android"
    android:animation="@anim/item_animation_fall_down"
    android:animationOrder="normal"
    android:columnDelay="10%"
    android:direction="top_to_bottom|left_to_right"
    android:rowDelay="10%" />

然后我可以以编程方式触发布局动画：

private fun runLayoutAnimation() {
    val context = recyclerView.context
    val controller = AnimationUtils.loadLayoutAnimation(context, R.anim.layout_animation_xml)

    recyclerView.layoutAnimation = controller
    recyclerView.adapter?.notifyDataSetChanged()
    recyclerView.scheduleLayoutAnimation()
}

至少可以说，它看起来不一样。当我查看我试图模仿的网络版本背后的代码时（耶开源！），它看起来是两个串联运行的动画：

    'Seker': {

        revealer: true,

        revealerOrigin: '50% 100%',

        animeRevealerOpts: {

            duration: 500,

            delay: function(t,i) {

                return i*50;

            },

            easing: [0.7,0,0.3,1],

            translateY: [100,0],

            scaleY: [1,0]

        },

        animeOpts: {

            duration: 500,

            easing: [0.7,0,0.3,1],

            delay: function(t,i) {

                return i*50;

            },

            opacity: {

                value: [0,1],

                duration: 400,

                easing: 'linear'

            },

            translateY: [100,0],

            scale: [0.8,1]

        }

    }

https://github.com/codrops/GridLoadingAnimations/blob/master/js/main.js

动画不是我的强项，所以任何关于如何解决这个问题的建议都将不胜感激。

我的问题是：如何重新创建这些动画以加载回收站视图，尤其是因为它们似乎是两个动画？

标签： androidandroid-layoutanimationandroid-recyclerview