2017-09-28 9 views
2

ボタンのクリックで拡大縮小するRelativeLayoutがあります。 ボタンでうまく動作します。 同じレイアウトの2つ以上のRelativeLayout に同じメソッドを再利用したい場合は、他の2つのボタンを使用して展開してください( )。ボタンをクリックして相対的な拡大を開くと閉じる

このコードは正常に動作しています。同じアクションを実行するレイアウトがもっと必要なだけです。

レイアウト: enter image description here

これは私のコードです:

<?xml version="1.0" encoding="utf-8"?> 
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:scrollbars="none"> 

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

     <RelativeLayout 

      android:layout_width="fill_parent" 
      android:layout_height="64dp" 
      android:background="#FFF" 
      android:orientation="vertical"> 

      <TextView 

       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:text="Title" 
       android:textSize="20sp" /> 

      <Button 
       android:id="@+id/viewmore" 
       android:layout_width="80dp" 
       android:layout_height="match_parent" 
       android:layout_marginLeft="280dp" 
       android:background="@null" 
       android:text="viewmore" /> 


     </RelativeLayout> 


     <RelativeLayout 

      android:visibility="gone" 
      android:id="@+id/expandable" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:animateLayoutChanges="true" 
      android:background="@color/colorAccent" 
      android:orientation="vertical"> 


      <TextView 

       android:layout_width="match_parent" 
       android:layout_height="133dp" 
       android:text="Text messaging, or texting, is the act of composing and sending electronic messages, typically consisting of alphabetic and numeric characters" 
       android:textSize="20sp" /> 


     </RelativeLayout> 


     <RelativeLayout 


      android:layout_width="match_parent" 
      android:layout_height="wrap_content"> 

      <TextView 
       android:id="@+id/textView4" 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:text="Title 2" 
       android:textSize="20sp" /> 

      <Button 
       android:id="@+id/viewmore1" 
       android:layout_width="80dp" 
       android:layout_height="match_parent" 
       android:layout_marginLeft="280dp" 
       android:background="@null" 
       android:text="viewmore" /> 


     </RelativeLayout> 

     <RelativeLayout 
      android:visibility="gone" 
      android:animateLayoutChanges="true" 
      android:id="@+id/expandable1" 
      android:layout_width="match_parent" 
      android:layout_height="100dp" 
      android:layout_marginTop="30dp" 
      android:background="@color/colorPrimary"> 

      <TextView 

       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:text="Text messaging, or texting, is the act of composing and sending electronic messages, typically consisting of alphabetic and numeric characters" 
       android:textSize="20sp" /> 


     </RelativeLayout> 

     <RelativeLayout 

      android:layout_width="match_parent" 
      android:layout_height="wrap_content"> 

      <TextView 

       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:text="Title 3" 
       android:textSize="20sp" /> 

      <Button 
       android:id="@+id/viewmore2" 
       android:layout_width="80dp" 
       android:layout_height="match_parent" 
       android:layout_marginLeft="280dp" 
       android:background="@null" 
       android:text="viewmore" /> 


     </RelativeLayout> 

     <RelativeLayout 
      android:visibility="gone" 
      android:animateLayoutChanges="true" 
      android:id="@+id/expandable2" 
      android:layout_width="match_parent" 
      android:layout_height="100dp" 
      android:layout_marginTop="30dp" 
      android:background="@color/colorPrimary"> 

      <TextView 

       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:text="Text messaging, or texting, is the act of composing and sending electronic messages, typically consisting of alphabetic and numeric characters" 
       android:textSize="20sp" /> 


     </RelativeLayout> 


    </LinearLayout> 
</ScrollView> 

ソースコード:

RelativeLayout relativeLayout, relativeLayout1, relativeLayout2; 
    Button viewmore, viewmore1, viewmore2; 
    ValueAnimator mAnimator; 

    @Override 
    protected void onCreate(Bundle savedInstanceState) { 
     super.onCreate(savedInstanceState); 
     setContentView(R.layout.viewmore); 


     relativeLayout = (RelativeLayout) findViewById(R.id.expandable); 
     relativeLayout1 = (RelativeLayout) findViewById(R.id.expandable1); 
     relativeLayout2 = (RelativeLayout) findViewById(R.id.expandable2); 


     viewmore = (Button) findViewById(R.id.viewmore); 
     viewmore1 = (Button) findViewById(R.id.viewmore1); 
     viewmore2 = (Button) findViewById(R.id.viewmore2); 

     viewmore.setOnClickListener(this); 
     viewmore1.setOnClickListener(this); 
     viewmore2.setOnClickListener(this); 


     relativeLayout.getViewTreeObserver().addOnPreDrawListener(
       new ViewTreeObserver.OnPreDrawListener() { 

        @Override 
        public boolean onPreDraw() { 
         relativeLayout.getViewTreeObserver().removeOnPreDrawListener(this); 
         relativeLayout.setVisibility(View.GONE); 

         final int widthSpec = View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED); 
         final int heightSpec = View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED); 
         relativeLayout.measure(widthSpec, heightSpec); 

         mAnimator = slideAnimator(0, relativeLayout.getMeasuredHeight()); 
         return true; 
        } 
       }); 


    } 


    private void expand() { 

     relativeLayout.setVisibility(View.VISIBLE); 
     mAnimator.start(); 
    } 

    private void collapse() { 
     int finalHeight = relativeLayout.getHeight(); 

     ValueAnimator mAnimator = slideAnimator(finalHeight, 0); 

     mAnimator.addListener(new Animator.AnimatorListener() { 
      @Override 
      public void onAnimationEnd(Animator animator) { 
       //Height=0, but it set visibility to GONE 
       relativeLayout.setVisibility(View.GONE); 
      } 

      @Override 
      public void onAnimationStart(Animator animator) { 
      } 

      @Override 
      public void onAnimationCancel(Animator animator) { 
      } 

      @Override 
      public void onAnimationRepeat(Animator animator) { 
      } 
     }); 
     mAnimator.start(); 
    } 


    private ValueAnimator slideAnimator(int start, int end) { 

     ValueAnimator animator = ValueAnimator.ofInt(start, end); 


     animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() { 
      @Override 
      public void onAnimationUpdate(ValueAnimator valueAnimator) { 
       //Update Height 
       int value = (Integer) valueAnimator.getAnimatedValue(); 

       ViewGroup.LayoutParams layoutParams = relativeLayout.getLayoutParams(); 
       layoutParams.height = value; 
       relativeLayout.setLayoutParams(layoutParams); 
      } 
     }); 
     return animator; 
    } 


    @Override 
    public void onClick(View view) { 
     switch (view.getId()) { 
      case R.id.viewmore: 

       if (relativeLayout.getVisibility() == View.GONE) { 
        expand(); 
       } else { 
        collapse(); 
       } 

       break; 


      case R.id.viewmore1: 


       break; 

      case R.id.viewmore2: 


       break; 


     } 
    } 

答えて

2

あなたのアプローチを続行するには、コードがすべてに適用させる必要がありますあなたがレイアウトした3つのセクション。これを行うには、いくつかのメソッドを変更して、RelativeLayoutを引数として受け入れる必要があります。

まず、お客様のonClickリスナーで、ケースブロックを入力し、各ブロックがRelativeLayoutと最大高さのexpand()を呼び出します。 RelativeLayoutcollapse()を呼び出してください。

これで、アニメーターの作成方法と場所が変更されていることがわかります。アニメーターはそれぞれRelativeLayoutで作業する必要があります。

したがってonClick()はを呼び出し、slideAnimator()を呼び出します。各コールについて、有効なRelativeLayoutが引数として渡されます。このようにして、RelativeLayoutを複数使用してコードを一般化することができます。

事前描画リスナーは、それぞれの拡張可能な数値を測定する必要がありますRelativeLayout。ここで

はそれをすべて一緒に入れている:

MainActivity.xml

public class MainActivity extends AppCompatActivity 
    implements View.OnClickListener { 

    RelativeLayout relativeLayout, relativeLayout1, relativeLayout2; 
    Button viewmore, viewmore1, viewmore2; 
    int height, height1, height2; 

    @Override 
    protected void onCreate(Bundle savedInstanceState) { 
     super.onCreate(savedInstanceState); 
     setContentView(R.layout.viewmore); 

     relativeLayout = (RelativeLayout) findViewById(R.id.expandable); 
     relativeLayout1 = (RelativeLayout) findViewById(R.id.expandable1); 
     relativeLayout2 = (RelativeLayout) findViewById(R.id.expandable2); 

     viewmore = (Button) findViewById(R.id.viewmore); 
     viewmore1 = (Button) findViewById(R.id.viewmore1); 
     viewmore2 = (Button) findViewById(R.id.viewmore2); 

     viewmore.setOnClickListener(this); 
     viewmore1.setOnClickListener(this); 
     viewmore2.setOnClickListener(this); 


     relativeLayout.getViewTreeObserver().addOnPreDrawListener(
      new ViewTreeObserver.OnPreDrawListener() { 

       @Override 
       public boolean onPreDraw() { 
        relativeLayout.getViewTreeObserver().removeOnPreDrawListener(this); 
        relativeLayout.setVisibility(View.GONE); 
        relativeLayout1.setVisibility(View.GONE); 
        relativeLayout2.setVisibility(View.GONE); 

        final int widthSpec = View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED); 
        final int heightSpec = View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED); 
        relativeLayout.measure(widthSpec, heightSpec); 
        height = relativeLayout.getMeasuredHeight(); 
        relativeLayout1.measure(widthSpec, heightSpec); 
        height1 = relativeLayout.getMeasuredHeight(); 
        relativeLayout2.measure(widthSpec, heightSpec); 
        height2 = relativeLayout.getMeasuredHeight(); 
        return true; 
       } 
      }); 
    } 


    private void expand(RelativeLayout layout, int layoutHeight) { 
     layout.setVisibility(View.VISIBLE); 
     ValueAnimator animator = slideAnimator(layout, 0, layoutHeight); 
     animator.start(); 
    } 

    private void collapse(final RelativeLayout layout) { 
     int finalHeight = layout.getHeight(); 
     ValueAnimator mAnimator = slideAnimator(layout, finalHeight, 0); 

     mAnimator.addListener(new Animator.AnimatorListener() { 
      @Override 
      public void onAnimationEnd(Animator animator) { 
       //Height=0, but it set visibility to GONE 
       layout.setVisibility(View.GONE); 
      } 

      @Override 
      public void onAnimationStart(Animator animator) { 
      } 

      @Override 
      public void onAnimationCancel(Animator animator) { 
      } 

      @Override 
      public void onAnimationRepeat(Animator animator) { 
      } 
     }); 
     mAnimator.start(); 
    } 


    private ValueAnimator slideAnimator(final RelativeLayout layout, int start, int end) { 
     ValueAnimator animator = ValueAnimator.ofInt(start, end); 

     animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() { 
      @Override 
      public void onAnimationUpdate(ValueAnimator valueAnimator) { 
       //Update Height 
       int value = (Integer) valueAnimator.getAnimatedValue(); 

       ViewGroup.LayoutParams layoutParams = layout.getLayoutParams(); 
       layoutParams.height = value; 
       layout.setLayoutParams(layoutParams); 
      } 
     }); 
     return animator; 
    } 

    @Override 
    public void onClick(View view) { 
     switch (view.getId()) { 
      case R.id.viewmore: 
       if (relativeLayout.getVisibility() == View.GONE) { 
        expand(relativeLayout, height); 
       } else { 
        collapse(relativeLayout); 
       } 
       break; 

      case R.id.viewmore1: 
       if (relativeLayout1.getVisibility() == View.GONE) { 
        expand(relativeLayout1, height1); 
       } else { 
        collapse(relativeLayout1); 
       } 
       break; 

      case R.id.viewmore2: 
       if (relativeLayout2.getVisibility() == View.GONE) { 
        expand(relativeLayout2, height2); 
       } else { 
        collapse(relativeLayout2); 
       } 
       break; 
     } 
    } 
} 
+0

よろしくお願いします。ありがとうございます。最初に非表示にするためのビジビリティ(View.GONE)を設定する方法。 – feltonjk

+0

@feltonjk私の最後のコメント(削除)は間違っていた。 XMLの設定では、android:visibility = "gone" – Cheticamp

+0

がセットされた後、アンドロイド:visibility = "gone"がセットされた後、それは動作しておらず、何も表示されません。私もrelativeLayout.setVisibility(View.GONE)を試してみました。あなたは私に他のsolutonを教えていただけますか? – feltonjk

0

また、Androidの相対的なレイアウトを拡張する拡張可能な独自のカスタムを作成することができます。そのカスタムビューでは、展開または折りたたまれた状態を保存できます。また、ビューのデフォルトステータスを拡張または縮小するように定義するカスタム属性を作成することもできます。したがって、ビューの状態を比較する必要はありません。ビューをトグルして折りたたんで表示するか、逆に表示するかを切り替えます。

折りたたみビューをデフォルトビューとして表示するには、onMeasure測定した高さを保存します。ビューコンストラクタの可視性を変更する場合は、そのビューのonMeasure関数のスキップ計算をスキップします。 onPreDraw関数の可視性を切り替える必要があります。

関連する問題