RecyclerView развернуть / свернуть элементы

Я хочу расширить / свернуть элементы моего recyclerView, чтобы показать больше информации. Я хочу добиться того же эффекта SlideExpandableListView .

В основном в моем представленииHolder у меня есть представление, которое не видно, и я хочу сделать плавное расширение / свернуть анимацию, а не устанавливать видимость только в VISIBLE / GONE. Мне нужен только элемент, который нужно развернуть за раз, и было бы здорово иметь некоторое возвышение, чтобы показать, что элемент выбран.

Это тот же эффект нового списка хронологических вызовов Android. Параметры «CALL BACK» и «DETAILS» видны только при выборе элемента.

Расширяемые элементы RecyclerView

Solutions Collecting From Web of "RecyclerView развернуть / свернуть элементы"

Пожалуйста, не используйте какую-либо библиотеку для этого эффекта, а используйте рекомендуемый способ ее выполнения в соответствии с Google I / O 2016. В вашем методе onBindViewHolder recyclerView выполните следующее:

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(); } }); 
  • Где будет указано мое мнение, которое будет отображаться на сенсорном экране (данные вызова в вашем случае. Default Visibility.GONE).
  • MExpandedPosition – переменная int, инициализированная -1

И для интересных эффектов, которые вы хотели, используйте их в качестве атрибутов list_item:

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

Где comment_background:

 <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" /> 

И comment_selection:

 <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="@android:integer/config_shortAnimTime" android:interpolator="@android:interpolator/fast_out_slow_in" /> </item> <item> <objectAnimator android:propertyName="translationZ" android:valueTo="0dp" android:duration="@android:integer/config_shortAnimTime" android:interpolator="@android:interpolator/fast_out_slow_in" /> </item> 

Не сказать, что это лучший подход, но он работает для меня.

Полный код можно найти по адресу: Пример кода по адресу: https://github.com/dbleicher/recyclerview-grid-quickreturn

Во-первых, добавьте расширенную область в макет ячейки / элемента и сделайте закрывающий раскладку ячейки animateLayoutChanges = "true". Это обеспечит анимацию расширения / сглаживания:

 <LinearLayout android:id="@+id/llCardBack" android:layout_width="fill_parent" android:layout_height="wrap_content" android:background="@android:color/white" android:animateLayoutChanges="true" android:padding="4dp" android:orientation="vertical"> <TextView android:id="@+id/tvTitle" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_gravity="center|fill_horizontal" android:padding="10dp" android:gravity="center" android:background="@android:color/holo_green_dark" android:text="This is a long title to show wrapping of text in the view." android:textColor="@android:color/white" android:textSize="16sp" /> <TextView android:id="@+id/tvSubTitle" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_gravity="center|fill_horizontal" android:background="@android:color/holo_purple" android:padding="6dp" android:text="My subtitle..." android:textColor="@android:color/white" android:textSize="12sp" /> <LinearLayout android:id="@+id/llExpandArea" android:visibility="gone" android:layout_width="fill_parent" android:layout_height="wrap_content" android:gravity="center" android:orientation="horizontal"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="6dp" android:text="Item One" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="6dp" android:text="Item Two" /> </LinearLayout> </LinearLayout> 

Затем заставьте класс RV Adapter реализовать View.OnClickListener, чтобы вы могли воздействовать на элемент, который был нажат. Добавьте поле int, чтобы удерживать позицию одного расширенного представления и инициализировать его отрицательным значением:

 private int expandedPosition = -1; 

Наконец, реализуйте методы ViewHolder, onBindViewHolder () и переопределите метод onClick (). Вы развернете представление в onBindViewHolder, если его позиция равна «expandPosition», и спрячьте его, если нет. Вы устанавливаете значение expandPosition в слушателе onClick:

 @Override public void onBindViewHolder(RVAdapter.ViewHolder holder, int position) { int colorIndex = randy.nextInt(bgColors.length); holder.tvTitle.setText(mDataset.get(position)); holder.tvTitle.setBackgroundColor(bgColors[colorIndex]); holder.tvSubTitle.setBackgroundColor(sbgColors[colorIndex]); if (position == expandedPosition) { holder.llExpandArea.setVisibility(View.VISIBLE); } else { holder.llExpandArea.setVisibility(View.GONE); } } @Override public void onClick(View view) { ViewHolder holder = (ViewHolder) view.getTag(); String theString = mDataset.get(holder.getPosition()); // Check for an expanded view, collapse if you find one if (expandedPosition >= 0) { int prev = expandedPosition; notifyItemChanged(prev); } // Set the current position to "expanded" expandedPosition = holder.getPosition(); notifyItemChanged(expandedPosition); Toast.makeText(mContext, "Clicked: "+theString, Toast.LENGTH_SHORT).show(); } /** * Create a ViewHolder to represent your cell layout * and data element structure */ public static class ViewHolder extends RecyclerView.ViewHolder { TextView tvTitle; TextView tvSubTitle; LinearLayout llExpandArea; public ViewHolder(View itemView) { super(itemView); tvTitle = (TextView) itemView.findViewById(R.id.tvTitle); tvSubTitle = (TextView) itemView.findViewById(R.id.tvSubTitle); llExpandArea = (LinearLayout) itemView.findViewById(R.id.llExpandArea); } } 

Это должно расширять только один элемент за раз, используя анимацию по умолчанию для изменения макета. По крайней мере, это работает для меня. Надеюсь, поможет.

Существует очень простая библиотека с поддержкой gradle: https://github.com/cachapa/ExpandableLayout .

Прямо из документации библиотеки:

 <net.cachapa.expandablelayout.ExpandableLinearLayout android:id="@+id/container" android:layout_width="match_parent" android:layout_height="match_parent" app:el_duration="1000" app:el_expanded="true"> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Click here to toggle expansion" /> <TextView android:layout_width="match_parent" android:layout_height="50dp" android:text="Fixed height" app:layout_expandable="true" /> </net.cachapa.expandablelayout.ExpandableLinearLayout> 

После того, как вы помечаете свои расширяемые виды, просто вызовите любой из этих методов в контейнере: expand() , collapse() или toggle()

Вы можете использовать ExpandableLayout. https://github.com/KyoSherlock/ExpandableLayout

Этот ExpandableLayout похож на плавное расширение / сбой анимации CheckBox, поэтому его можно использовать в любом месте (ListView или RecyclerView).

Выполните следующие действия после того, как вы установите прослушиватель onClick в класс ViewHolder:

 @Override public void onClick(View v) { final int originalHeight = yourLinearLayout.getHeight(); animationDown(YourLinearLayout, originalHeight);//here put the name of you layout that have the options to expand. } //Animation for devices with kitkat and below public void animationDown(LinearLayout billChoices, int originalHeight){ // Declare a ValueAnimator object ValueAnimator valueAnimator; if (!billChoices.isShown()) { billChoices.setVisibility(View.VISIBLE); billChoices.setEnabled(true); valueAnimator = ValueAnimator.ofInt(0, originalHeight+originalHeight); // These values in this method can be changed to expand however much you like } else { valueAnimator = ValueAnimator.ofInt(originalHeight+originalHeight, 0); 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) { billChoices.setVisibility(View.INVISIBLE); billChoices.setEnabled(false); } @Override public void onAnimationRepeat(Animation animation) { } }); // Set the animation on the custom view billChoices.startAnimation(a); } valueAnimator.setDuration(200); valueAnimator.setInterpolator(new AccelerateDecelerateInterpolator()); valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() { public void onAnimationUpdate(ValueAnimator animation) { Integer value = (Integer) animation.getAnimatedValue(); billChoices.getLayoutParams().height = value.intValue(); billChoices.requestLayout(); } }); valueAnimator.start(); } } 

Я думаю, что это должно помочь, вот как я реализовал и делает то же самое Google в недавнем просмотре вызовов.

Используйте два вида вида в вашем RVAdapter . Один для расширенного макета и другого для свертывания. И волшебство происходит с настройкой android:animateLayoutChanges="true" для RecyclerView Checkout эффект, достигнутый с использованием этого в 0:42 в этом видео