2016-04-30 14 views
3

小さなアニメーションでクリックしてCardViewを展開し、残りのTextViewを表示したいと考えています。クリック時にTextViewを使用してcardViewを展開する

これは私の.xmlファイル

<LinearLayout android:id="@+id/yolo" 
      xmlns:android="http://schemas.android.com/apk/res/android" 
      xmlns:card_view="http://schemas.android.com/apk/res-auto" 
      xmlns:tools="http://schemas.android.com/tools" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:orientation="vertical"> 


<!-- A CardView that contains a TextView --> 
<android.support.v7.widget.CardView 
    android:id="@+id/card_view1" 
    xmlns:card_view="http://schemas.android.com/apk/res-auto" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:layout_gravity="top" 
    android:layout_marginBottom="10dp" 
    android:layout_marginEnd="20dp" 
    android:layout_marginStart="20dp" 
    android:layout_marginTop="10dp" 
    android:longClickable="true" 
    android:orientation="vertical" 
    card_view:cardCornerRadius="4dp" 
    card_view:cardElevation="4dp" 
    card_view:cardUseCompatPadding="true" 
    card_view:contentPadding="10dp" 
    > 

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
        xmlns:card_view="http://schemas.android.com/apk/res-auto" 
        xmlns:tools="http://schemas.android.com/tools" 
        android:layout_width="match_parent" 
        android:layout_height="match_parent" 
        android:orientation="vertical"> 

     <TextView 
      android:id="@+id/info_text" 
      android:layout_width="fill_parent" 
      android:layout_height="wrap_content" 
      android:textColor="#FF4444" 
      android:maxLines="1" 
      android:text="Did you know? Arnold Schwarzennegger was born in the Austria, Europe. " 
      android:textAlignment="center" 
      android:textSize="24sp" 
      /> 

    </LinearLayout> 
</android.support.v7.widget.CardView> 

<android.support.v7.widget.CardView 
    android:id="@+id/card_view2" 
    xmlns:card_view="http://schemas.android.com/apk/res-auto" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:layout_gravity="top" 
    android:layout_marginBottom="10dp" 
    android:layout_marginEnd="20dp" 
    android:layout_marginStart="20dp" 
    android:layout_marginTop="10dp" 
    android:longClickable="true" 
    android:orientation="vertical" 
    card_view:cardCornerRadius="4dp" 
    card_view:cardElevation="4dp" 
    card_view:cardUseCompatPadding="true" 
    card_view:contentPadding="10dp" 
    > 

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
        xmlns:card_view="http://schemas.android.com/apk/res-auto" 
        xmlns:tools="http://schemas.android.com/tools" 
        android:layout_width="match_parent" 
        android:layout_height="match_parent" 
        android:orientation="vertical"> 

     <TextView 
      android:id="@+id/info_text2" 
      android:layout_width="fill_parent" 
      android:layout_height="wrap_content" 
      android:maxLines="1" 
      android:text="Did you know? Arnold Schwarzennegger was born in the Austria, Europe. " 
      android:textAlignment="center" 
      android:textColor="#FF4444" 
      android:textSize="24sp" 
      /> 

    </LinearLayout> 
</android.support.v7.widget.CardView> 

<android.support.v7.widget.CardView 
    android:id="@+id/card_view3" 
    xmlns:card_view="http://schemas.android.com/apk/res-auto" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:layout_gravity="top" 
    android:layout_marginBottom="10dp" 
    android:layout_marginEnd="20dp" 
    android:layout_marginStart="20dp" 
    android:layout_marginTop="10dp" 
    android:longClickable="true" 
    android:orientation="vertical" 
    card_view:cardCornerRadius="4dp" 
    card_view:cardElevation="4dp" 
    card_view:cardUseCompatPadding="true" 
    card_view:contentPadding="10dp" 
    > 

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
        xmlns:card_view="http://schemas.android.com/apk/res-auto" 
        xmlns:tools="http://schemas.android.com/tools" 
        android:layout_width="match_parent" 
        android:layout_height="match_parent" 
        android:orientation="vertical"> 

     <TextView 
      android:id="@+id/info_text3" 
      android:layout_width="fill_parent" 
      android:layout_height="wrap_content" 
      android:maxLines="1" 
      android:text="Did you know? Arnold Schwarzennegger was born in the Austria, Europe. " 
      android:textAlignment="center" 
      android:textColor="#FF4444" 
      android:textSize="24sp" 
      /> 

    </LinearLayout> 
</android.support.v7.widget.CardView> 

<android.support.v7.widget.CardView 
    android:id="@+id/card_view" 
    xmlns:card_view="http://schemas.android.com/apk/res-auto" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:layout_gravity="top" 
    android:layout_marginBottom="10dp" 
    android:layout_marginEnd="20dp" 
    android:layout_marginStart="20dp" 
    android:layout_marginTop="10dp" 
    android:longClickable="true" 
    android:orientation="vertical" 
    card_view:cardCornerRadius="4dp" 
    card_view:cardElevation="4dp" 
    card_view:cardUseCompatPadding="true" 
    card_view:contentPadding="10dp" 
    > 

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
        xmlns:card_view="http://schemas.android.com/apk/res-auto" 
        xmlns:tools="http://schemas.android.com/tools" 
        android:layout_width="match_parent" 
        android:layout_height="match_parent" 
        android:orientation="vertical"> 

     <TextView 
      android:id="@+id/info_et" 
      android:layout_width="fill_parent" 
      android:layout_height="wrap_content" 
      android:maxLines="1" 
      android:text="Did you know? Arnold Schwarzennegger was born in the Austria, Europe. " 
      android:textAlignment="center" 
      android:textColor="#FF4444" 
      android:textSize="24sp" 
      /> 

    </LinearLayout> 
</android.support.v7.widget.CardView> 

であり、これは、それがどのように見えるかです。 TextViewで他の情報を見ることができるように展開したいです。

enter image description here

答えて

2

に崩壊ビューのExpandableHeightListViewを使用することによって、このようにそれを行うことができます〜する次のような構造を持つ電子同じ事:すべての

最初は次のようAnimationHelperクラスを作成します。

public class AnimationHelper { 
    public static void expand(final View v) { 
     v.measure(LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.WRAP_CONTENT); 
     final int targetHeight = v.getMeasuredHeight(); 

     v.getLayoutParams().height = 0; 
     v.setVisibility(View.VISIBLE); 
     Animation a = new Animation() { 
      @Override 
      protected void applyTransformation(float interpolatedTime, Transformation t) { 
       v.getLayoutParams().height = interpolatedTime == 1 
         ? LinearLayout.LayoutParams.WRAP_CONTENT 
         : (int) (targetHeight * interpolatedTime); 
       v.requestLayout(); 
      } 

      @Override 
      public boolean willChangeBounds() { 
       return true; 
      } 
     }; 

     // 1dp/ms 
     a.setDuration((int) (targetHeight/v.getContext().getResources().getDisplayMetrics().density)); 
     v.startAnimation(a); 
    } 

    public static void collapse(final View v) { 
     final int initialHeight = v.getMeasuredHeight(); 

     Animation a = new Animation() { 
      @Override 
      protected void applyTransformation(float interpolatedTime, Transformation t) { 
       if (interpolatedTime == 1) { 
        v.setVisibility(View.GONE); 
       } else { 
        v.getLayoutParams().height = initialHeight - (int) (initialHeight * interpolatedTime); 
        v.requestLayout(); 
       } 
      } 

      @Override 
      public boolean willChangeBounds() { 
       return true; 
      } 
     }; 
     // 1dp/ms 
     a.setDuration((int) (initialHeight/v.getContext().getResources().getDisplayMetrics().density)); 
     v.startAnimation(a); 
    } 
} 

次に、あなたのXMLに次のように展開したいレイアウトを置く(私の場合それはview_popup_menu_expandです):

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:background="@color/default_background" 
    android:orientation="vertical"> 

    <android.support.v7.widget.CardView 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:background="@color/card_background"> 


      <TextView 
       android:id="@+id/btn_expand" 
       style="@style/IconFont.Large" 
       android:layout_width="36dp" 
       android:layout_height="36dp" 
       android:layout_gravity="right" 
       android:text="@string/icon_chevron_up" 
       android:textColor="@color/color_primary_dark" /> 




    </android.support.v7.widget.CardView> 

    <include layout="@layout/view_popup_menu_expand" /> 

</LinearLayout> 

その後

ヨ)(あなたのカードにリスナーを設定し、AnimationHelper.expandにごview_popup_menu_exapandを渡します完全な実装を見つけることができますHere

1

あなたは私を拡張し、クリック

チェックhttps://github.com/PaoloRotolo/ExpandableHeightListView

チェックこのコード

<com.github.paolorotolo.expandableheightlistview.ExpandableHeightListView 
     android:id="@+id/expandable_listview" 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:padding="8dp"> 
    </com.github.paolorotolo.expandableheightlistview.ExpandableHeightListView> 
+0

あなたは何をしたいのですか?@ hyrulelink16 –

+0

小さなアニメーションでクリックしたときに1つのテキストビューを展開したり折りたたんだりして、表示または非表示にすることはしません。残りのテキストビューのコードをコピーしてください。 – hyrulelink16

+0

ExpandableHeightListView –

関連する問題