Question

我正在尝试实现我自己的recyclelerview动画 - 我想在不使用任何外部库的情况下实现这一点。这是理论动画应该的样子。

enter image description here

用户单击列表上的项目并发生动画，从而打开另一个视图。

在具有最少代码的高级别上，可能只是伪代码，为了创建这样的动画，该过程会是什么？

另外我想注意，如果用户点击相同的项目或其他项目，动画也应该能够反向完成

我对RecyclerView课程并不熟悉，并希望了解更多相关内容以及与之相关的任何动画。

Answer 1

解决方案：

我解决此问题的方法是为View.OnClickListener类ViewHolder实现一个监听器extends RecyclerView.ViewHolder。所以我们得到以下代码：

public static class ExampleViewHolder extends RecyclerView.ViewHolder 
    implements View.OnClickListener {

    private int originalHeight = 0;
    private boolean isViewExpanded = false;
    private YourCustomView yourCustomView

    // ..... CODE ..... //

}

变量originalHeight和isViewExpanded用于动画过程。在构造函数中，我将视图初始化为View.OnClickListener，如下所示：

public ExampleViewHolder(View v) {
     super(v);
     v.setOnClickListener(this);

     // Initialize other views, like TextView, ImageView, etc. here

     // If isViewExpanded == false then set the visibility 
     // of whatever will be in the expanded to GONE

     if (isViewExpanded == false) {
         // Set Views to View.GONE and .setEnabled(false)
         yourCustomView.setVisibility(View.GONE);
         yourCustomView.setEnabled(false);
     }

 }

现在已经处理了构造函数，我们想要配置当用户单击单个RecyclerView项时发生的事情。这里有用的类将是ValueAnimator和Animation对象。我们覆盖onClick方法，以实现此目的：

@Override
public void onClick(final View view) {
    // If the originalHeight is 0 then find the height of the View being used 
    // This would be the height of the cardview
    if (originalHeight == 0) {
            originalHeight = view.getHeight();
        }

    // Declare a ValueAnimator object
    ValueAnimator valueAnimator;
        if (!mIsViewExpanded) {
            yourCustomView.setVisibility(View.VISIBLE);
            yourCustomView.setEnabled(true);
            mIsViewExpanded = true;
            valueAnimator = ValueAnimator.ofInt(originalHeight, originalHeight + (int) (originalHeight * 2.0)); // These values in this method can be changed to expand however much you like
        } else {
            mIsViewExpanded = false;
            valueAnimator = ValueAnimator.ofInt(originalHeight + (int) (originalHeight * 2.0), originalHeight);

            Animation a = new AlphaAnimation(1.00f, 0.00f); // Fade out

            a.setDuration(200);
            // Set a listener to the animation and configure onAnimationEnd
            a.setAnimationListener(new Animation.AnimationListener() {
                @Override
                public void onAnimationStart(Animation animation) {

                }

                @Override
                public void onAnimationEnd(Animation animation) {
                    yourCustomView.setVisibility(View.INVISIBLE);
                    yourCustomView.setEnabled(false);
                }

                @Override
                public void onAnimationRepeat(Animation animation) {

                }
            });

            // Set the animation on the custom view
            yourCustomView.startAnimation(a);
        }
        valueAnimator.setDuration(200);
        valueAnimator.setInterpolator(new AccelerateDecelerateInterpolator());
        valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
            public void onAnimationUpdate(ValueAnimator animation) {
                Integer value = (Integer) animation.getAnimatedValue();
                view.getLayoutParams().height = value.intValue();
                view.requestLayout();
            }
        });


        valueAnimator.start();

    }

现在，当您触摸RecyclerView上的单个cardview时（假设您有CardView设置，那么它应该展开。确保在xml文件中正确声明您的customView（如果您需要，请执行示例）当你触摸它时CardView向下扩展然后在其他视图下方正确分配customView并在声明它时将可见性设置为消失，然后在上面的代码中动画开始时将其设置为可见并启用视图。

希望这可以帮助别人。

Answer 2

@ AndyRoid回答的一个更简单的选择是使用android:animateLayoutChanges="true"属性。这样你就不需要编写任何动画代码了;但是，如果您需要控制动画，这不是一种方法。

您仍需要创建OnClickListener：

class CardTapListener implements View.OnClickListener {
    @Override
    public void onClick(View v) {
        View someView = v.findViewById(R.id.view_to_expand);

        if (someView.getVisibility() == View.GONE) {
            someView.setVisibility(View.VISIBLE);
        }
        else if (someView.getVisibility() == View.VISIBLE){
            someView.setVisibility(View.GONE);
        }

    }
}

将其附加到每个ViewHolder：

@Override
public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup viewGroup, int viewType) {
    View v = LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.view_holder_layout, viewGroup, false);
    v.setOnClickListener(new CardTapListener());
    return new ItemViewHolder(v);
}

在绑定新项目时不要忘记折叠视图：

@Override
public void onBindViewHolder(RecyclerView.ViewHolder viewHolder, int i) {
    ...
    // Collapse (probably opened by user previously) view
    ItemViewHolder itemHolder = (ItemViewHolder) viewHolder;
    itemHolder.description.setVisibility(View.GONE);
    ...

}

view_holder_layout.xml：

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:animateLayoutChanges="true"
    android:orientation="vertical">

 ...

    <AnyViewHere
        android:visibility="gone"
        android:id="@+id/view_to_expand" />

 </LinearLayout>

项目上的RecyclerView动画单击

2 个答案: