Expansion et effondrement de CardView

Quelle est la bonne façon d'étendre un CardView?

example

21
demandé sur Robert Vangor 2016-02-19 11:07:09

5 réponses

utilisez une vue de liste extensible avec cardview

ou même

Vous pouvez utiliser wrap contenu comme hauteur de cardview et l'utilisation textview à l'intérieur de celui-ci sous le titre, donc sur le clic Faire le textview visible et vice-versa .

mais n'est-ce pas une mauvaise conception ?

non ce n'est pas si vous donnez un peu de transition ou d'animation quand il est élargi ou s'est effondré

si vous voulez voir une transition par défaut, alors il suffit d'écrire android:animateLayoutChanges=" true " dans layout parent .

16
répondu Madhur 2018-03-27 08:44:47

si vous utilisez CardViews dans un ListView ou RecyclerView voir ma réponse pour la façon recommandée de le faire: RecyclerView développer/réduire les éléments

si vous utilisez simplement CardView, faites ceci dans votre onClickListener de cardview:

TransitionManager.beginDelayedTransition(cardview);
detailsView.setVisibility(View.VISIBLE);

par défaut gardez la visibilité de votre detailsView pour disparaître dans votre xml.

15
répondu Heisenberg 2017-05-23 12:32:21

j'ai utilisé un cardview et une section expand item_description dans le cardview. Pour la partie expand, J'ai créé un TextView sous la section header ( LinearLayout/item_description_layout ) et lorsque l'utilisateur clique sur la disposition header, une méthode expand/collapse est appelée. Voici le code dans le cardview:

<LinearLayout
  android:id="@+id/item_description_layout"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:gravity="center"
  android:minHeight="48dp"
  android:paddingStart="16dp"
  android:paddingEnd="16dp"
  android:orientation="horizontal">

  <TextView
      android:id="@+id/item_description_title"
      android:layout_width="0dp"
      android:layout_height="match_parent"
      android:layout_weight="0.9"
      android:gravity="center_vertical"
      android:text="@string/description"/>

  <ImageView
      android:id="@+id/item_description_img"
      android:layout_width="0dp"
      android:layout_height="wrap_content"
      android:layout_weight="0.1"
      android:layout_gravity="center_vertical|end"
      app:srcCompat="@drawable/ic_expand_more_black_24dp"/>

</LinearLayout>

<TextView
  android:id="@+id/item_description"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:paddingStart="16dp"
  android:paddingEnd="16dp"
  android:paddingBottom="16dp"
  android:gravity="center_vertical"
  android:visibility="gone"
  tools:text="description goes here"/>  

Voici la méthode qui s'appelle. J'ai aussi ajouté un Objectanimateur pour gérer l'expansion / l'effondrement animation du bloc. Il s'agit d'une simple animation qui utilise la longueur du texte de description.

void collapseExpandTextView() {
    if (mItemDescription.getVisibility() == View.GONE) {
        // it's collapsed - expand it
        mItemDescription.setVisibility(View.VISIBLE);
        mDescriptionImg.setImageResource(R.drawable.ic_expand_less_black_24dp);
    } else {
        // it's expanded - collapse it
        mItemDescription.setVisibility(View.GONE);
        mDescriptionImg.setImageResource(R.drawable.ic_expand_more_black_24dp);
    }

    ObjectAnimator animation = ObjectAnimator.ofInt(mItemDescription, "maxLines", mItemDescription.getMaxLines());
    animation.setDuration(200).start();
} 
11
répondu Ray Hunter 2016-09-13 16:15:55
mView.Click +=(sender, e) =>{
    LinearLayout temp = mView.FindViewById<LinearLayout>(Resource.Id.LinerCart);
    if (vs == false) {
        temp.Visibility = ViewStates.Gone;
        vs = true;
    } else {
        temp.Visibility = ViewStates.Visible;
        vs = false;
    }
};
0
répondu user7740865 2017-03-20 15:48:32

j'ai eu la solution (simple cardview extensible listview ) suivez ce lien http://www.devexchanges.info/2016/08/expandingcollapsing-recyclerview-row_18.html

si vous ajoutez l'icône flèche vers le bas vous n'avez qu'à utiliser mon code

créer xml

    <RelativeLayout
                android:id="@+id/layout_expand"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:paddingTop="10dp"
                android:paddingBottom="10dp"
                android:paddingLeft="10dp"
                android:orientation="vertical">


                <TextView
                    android:id="@+id/item_description_title"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:background="@color/white"
                    android:clickable="true"
                    android:onClick="toggle_contents"
                    android:padding="10dp"
                    android:text="Guest Conditions"
                    android:textColor="@color/hint_txt_color"
                    android:fontFamily="sans-serif-medium"
                    android:textStyle="normal"
                    android:paddingBottom="15dp"
                    android:textSize="16dp"/>

                 <ImageView
                     android:layout_alignParentRight="true"
                     android:paddingTop="4dp"
                     android:paddingRight="10dp"
                     android:layout_width="wrap_content"
                     android:layout_height="wrap_content"
                     android:src="@drawable/ic_keyboard_arrow_down"/>

                <!--content to hide/show -->
                <TextView
                    android:id="@+id/item_description"
                    android:layout_below="@+id/item_description_title"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:background="@color/white"
                    android:padding="10dp"
                    android:text="@string/about_txt2"
                    android:textColor="@color/hint_txt_color"
                    android:fontFamily="sans-serif-medium"
                    android:textStyle="normal"
                    android:paddingBottom="15dp"
                    android:visibility="gone"
                    android:textSize="12dp" />

            </RelativeLayout>
        </android.support.v7.widget.CardView>
    ///////////////////////////////////////////////
    Mainactivity.java

     RelativeLayout layout_expand = (RelativeLayoutfindViewById(R.id.layout_expand);
     item_description = (TextView) findViewById(R.id.item_description);
     TextView item_description_title; 
    item_description_title = (TextView) findViewById(R.id.item_description_title);
    item_description.setVisibility(View.GONE);
    ///////////////////////////////////////////////////////////////////

            animationUp = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.slide_up);
            animationDown = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.slide_down);

            layout_expand.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View view) {
                    if(item_description.isShown()){
                        item_description.setVisibility(View.GONE);
                        item_description.startAnimation(animationUp);
                    }
                    else{
                        item_description.setVisibility(View.VISIBLE);
                        item_description.startAnimation(animationDown);
                    }
                }
            });

item_description_title.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                if(item_description.isShown()){
                    item_description.setVisibility(View.GONE);
                    item_description.startAnimation(animationUp);
                }
                else{
                    item_description.setVisibility(View.VISIBLE);
                    item_description.startAnimation(animationDown);
                }
            }
        });
0
répondu Bob Galy 2018-03-24 17:08:13