[android] 가시성 모드, GONE 및 VISIBLE 애니메이션

그래서 나는 다른 위젯으로 선형 레이아웃의 가시성을 GONE에서 VISIBLE로, 그 반대로 설정할 때 애니메이션을 적용하려고합니다. 내가 원하는 것을 보여주는 이미지는 다음과 같습니다.

여기에 이미지 설명 입력

표시하거나 숨길 수는 있지만 슬라이딩을 올바르게 애니메이션하는 방법을 따르지 않습니다 …. 🙁

내 XML은 다음과 같습니다.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/LinearLayout01"
    android:layout_height="wrap_content"
    android:layout_width="fill_parent"
    android:orientation="vertical">
<ScrollView
    android:id="@+id/ScrollView01"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">
    <LinearLayout
        android:layout_height="wrap_content"
        android:layout_width="fill_parent"
        android:orientation="vertical">
        <!-- TITULO1 -->
            <LinearLayout
                android:layout_height="wrap_content"
                android:layout_width="fill_parent"
                android:orientation="horizontal"
                android:background="#848284"
                android:padding="4px">
                <TextView
                    android:layout_height="wrap_content"
                    android:layout_width="wrap_content"
                    android:id="@+id/TextView01"
                    android:text="Informação Geral"
                    android:textColor="#FFFFFF"
                    android:gravity="left"
                    android:textStyle="bold"
                    android:singleLine="true"
                    android:ellipsize="end"
                    android:layout_gravity="center_vertical"
                    android:textSize="18px"
                    android:paddingLeft="4px">
                </TextView>
                <LinearLayout
                    android:layout_height="wrap_content"
                    android:layout_width="fill_parent"
                    android:layout_gravity="right|center_vertical" android:gravity="right|center_vertical" android:paddingTop="2px">
                        <ToggleButton
                            android:layout_height="wrap_content"
                            android:layout_width="wrap_content"
                            android:textOff="Expandir"
                            android:textOn="Minimizar"
                            android:id="@+id/mostrar"
                            android:width="80px">
                        </ToggleButton>
                </LinearLayout>

            </LinearLayout>
            <!--LINHA SEPARADORA-->
            <View
                android:id="@+id/View01"
                android:layout_width="wrap_content"
                android:background="#B5B5B5"
                android:layout_height="2px">
            </View>
            <!-- CONTENT INITIALLY HIDDEN (GONE) -->
            <LinearLayout
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:visibility="gone"
                android:id="@+id/informgeral"
                android:orientation="vertical">
                <LinearLayout
                    android:id="@+id/LinearLayout01"
                    android:layout_height="wrap_content"
                    android:layout_width="fill_parent"
                    android:paddingBottom="5px"
                    android:paddingTop="5px"
                    android:paddingLeft="8px"
                    android:orientation="vertical">
                    <LinearLayout
                        android:layout_width="fill_parent"
                        android:layout_height="wrap_content"
                        android:orientation="horizontal">
                        <TextView
                            android:id="@+id/consult_nrprocesso"
                            android:textStyle="bold"
                            android:layout_height="wrap_content"
                            android:layout_weight="1"
                            android:gravity="left"
                            android:ellipsize="end"
                            android:layout_width="wrap_content"
                            android:singleLine="true"
                            android:text="@string/srch_number_proc"/>
                        <TextView
                            android:id="@+id/consult_nrprocessovalue"
                            android:layout_width="0px"
                            android:layout_height="wrap_content"
                            android:layout_weight="1"
                            android:gravity="right"
                            android:singleLine="true"
                            android:ellipsize="end"/>
                    </LinearLayout>
                    <LinearLayout
                        android:layout_height="wrap_content"
                        android:layout_width="fill_parent">
                        <TextView
                            android:id="@+id/consult_tipoprocinfo"
                            android:text="Numero Atribuido ao Processo"
                            android:layout_height="wrap_content"
                            android:layout_weight="1"
                            android:gravity="left"
                            android:singleLine="true"
                            android:ellipsize="end"
                            android:layout_width="wrap_content"
                            android:textSize="12px"/>
                    </LinearLayout>
                </LinearLayout>
                <View
                    android:id="@+id/View01"
                    android:layout_width="wrap_content"
                    android:background="#B5B5B5"
                    android:layout_height="1px">
                </View>
<LinearLayout
    android:id="@+id/LinearLayout02"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:paddingTop="5px"
    android:paddingBottom="5px"
    android:layout_width="fill_parent"
    android:paddingLeft="8px">
    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
            <TextView
                android:id="@+id/consult_tipoproc"
                android:textStyle="bold"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:gravity="left"
                android:ellipsize="end"
                android:layout_width="wrap_content"
                android:singleLine="true"
                android:text="@string/proc_type"/>
            <TextView
                android:id="@+id/consult_tipoprocvalue"
                android:layout_width="0px"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:gravity="right"
                android:singleLine="true"
                android:ellipsize="end"/>
    </LinearLayout>
    <LinearLayout
        android:layout_height="wrap_content"
        android:layout_width="fill_parent">
    <TextView
            android:id="@+id/consult_tipoprocinfo"
            android:text="Variante do Processo em causa"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="left"
            android:singleLine="true"
            android:ellipsize="end"
            android:layout_width="wrap_content"
            android:textSize="12px"/>
    </LinearLayout>
</LinearLayout>
<View android:id="@+id/View01"
        android:layout_width="fill_parent"
        android:background="#B5B5B5"
        android:layout_height="1px">
</View>
<LinearLayout
    android:id="@+id/LinearLayout03"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:paddingTop="5px"
    android:paddingBottom="5px"
    android:layout_width="fill_parent"
    android:paddingLeft="8px">
    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
            <TextView
                android:id="@+id/consult_etapa"
                android:textStyle="bold"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:gravity="left"
                android:ellipsize="end"
                android:layout_width="wrap_content"
                android:singleLine="true"
                android:text="@string/srch_task"/>
            <TextView
                android:id="@+id/consult_etapavalue"
                android:layout_width="0px"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:gravity="right"
                android:singleLine="true"
                android:ellipsize="end"/>
    </LinearLayout>
    <LinearLayout
        android:layout_height="wrap_content"
        android:layout_width="wrap_content">
    <TextView
            android:id="@+id/consult_etapainfo"
            android:text="Etapa onde se encontra o processo"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="left"
            android:singleLine="true"
            android:ellipsize="end"
            android:layout_width="wrap_content"
            android:textSize="12px"/>
    </LinearLayout>
</LinearLayout>
<View android:id="@+id/View01"
        android:layout_width="wrap_content"
        android:background="#B5B5B5"
        android:layout_height="1px">
</View>
    <LinearLayout
    android:id="@+id/LinearLayout04"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:paddingTop="5px"
    android:paddingBottom="5px"
    android:layout_width="fill_parent"
    android:paddingLeft="8px">
    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
            <TextView
                android:id="@+id/consult_criadopor"
                android:textStyle="bold"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:gravity="left"
                android:ellipsize="end"
                android:layout_width="wrap_content"
                android:singleLine="true"
                android:text="@string/criado_por"/>
            <TextView
                android:id="@+id/consult_criadoporvalue"
                android:layout_width="0px"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:gravity="right"
                android:singleLine="true"
                android:ellipsize="end"/>
    </LinearLayout>
    <LinearLayout
        android:layout_height="wrap_content"
        android:layout_width="wrap_content">
    <TextView
            android:id="@+id/consult_criadoporinfo"
            android:text="Entidade responsável pela criação do Processo."
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="left"
            android:singleLine="true"
            android:ellipsize="end"
            android:layout_width="wrap_content"
            android:textSize="12px"/>
    </LinearLayout>
</LinearLayout>
<View android:id="@+id/View01"
        android:layout_width="wrap_content"
        android:background="#B5B5B5"
        android:layout_height="1px">
</View>
<LinearLayout
    android:id="@+id/LinearLayout05"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:paddingTop="5px"
    android:paddingBottom="5px"
    android:layout_width="fill_parent"
    android:paddingLeft="8px">
    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
            <TextView
                android:id="@+id/consult_assunto"
                android:textStyle="bold"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:gravity="left"
                android:ellipsize="end"
                android:layout_width="wrap_content"
                android:singleLine="true"
                android:text="@string/proc_subject"/>
            <TextView
                android:id="@+id/consult_assuntovalue"
                android:layout_width="0px"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:gravity="right"
                android:singleLine="true"
                android:ellipsize="end"/>
    </LinearLayout>
    <LinearLayout
        android:layout_height="wrap_content"
        android:layout_width="wrap_content">
    <TextView
            android:id="@+id/consult_assuntoinfo"
            android:text="Assunto do Processo"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="left"
            android:singleLine="true"
            android:ellipsize="end"
            android:layout_width="wrap_content"
            android:textSize="12px"/>
    </LinearLayout>
</LinearLayout>
<View android:id="@+id/View01"
        android:layout_width="wrap_content"
        android:background="#B5B5B5"
        android:layout_height="1px">
</View>
<LinearLayout
    android:id="@+id/LinearLayout05"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:paddingTop="5px"
    android:paddingBottom="5px"
    android:layout_width="fill_parent"
    android:paddingLeft="8px">
    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
            <TextView
                android:id="@+id/consult_datainicio"
                android:textStyle="bold"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:gravity="left"
                android:ellipsize="end"
                android:layout_width="wrap_content"
                android:singleLine="true"
                android:text="@string/srch_datebeg"/>
            <TextView
                android:id="@+id/consult_datainiciovalue"
                android:layout_width="0px"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:gravity="right"
                android:singleLine="true"
                android:ellipsize="end"/>
    </LinearLayout>
    <LinearLayout
        android:layout_height="wrap_content"
        android:layout_width="wrap_content">
    <TextView
            android:id="@+id/consult_dataincioinfo"
            android:text="Data da criação do Processo"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="left"
            android:singleLine="true"
            android:ellipsize="end"
            android:layout_width="wrap_content"
            android:textSize="12px"/>
    </LinearLayout>
</LinearLayout>
</LinearLayout>
<!-- TITULO2 -->
<LinearLayout
    android:layout_height="wrap_content"
    android:layout_width="fill_parent"
    android:orientation="horizontal"
    android:background="#848284" android:padding="4px">
    <TextView
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:id="@+id/TextView01"
        android:text="Informação Complementar"
        android:textColor="#FFFFFF"
        android:gravity="left"
        android:textStyle="bold"
        android:singleLine="true"
        android:ellipsize="end"
        android:layout_gravity="center_vertical" android:paddingLeft="4px" android:textSize="16px">
    </TextView>
    <LinearLayout
        android:layout_height="wrap_content"
        android:layout_width="fill_parent"
        android:layout_gravity="right|center_vertical"
        android:gravity="right|center_vertical"
        android:paddingTop="2px">
        <ToggleButton
            android:layout_height="wrap_content"
            android:layout_width="wrap_content"
            android:textOff="Expandir"
            android:textOn="Minimizar"
            android:id="@+id/mostrar2"
            android:width="80px">
        </ToggleButton>
    </LinearLayout>
</LinearLayout>
<View
    android:id="@+id/View01"
    android:layout_width="wrap_content"
    android:background="#B5B5B5"
    android:layout_height="2px">
</View>

<!-- TITULO3 -->
<LinearLayout
    android:layout_height="wrap_content"
    android:layout_width="fill_parent"
    android:orientation="horizontal"
    android:background="#848284"
    android:padding="4px">
    <TextView
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:id="@+id/TextView01"
        android:text="Documentos Anexados"
        android:textColor="#FFFFFF"
        android:gravity="left"
        android:textStyle="bold"
        android:singleLine="true"
        android:ellipsize="end"
        android:layout_gravity="center_vertical"
        android:textSize="18px"
        android:paddingLeft="4px">
    </TextView>
    <LinearLayout
        android:layout_height="wrap_content"
        android:layout_width="fill_parent"
        android:layout_gravity="right|center_vertical"
        android:gravity="right|center_vertical"
        android:paddingTop="2px">
        <ToggleButton

            android:layout_height="wrap_content"
            android:layout_width="wrap_content"
            android:textOff="Expandir"
            android:textOn="Minimizar"
            android:id="@+id/mostrar"
            android:width="80px">
        </ToggleButton>
    </LinearLayout>
</LinearLayout>
<!--LINHA SEPARADORA-->
<View
    android:id="@+id/View01"
    android:layout_width="wrap_content"
    android:background="#B5B5B5"
    android:layout_height="2px">
</View>
<!-- TITULO4 -->
<LinearLayout
    android:layout_height="wrap_content"
    android:layout_width="fill_parent"
    android:orientation="horizontal"
    android:background="#848284"
    android:padding="4px">
    <TextView
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:id="@+id/TextView01"
        android:text="Etapas"
        android:textColor="#FFFFFF"
        android:gravity="left"
        android:textStyle="bold"
        android:singleLine="true"
        android:ellipsize="end"
        android:layout_gravity="center_vertical"
        android:textSize="18px"
        android:paddingLeft="4px">
    </TextView>
    <LinearLayout
        android:layout_height="wrap_content"
        android:layout_width="fill_parent"
        android:layout_gravity="right|center_vertical"
        android:gravity="right|center_vertical"
        android:paddingTop="2px">
        <ToggleButton

            android:layout_height="wrap_content"
            android:layout_width="wrap_content"
            android:textOff="Expandir"
            android:textOn="Minimizar"
            android:id="@+id/mostrar"
            android:width="80px">
        </ToggleButton>
    </LinearLayout>
</LinearLayout>
<!--LINHA SEPARADORA-->
<View
    android:id="@+id/View01"
    android:layout_width="wrap_content"
    android:background="#B5B5B5"
    android:layout_height="2px">
</View>
</LinearLayout>
</ScrollView>

다음은 버튼 이벤트를 호출하는 자바 코드입니다.

final ToggleButton bt=(ToggleButton) findViewById(R.id.mostrar);


    bt.setOnClickListener(new OnClickListener() {
        public void onClick(View v) {
            if (bt.isChecked()) {

                /*TranslateAnimation slide = new TranslateAnimation(0, 0, 0,
                          -findViewById(R.id.informgeral).getHeight()*2);
                           slide.setDuration(500);
                           slide.setFillAfter(true);
                           findViewById(R.id.informgeral).startAnimation(slide);*/

                findViewById(R.id.informgeral).setVisibility(View.VISIBLE);;

            } else {

            /*  TranslateAnimation slide = new TranslateAnimation(0, 0, 0,
                          findViewById(R.id.informgeral).getHeight());
                           slide.setDuration(500);
                           slide.setFillAfter(true);
                           findViewById(R.id.informgeral).startAnimation(slide);*/


                           //findViewById(R.id.listBut).startAnimation(slide);


                findViewById(R.id.informgeral).setVisibility(View.GONE);;


            }
        }
});



답변

tomash 가 전에 말한 것처럼 : 쉬운 방법은 없습니다.

여기 에서 내 대답을 살펴볼 수 있습니다 .
슬라이딩 (치수 변경)보기를 실현하는 방법을 설명합니다.
이 경우에는 왼쪽 및 오른쪽보기였습니다 : 왼쪽 확장, 오른쪽 사라짐.
필요한 것을 정확히 수행하지 못할 수도 있지만 창의적인 정신으로 작동하도록 만들 수 있습니다.)


답변

레이아웃 변경에 애니메이션을 적용하려면 LinearLayout에 다음 속성을 추가 할 수 있습니다.

android:animateLayoutChanges="true"

자동으로 변경 사항을 애니메이션으로 보여줍니다.


정보를 위해를 android:animateLayoutChanges="true"사용 하면 anim xml을 통한 사용자 정의 애니메이션이 작동하지 않습니다.


답변

가시성 변경 자체는 setVisibility 메서드를 재정 의하여 쉽게 애니메이션 할 수 있습니다. 완전한 코드를보십시오 :

public class SimpleViewAnimator extends FrameLayout
{
    private Animation inAnimation;
    private Animation outAnimation;

    public SimpleViewAnimator(Context context)
    {
        super(context);
    }

    public void setInAnimation(Animation inAnimation)
    {
        this.inAnimation = inAnimation;
    }

    public void setOutAnimation(Animation outAnimation)
    {
        this.outAnimation = outAnimation;
    }

    @Override
    public void setVisibility(int visibility)
    {
        if (getVisibility() != visibility)
        {
            if (visibility == VISIBLE)
            {
                if (inAnimation != null) startAnimation(inAnimation);
            }
            else if ((visibility == INVISIBLE) || (visibility == GONE))
            {
                if (outAnimation != null) startAnimation(outAnimation);
            }
        }

        super.setVisibility(visibility);
    }
}


답변

이것은 여전히 ​​사람들에게 문제가 있음을 보여주는 꽤 오래된 질문입니다.

  • 애니메이션 조정 (속도, 유형, …)
  • 클래스를 확장 할 필요가 없습니다.
  • 제 경우에는 animateLayoutChanges에 새로운 문제가 있습니다. CoordinatorLayout

함수-예 (유틸리티 클래스에이 함수가 있습니다)

public static void animateViewVisibility(final View view, final int visibility)
{
    // cancel runnning animations and remove and listeners
    view.animate().cancel();
    view.animate().setListener(null);

    // animate making view visible
    if (visibility == View.VISIBLE)
    {
        view.animate().alpha(1f).start();
        view.setVisibility(View.VISIBLE);
    }
    // animate making view hidden (HIDDEN or INVISIBLE)
    else
    {
        view.animate().setListener(new AnimatorListenerAdapter()
        {
            @Override
            public void onAnimationEnd(Animator animation)
            {
                view.setVisibility(visibility);
            }
        }).alpha(0f).start();
    }
}

애니메이션 조정

호출 후 view.animate()애니메이션을 원하는대로 조정할 수 있습니다 (기간 설정, 보간 기 설정 등 …). 알파 값을 조정하는 대신 배율을 조정하여 뷰를 숨길 수도 있습니다. 원하는 경우 유틸리티 메서드에서 alpha(...)scaleX(...)또는scaleY(...)


답변

그룹을 열고 닫을 수있는 특수 ListView 인 ExpandableListView를 사용하고 싶을 것입니다.


답변

뷰 숨기기 / 표시를 애니메이션하는 쉬운 방법은 없습니다. 다음 답변에 설명 된 방법을 시도해 볼 수 있습니다 .View.setVisibility (GONE) 애니메이션 방법


답변

API 데모에 설명 된 확장 가능한 목록보기를 사용하여 그룹을 표시 할 수 있습니다.

http://developer.android.com/resources/samples/ApiDemos/src/com/example/android/apis/view/ExpandableList1.html .

목록 항목 모션을 애니메이션하려면 getView 메서드를 재정의하고 각 목록 항목에 번역 애니메이션을 적용해야합니다. 애니메이션 값은 각 목록 항목의 위치에 따라 다릅니다. 이것은 내가 오랫동안 간단한 목록보기에서 시도한 것입니다.