Android 创建淡入淡出动画的详解

Posted 2021-12-30 路宇

介绍：

淡入淡出动画（也称为“叠化”）逐渐淡出一个 View 或 ViewGroup，同时淡入另一个。此动画适用于您希望在应用中切换内容或视图的情况。

下面我们通过一个例子来创建使用淡入淡出动画。

首先创建一个简单的布局activity_short_anim.xml

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".ShortAnimActivity">

    <ScrollView
        android:id="@+id/scrollView"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <TextView
            style="?android:textAppearanceMedium"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:lineSpacingMultiplier="1.2"
            android:padding="16dp"
            android:text="@string/lorem_ipsum" />
    </ScrollView>

    <ProgressBar
        android:id="@+id/progressBar"
        style="?android:progressBarStyleLarge"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center" />
</FrameLayout>

接下来在对应的Activity中实现相应的功能ShortAnimActivity类

public class ShortAnimActivity extends AppCompatActivity 
    private ScrollView scrollView;
    private ProgressBar progressBar;
    private int shortAnimationDuration;

    @Override
    protected void onCreate(Bundle savedInstanceState) 
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_short_anim);
        scrollView = findViewById(R.id.scrollView);
        progressBar = findViewById(R.id.progressBar);

        scrollView.setVisibility(View.GONE);
        //长动画的持续时间为500ms
        shortAnimationDuration = getResources().getInteger(android.R.integer.config_longAnimTime);
    

    @Override
    public boolean onCreateOptionsMenu(Menu menu) 
        getMenuInflater().inflate(R.menu.animation_menu, menu);
        return true;
    

    @Override
    public boolean onOptionsItemSelected(@NonNull MenuItem item) 
        switch (item.getItemId()) 
            case R.id.cross:
                crossFade();
                break;
            default:
                break;
        
        return super.onOptionsItemSelected(item);
    

    private void crossFade() 
        //将内容视图设置为0%不透明(就是透明的意思,不可见的状态),正常显示的为100%不透明可见
        // 以便在动画期间可见
        scrollView.setAlpha(0f);
        scrollView.setVisibility(View.VISIBLE);

        //将内容视图设置为100%不透明，并清除视图上的任何动画监听器
        scrollView.animate()
                .alpha(1f)
                .setDuration(shortAnimationDuration)
                .setListener(null);

        //将动画视图设置为0%不透明，动画结束后，将视图隐藏
        progressBar.animate()
                .alpha(0f)
                .setDuration(shortAnimationDuration)
                .setListener(new AnimatorListenerAdapter() 
                    @Override
                    public void onAnimationEnd(Animator animation) 
                        super.onAnimationEnd(animation);
                        progressBar.setVisibility(View.GONE);
                    
                );

    

通过点击选项菜单，实现一个淡入淡出的效果，我设置的是500ms的一个动画时间，大家可能看的不太明显，但是实际开发中就是这么一个效果，动画时间不会太长。
效果如图所示：

以上就是淡入淡出动画的简单使用~