我有一个线性布局,我想显示或隐藏与动画,推动布局向上或向下每当我改变其可见性。

我在那里看过一些样品,但没有一个适合我的需要。

我已经为动画创建了两个xml文件,但我不知道当我改变线性布局的可见性时如何启动它们。


当前回答

我在理解和应用公认的答案时遇到了困难。我需要更多的背景知识。现在我已经搞清楚了,下面是一个完整的例子:

MainActivity.java

public class MainActivity extends AppCompatActivity {

    Button myButton;
    View myView;
    boolean isUp;

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

        myView = findViewById(R.id.my_view);
        myButton = findViewById(R.id.my_button);

        // initialize as invisible (could also do in xml)
        myView.setVisibility(View.INVISIBLE);
        myButton.setText("Slide up");
        isUp = false;
    }

    // slide the view from below itself to the current position
    public void slideUp(View view){
        view.setVisibility(View.VISIBLE);
        TranslateAnimation animate = new TranslateAnimation(
                0,                 // fromXDelta
                0,                 // toXDelta
                view.getHeight(),  // fromYDelta
                0);                // toYDelta
        animate.setDuration(500);
        animate.setFillAfter(true);
        view.startAnimation(animate);
    }

    // slide the view from its current position to below itself
    public void slideDown(View view){
        TranslateAnimation animate = new TranslateAnimation(
                0,                 // fromXDelta
                0,                 // toXDelta
                0,                 // fromYDelta
                view.getHeight()); // toYDelta
        animate.setDuration(500);
        animate.setFillAfter(true);
        view.startAnimation(animate);
    }

    public void onSlideViewButtonClick(View view) {
        if (isUp) {
            slideDown(myView);
            myButton.setText("Slide up");
        } else {
            slideUp(myView);
            myButton.setText("Slide down");
        }
        isUp = !isUp;
    }
}

activity_mail.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.slideview.MainActivity">

    <Button
        android:id="@+id/my_button"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="100dp"
        android:onClick="onSlideViewButtonClick"
        android:layout_width="150dp"
        android:layout_height="wrap_content"/>

    <LinearLayout
        android:id="@+id/my_view"
        android:background="#a6e1aa"
        android:orientation="vertical"
        android:layout_alignParentBottom="true"
        android:layout_width="match_parent"
        android:layout_height="200dp">

    </LinearLayout>

</RelativeLayout>

笔记

感谢这篇文章为我指明了正确的方向。它比本页上的其他答案更有帮助。 如果你想从屏幕上的视图开始,那么不要将它初始化为INVISIBLE。 因为我们是完全在屏幕外制作动画,所以没有必要将它设置为INVISIBLE。如果你的动画不是完全脱离屏幕,那么你可以添加一个alpha动画,并使用AnimatorListenerAdapter设置可见性。 动画文档

其他回答

一个完整的答案,在onClick中切换视图可见性,也翻转箭头,并在隐藏组件时平滑地向上移动其他视图。

private fun toggleRecyclerViewVisibility(
    recyclerView: RecyclerView,
    container: FrameLayout,
    arrow: ImageView
) {
    //toggle arrow direction, also block user clicks until animation finishes.
    arrow
        .animate()
        .rotation(
            if (arrow.rotation == 0F)
                180F
            else 0F
        )
        .withStartAction { container.isClickable = false }
        .withEndAction { container.isClickable = true }
        .start()

    //toggle recyclerview visibility with animation.
    with(recyclerView) {
        var cof = -1
        var vis = View.GONE
        var alph = 0F

        if (visibility == View.GONE) {
            cof = 0
            vis = View.VISIBLE
            alph = 1F
        }
        animate()
            .translationY(height.toFloat() * cof)
            .alpha(alph)
            .withStartAction {//in case showing the recyclerview show it at the beginning.
                if (vis == View.VISIBLE)
                    visibility = View.VISIBLE
            }
            .withEndAction {//in case hiding the recyclerview hide it at the end.
                if (vis == View.GONE)
                    visibility = View.GONE
            }
            .start()
    }
}

视图是这样的

        <LinearLayout
            android:id="@+id/subRootLinearView"
            android:animateLayoutChanges="true"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">

            <!--other views-->
            <LinearLayout
                android:id="@+id/Container"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical">

                <FrameLayout
                    android:id="@+id/header"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:background="@color/backgroundGray"
                    android:padding="16dp">

                    <TextView
                        android:id="@+id/text_view"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="@string/awaitingConfirmation"
                        android:textColor="@color/colorText"
                        android:textSize="16sp" />

                    <ImageView
                        android:id="@+id/arrow_image_view"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_gravity="end|center"
                        android:src="@drawable/ic_arrow" />
                </FrameLayout>

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

                    <androidx.recyclerview.widget.RecyclerView
                        android:id="@+id/recycler"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager" />
                </LinearLayout>
            </LinearLayout>

            <!--other views-->
            </LinearLayout>

然后在代码中首先添加这一行,这解决了animateLayoutChanges在大嵌套视图中不工作的问题,这基本上使其他视图在隐藏recyclerview时平滑地向上移动

subRootLinearView.layoutTransition.enableTransitionType(LayoutTransition.CHANGING)

你的父线性布局也应该包含这个属性

android:animateLayoutChanges="true"

然后用视图调用该方法

 toggleRecyclerViewVisibility(
                    recycler,
                    header,
                    arrowImageView
                )

使用ObjectAnimator

private fun slideDown(view: View) {
    val height = view.height
    ObjectAnimator.ofFloat(view, View.TRANSLATION_Y, 0f, height.toFloat()).apply {
        duration = 1000
        start()
    }
}

private fun slideUp(view: View) {
    val height = view.height
    ObjectAnimator.ofFloat(view, View.TRANSLATION_Y, height.toFloat(), 0f)).apply {
        duration = 1000
        start()
    }
}

当LinearLayout的可见性改变时,你可以通过创建LinearLayout的一个新的子类并覆盖setVisibility()来启动动画来启动正确的动画。考虑一下这样的事情:

public class SimpleViewAnimator extends LinearLayout
{
    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);
    }
}
if (filter_section.getVisibility() == View.GONE) {
    filter_section.animate()
            .translationY(filter_section.getHeight()).alpha(1.0f)
            .setListener(new AnimatorListenerAdapter() {
                @Override
                public void onAnimationStart(Animator animation) {
                    super.onAnimationStart(animation);
                    filter_section.setVisibility(View.VISIBLE);
                    filter_section.setAlpha(0.0f);
                }
            });
} else {
    filter_section.animate()
            .translationY(0).alpha(0.0f)
            .setListener(new AnimatorListenerAdapter() {
                @Override
                public void onAnimationEnd(Animator animation) {
                    super.onAnimationEnd(animation);
                    filter_section.setVisibility(View.GONE);
                }
            });
}

现在可见性改变动画应该通过过渡API来完成,该API在支持(androidx)包中可用。只需调用TransitionManager。beginDelayedTransition方法使用Slide过渡,然后改变视图的可见性。

import androidx.transition.Slide;
import androidx.transition.Transition;
import androidx.transition.TransitionManager;

private void toggle(boolean show) {
    View redLayout = findViewById(R.id.redLayout);
    ViewGroup parent = findViewById(R.id.parent);

    Transition transition = new Slide(Gravity.BOTTOM);
    transition.setDuration(600);
    transition.addTarget(R.id.redLayout);

    TransitionManager.beginDelayedTransition(parent, transition);
    redLayout.setVisibility(show ? View.VISIBLE : View.GONE);
}

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/parent"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <Button
        android:id="@+id/btn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="play" />

    <LinearLayout
        android:id="@+id/redLayout"
        android:layout_width="match_parent"
        android:layout_height="400dp"
        android:background="#5f00"
        android:layout_alignParentBottom="true" />
</RelativeLayout>

用另一个默认和自定义转换示例检查这个答案。