Question

当出现时，如何为RecyclerView项目设置动画？

默认项目animator仅在设置回收数据后添加或删除数据时动画。我是新开发的应用程序，并没有任何线索从哪里开始。

任何想法如何实现这一目标？

Answer 1

编辑：

根据the ItemAnimator documentation：

此类定义在对适配器进行更改时对项目进行的动画。

因此，除非您将项目逐个添加到RecyclerView并在每次迭代时刷新视图，否则我认为ItemAnimator不是您需要的解决方案。

以下是使用CustomAdapter显示RecyclerView项时动画的方式：

public class CustomAdapter extends RecyclerView.Adapter<CustomAdapter.ViewHolder>
{
    private Context context;

    // The items to display in your RecyclerView
    private ArrayList<String> items;
    // Allows to remember the last item shown on screen
    private int lastPosition = -1;

    public static class ViewHolder extends RecyclerView.ViewHolder
    {
        TextView text;
        // You need to retrieve the container (ie the root ViewGroup from your custom_item_layout)
        // It's the view that will be animated
        FrameLayout container;

        public ViewHolder(View itemView)
        {
            super(itemView);
            container = (FrameLayout) itemView.findViewById(R.id.item_layout_container);
            text = (TextView) itemView.findViewById(R.id.item_layout_text);
        }
    }

    public CustomAdapter(ArrayList<String> items, Context context)
    {
        this.items = items;
        this.context = context;
    }

    @Override
    public CustomAdapter.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType)
    {
        View v = LayoutInflater.from(parent.getContext()).inflate(R.layout.custom_item_layout, parent, false);
        return new ViewHolder(v);
    }

    @Override
    public void onBindViewHolder(ViewHolder holder, int position)
    {
        holder.text.setText(items.get(position));

        // Here you apply the animation when the view is bound
        setAnimation(holder.itemView, position);
    }

    /**
     * Here is the key method to apply the animation
     */
    private void setAnimation(View viewToAnimate, int position)
    {
        // If the bound view wasn't previously displayed on screen, it's animated
        if (position > lastPosition)
        {
            Animation animation = AnimationUtils.loadAnimation(context, android.R.anim.slide_in_left);
            viewToAnimate.startAnimation(animation);
            lastPosition = position;
        }
    }
}

你的custom_item_layout看起来像这样：

<FrameLayout
    android:id="@+id/item_layout_container"
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <TextView
        android:id="@+id/item_layout_text"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textAppearance="?android:attr/textAppearanceListItemSmall"
        android:gravity="center_vertical"
        android:minHeight="?android:attr/listPreferredItemHeightSmall"/>

</FrameLayout>

有关CustomAdapters和RecyclerView的详细信息，请参阅此training on the official documentation。

快速滚动的问题

使用此方法可能会导致快速滚动问题。在动画发生时，可以重复使用视图。为了避免建议在分离时清除动画。

    @Override
    public void onViewDetachedFromWindow(final RecyclerView.ViewHolder holder)
    {
        ((CustomViewHolder)holder).clearAnimation();
    }

在CustomViewHolder上：

    public void clearAnimation()
    {
        mRootLayout.clearAnimation();
    }

旧回答：

看看Gabriele Mariotti's repo，我很确定你会找到你需要的东西。他为RecyclerView提供了简单的ItemAnimators，例如SlideInItemAnimator或SlideScaleItemAnimator。

Answer 2

Recyclerview项目首次出现时，我动画淡出，如下面的代码所示。也许这对某人有用。

private final static int FADE_DURATION = 1000; //FADE_DURATION in milliseconds

@Override
public void onBindViewHolder(ViewHolder holder, int position) {

    holder.getTextView().setText("some text");

    // Set the view to fade in
    setFadeAnimation(holder.itemView);            
}

private void setFadeAnimation(View view) {
    AlphaAnimation anim = new AlphaAnimation(0.0f, 1.0f);
    anim.setDuration(FADE_DURATION);
    view.startAnimation(anim);
}

您还可以使用以下setFadeAnimation()替换setScaleAnimation()，以通过从某个点缩放来为项目的外观设置动画：

private void setScaleAnimation(View view) {
    ScaleAnimation anim = new ScaleAnimation(0.0f, 1.0f, 0.0f, 1.0f, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
    anim.setDuration(FADE_DURATION);
    view.startAnimation(anim);
}

当您滚动RecyclerView项时，上面的代码会有一些瑕疵，总是淡化或缩放。如果您希望可以添加代码以仅在首次创建包含RecyclerView的片段或活动时允许动画发生（例如，在创建时获取系统时间并且仅允许第一个FADE_DURATION毫秒的动画）。 p>

Answer 3

我从pbm's answer创建了动画，只有modification，只能运行一次

在另一个单词Animation appear with you scroll down only

private int lastPosition = -1;

private void setAnimation(View viewToAnimate, int position) {
    // If the bound view wasn't previously displayed on screen, it's animated
    if (position > lastPosition) {
        ScaleAnimation anim = new ScaleAnimation(0.0f, 1.0f, 0.0f, 1.0f, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
        anim.setDuration(new Random().nextInt(501));//to make duration random number between [0,501)
        viewToAnimate.startAnimation(anim);
        lastPosition = position;
    }
}

并在onBindViewHolder中调用函数

@Override
public void onBindViewHolder(ViewHolder holder, int position) {

holder.getTextView().setText("some text");

// call Animation function
setAnimation(holder.itemView, position);            
}

Answer 4

您可以将android:layoutAnimation="@anim/rv_item_animation"属性添加到RecyclerView，如下所示：

<android.support.v7.widget.RecyclerView
    android:layout_width="match_parent"
    android:layout_height="match_parent"                                        
    android:layoutAnimation="@anim/layout_animation_fall_down"
    />

感谢这里出色的文章： https://proandroiddev.com/enter-animation-using-recyclerview-and-layoutanimation-part-1-list-75a874a5d213

Answer 5

一个好的起点是： https://github.com/wasabeef/recyclerview-animators/blob/master/animators/src/main/java/jp/wasabeef/recyclerview/adapters/AnimationAdapter.java

你甚至不需要完整的图书馆，这个课程已经足够了。然后，如果你只是实现你的Adapter类给出这样的动画师：

# in the views.py
if form.is_valid():
    new_example = form.save(commit=False)
    if not form.cleaned_data['comment']:
      new_example.comment = ""
      new_example.save()

您会在滚动时看到从底部显示的项目，也可以避免快速滚动的问题。

Answer 6

在Recyclerview中将项目绑定到适配器中时，它们可能不是最好的主意，因为这可能会导致recyclerview中的项目以不同的速度生成动画。在我的情况下，recyclerview末尾的项目比它们的位置更快，然后顶部的项目进一步移动，所以它看起来不整洁。

我可以在此处找到我用于将每个项目设置为recyclelerview动画的原始代码：

http://frogermcs.github.io/Instagram-with-Material-Design-concept-is-getting-real/

但是我会复制并粘贴代码以防链接中断。

第1步：在onCreate方法中设置此项，以确保动画只运行一次：

if (savedInstanceState == null) {
    pendingIntroAnimation = true;
}

第2步：您需要将此代码放入要启动动画的方法中：

if (pendingIntroAnimation) {
    pendingIntroAnimation = false;
    startIntroAnimation();
}

在链接中，作者正在设置工具栏图标的动画，因此他将其放在此方法中：

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    getMenuInflater().inflate(R.menu.menu_main, menu);
    inboxMenuItem = menu.findItem(R.id.action_inbox);
    inboxMenuItem.setActionView(R.layout.menu_item_view);
    if (pendingIntroAnimation) {
        pendingIntroAnimation = false;
        startIntroAnimation();
    }
    return true;
}

第3步：现在编写startIntroAnimation（）的逻辑：

private static final int ANIM_DURATION_TOOLBAR = 300;

private void startIntroAnimation() {
    btnCreate.setTranslationY(2 * getResources().getDimensionPixelOffset(R.dimen.btn_fab_size));

    int actionbarSize = Utils.dpToPx(56);
    toolbar.setTranslationY(-actionbarSize);
    ivLogo.setTranslationY(-actionbarSize);
    inboxMenuItem.getActionView().setTranslationY(-actionbarSize);

    toolbar.animate()
            .translationY(0)
            .setDuration(ANIM_DURATION_TOOLBAR)
            .setStartDelay(300);
    ivLogo.animate()
            .translationY(0)
            .setDuration(ANIM_DURATION_TOOLBAR)
            .setStartDelay(400);
    inboxMenuItem.getActionView().animate()
            .translationY(0)
            .setDuration(ANIM_DURATION_TOOLBAR)
            .setStartDelay(500)
            .setListener(new AnimatorListenerAdapter() {
                @Override
                public void onAnimationEnd(Animator animation) {
                    startContentAnimation();
                }
            })
            .start();
}

我的首选替代方案：

我宁愿为整个Recyclerview设置动画，而不是在recyclerview中设置项目。

第1步和第2步保持不变。

在STEP 3中，只要您的API调用返回数据，我就会启动动画。

private void startIntroAnimation() {
    recyclerview.setTranslationY(latestPostRecyclerview.getHeight());
    recyclerview.setAlpha(0f);
    recyclerview.animate()
            .translationY(0)
            .setDuration(400)
            .alpha(1f)
            .setInterpolator(new AccelerateDecelerateInterpolator())
            .start();
}

这会激活整个回收者视图，使其从屏幕底部飞入。

Answer 7

在 recyclerview 适配器

中创建此方法

private void setZoomInAnimation(View view) {
        Animation zoomIn = AnimationUtils.loadAnimation(context, R.anim.zoomin);// animation file 
        view.startAnimation(zoomIn);
    }

最后在 onBindViewHolder

中添加这行代码

setZoomInAnimation(holder.itemView);

Answer 8

没有编码。

Visit Gist Link

  <?xml version="1.0" encoding="utf-8"?>
<layoutAnimation xmlns:android="http://schemas.android.com/apk/res/android"
    android:animation="@anim/item_animation_fall_down"
    android:animationOrder="normal"
    android:delay="15%" />

<translate
    android:fromYDelta="-20%"
    android:toYDelta="0"
    android:interpolator="@android:anim/decelerate_interpolator"
    />

<alpha
    android:fromAlpha="0"
    android:toAlpha="1"
    android:interpolator="@android:anim/decelerate_interpolator"
    />

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

在布局和recylcerview中使用，如：

<android.support.v7.widget.RecyclerView
            android:id="@+id/recycler_view"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layoutAnimation="@anim/layout_animation"
            app:layout_behavior="@string/appbar_scrolling_view_behavior" />

Answer 9

2019年，我建议将所有项目动画放入ItemAnimator。

让我们从在recycler视图中声明动画师开始吧：

with(view.recycler_view) {
adapter = Adapter()
itemAnimator = CustomAnimator()
}

然后声明自定义动画制作器，

class CustomAnimator() : DefaultItemAnimator() {

     override fun animateAppearance(
       holder: RecyclerView.ViewHolder,
       preInfo: ItemHolderInfo?,
       postInfo: ItemHolderInfo): Boolean{} // declare  what happens when a item appears on the recycler view

     override fun animatePersistence(
       holder: RecyclerView.ViewHolder,
       preInfo: ItemHolderInfo,
       postInfo: ItemHolderInfo): Boolean {} // declare animation for items that persist in a recycler view even when the items change

}

与上述类似，有一个用于消失animateDisappearance，用于添加animateAdd，用于更改animateChange并移动animateMove。

重要的一点是在其中调用正确的动画分派器。

Answer 10

我认为，最好像这样使用它：（在RecyclerView adapter 中仅覆盖一个方法）

override fun onViewAttachedToWindow(holder: ViewHolder) {
    super.onViewAttachedToWindow(holder)

    setBindAnimation(holder)
}

如果要在RV中添加每个附加动画。

如何在RecyclerView项目出现时为其设置动画

10 个答案: