使用动画将视图的可见性从消失变为可见

Posted 2023-02-21

【中文标题】使用动画将视图的可见性从消失变为可见

【英文标题】：Animate visibility of a view from gone to visible with animation

【发布时间】：2017-10-24 00:42:39

【问题描述】：

我有一个默认为invisible 的视图（只是第一次）。

现在我需要用这个animation 将可见性切换到VISIBLE：

if (myView.getVisibility() == View.INVISIBLE) 
    myView.setVisibility(View.VISIBLE);
    myView.animate().translationY(0);
 

（和 SnackBar 默认动画一样）

但这不起作用。它将通过默认动画变为可见

有什么简单的方法可以实现吗？

注意

我正在为我的视图设置动画以消除，如下所示：

myView.animate().translationY(myView.getHeight());

【参考方案1】：

这是动画视图可见性的最佳方式：

private void viewGoneAnimator(final View view) 

    view.animate()
            .alpha(0f)
            .setDuration(500)
            .setListener(new AnimatorListenerAdapter() 
                @Override
                public void onAnimationEnd(Animator animation) 
                    view.setVisibility(View.GONE);
                
            );



private void viewVisibleAnimator(final View view) 

    view.animate()
            .alpha(1f)
            .setDuration(500)
            .setListener(new AnimatorListenerAdapter() 
                @Override
                public void onAnimationEnd(Animator animation) 
                    view.setVisibility(View.VISIBLE);
                
            );

然后在您想要使视图可见或消失的任何位置调用此方法，并将预期视图作为参数提供给方法。

【讨论】：

嘿，如果让它可见，它不会动画:(我使用了上面提到的相同方法。

解决此问题的方法是使用 onAnimationStart()callback 为 viewVisibleAnimator

【参考方案2】：

只需在布局中添加android:animateLayoutChanges="true"。 当我将可见性设置为 linear_container 时，linear_bottom 将从下到上设置动画并取代“linear_container”。

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_
        android:animateLayoutChanges="true"
        android:orientation="vertical"
        android:layout_>
       <android.support.design.widget.AppBarLayout
            android:id="@+id/layoutTop"
            android:layout_
            android:layout_>
        </android.support.design.widget.AppBarLayout>

       <LinearLayout
            android:id="@+id/linear_container"
            android:layout_
            android:layout_
       </LinearLayout>
       <LinearLayout
            android:id="@+id/linear_bottom"
            android:layout_
            android:layout_
       </LinearLayout>
</LinearLayout>

【讨论】：

非常感谢您，这对我来说是最好的答案！

【参考方案3】：

基于this 答案：

使用这种方法，我可以将我的视图的visibility 设置为VISIBLE，并带有slideUp 动画（如snackbar 动画）：

int getScreenHeight() 
    DisplayMetrics displaymetrics = new DisplayMetrics();
    activity.getWindowManager().getDefaultDisplay().getMetrics(displaymetrics);
    return displaymetrics.heightPixels;


public void animateOnScreen(View view) 
    final int screenHeight = getScreenHeight();
    ObjectAnimator animator = ObjectAnimator.ofFloat(view, "y", screenHeight, (screenHeight * 0.8F));
    animator.setInterpolator(new DecelerateInterpolator());
    animator.start();

然后我可以这样使用它：

if (myView.getVisibility() == View.INVISIBLE) 
    myView.setVisibility(View.VISIBLE);
    animateOnScreen(myView);

【参考方案4】：

使用 ConstraintLayout 添加动画

只需在可见性已更新的视图上方添加以下代码：

TransitionManager.beginDelayedTransition(constraintLayout)

注意：

ConstraintLayout 只会在其直接子级上执行动画，因为它只知道您何时更改布局参数和对它处理的子级的约束。 ConstraintLayout 仅对与布局相关的更改进行动画处理。

更多信息请看这篇帖子https://robinhood.engineering/beautiful-animations-using-android-constraintlayout-eee5b72ecae3

【讨论】：

这个选项很有趣，它甚至可以更快地更新recycleView，即使我已经在另一个布局上实现了它。

【参考方案5】：

您可以使用XML 动画来做到这一点。

使用set 和alpha 创建slide-up 动画XML，并将此XML 放入资源anim 文件夹中。

slide_up.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >

    <translate
        android:duration="500"
        android:fromYDelta="100%"
        android:toYDelta="0" />
</set>

使用：

使用AnimationUtils.loadAnimation() 从XML 加载动画并使用.startAnimation() 方法设置和启动动画。

这是一个例子：

ImageView imageView = (ImageView) findViewById(R.id.imageView);

// slide-up animation
Animation slideUp = AnimationUtils.loadAnimation(this, R.anim.slide_up);

if (imageView.getVisibility() == View.INVISIBLE) 
    imageView.setVisibility(View.VISIBLE);
    imageView.startAnimation(slideUp);

希望对你有帮助~

【讨论】：

我已经更新了我的答案。它现在显示像小吃店一样的上滑动画

感谢您的回复，您的解决方案也很有效，我会接受它，因为它对我来说看起来更干净。

很高兴知道这一点。如果我的回答看起来有用，请点赞。提前致谢

感谢您的解决方案，当我试图使视图消失时，我想做确切的事情，但它不起作用，并且一次不可见视图，我应该做些什么这个位置有什么不同？

嘿@ArashAfsharpour 这里有同样的问题，你找到解决办法了吗？