RecyclerView 展开/折叠项目 [英] RecyclerView expand/collapse items

问题描述

我想展开/折叠我的 recyclerView 的项目以显示更多信息.我想实现与 SlideExpandableListView 相同的效果.

I want to expand/collapse the items of my recyclerView in order to show more info. I want to achieve the same effect of the SlideExpandableListView.

基本上在我的 viewHolder 中，我有一个不可见的视图，我想做一个平滑的展开/折叠动画，而不是仅将可见性设置为 VISIBLE/GONE.我一次只需要展开一个项目，如果有一些高度来表明该项目已被选中，那就太酷了.

Basically in my viewHolder I have a view that is not visible and I want to do a smooth expand/collapse animation rather than set the visibility to VISIBLE/GONE only. I only need an item to be expanded at a time and it would be cool to have some elevation to show that the item is selected.

与新的Android最近通话记录列表效果相同.选项回调"和详细信息"仅在选择项目时可见.

It is the same effect of the new Android recent calls history list. The options "CALL BACK" and "DETAILS" are visible only when an item is selected.

推荐答案

请不要使用任何库来实现此效果，而是使用 Google I/O 推荐的方法.在您的 recyclerView 的 onBindViewHolder 方法中执行以下操作:

Please don't use any library for this effect instead use the recommended way of doing it according to Google I/O. In your recyclerView's onBindViewHolder method do this:

final boolean isExpanded = position==mExpandedPosition;
holder.details.setVisibility(isExpanded?View.VISIBLE:View.GONE);
holder.itemView.setActivated(isExpanded);
holder.itemView.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        mExpandedPosition = isExpanded ? -1:position;
        TransitionManager.beginDelayedTransition(recyclerView);
        notifyDataSetChanged();
    }
});

• 其中详细信息是我将在触摸时显示的视图(在您的情况下调用详细信息.默认可见性.GONE).
• mExpandedPosition 是一个初始化为 -1 的 int 变量
• Where details is my view that will be displayed on touch (call details in your case. Default Visibility.GONE).
• mExpandedPosition is an int variable initialized to -1

对于你想要的炫酷效果，使用这些作为你的 list_item 属性:

And for the cool effects that you wanted, use these as your list_item attributes:

android:background="@drawable/comment_background"
android:stateListAnimator="@animator/comment_selection"

comment_background 在哪里:

where comment_background is:

<selector
xmlns:android="http://schemas.android.com/apk/res/android"
android:constantSize="true"
android:enterFadeDuration="@android:integer/config_shortAnimTime"
android:exitFadeDuration="@android:integer/config_shortAnimTime">

<item android:state_activated="true" android:drawable="@color/selected_comment_background" />
<item android:drawable="@color/comment_background" />
</selector>

和 comment_selection 是:

and comment_selection is:

<selector xmlns:android="http://schemas.android.com/apk/res/android">

<item android:state_activated="true">
    <objectAnimator
        android:propertyName="translationZ"
        android:valueTo="@dimen/z_card"
        android:duration="2000"
        android:interpolator="@android:interpolator/fast_out_slow_in" />
</item>

<item>
    <objectAnimator
        android:propertyName="translationZ"
        android:valueTo="0dp"
        android:duration="2000"
        android:interpolator="@android:interpolator/fast_out_slow_in" />
</item>
</selector>

这篇关于RecyclerView 展开/折叠项目的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！