Android Crossfading animation 淡出淡入动画

浏览数：37 / 时间：2015年06月11日

淡出淡入动画就是我们常说的渐隐动画，一个界面逐渐消失的时候另一个逐渐显现。当你需要在应用中切换两个视图的时候这个动画效果就显得非常实用了。这个动画短小但很精致，巧妙的衔接了视图的切换。如果你不使用这种动画会让整个切换过程显得生硬且急促。

准备开始

1.创建成员变量链接到你需要时间动画的view上。

2.让后显示的view先Gone掉，避免它占用layout的空间，避免计算它导致系统资源浪费，加快界面载入速度。

3.用一个成员变量缓存系统的config_shortAnimTime变量，这个变量是系统提供的一种动画时间，他会确保动画执行的更一致和更精致。与此变量作用相似的还有config_longAnimTime和config_mediumAnimTime。(引用方法:int mShortAnimationDuration = getResources().getInteger(android.R.integer.config_shortAnimTime);)

用代码标示：

public class CrossfadeActivity extends Activity {

    private View mContentView;
    private View mLoadingView;
    private int mShortAnimationDuration;

    ...

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

        mContentView = findViewById(R.id.content);
        mLoadingView = findViewById(R.id.loading_spinner);

        // Initially hide the content view.
        mContentView.setVisibility(View.GONE);

        // Retrieve and cache the system's default "short" animation time.
        mShortAnimationDuration = getResources().getInteger(
                android.R.integer.config_shortAnimTime);
    }

渐隐这个View

以上我们已经做好准备工作了，接下来我们会来实现把它渐隐。

1.把我们将要显示的view的alpha值改为0，将它Visibility改为Visible。现在这个view就能显示了，但是你还看不到它，因为他是透明的。

2.创建两个alpha的动画，一个是将alpha从0到1，另一个是将alpha值设置为从1到0。

3.在Animator.AnimatorListener的监听回调方法onAnimationEnd()将最开始显示的View gone掉。尽管他的alpha值是0我们已经看不到他了，但是我们还是需要把它的visibility属性设置为gone。这样可以减少他占用的空间，减少layout的计算，从而提升运行速度。

下面我们来看一下代码：

private View mContentView;
private View mLoadingView;
private int mShortAnimationDuration;

...

private void crossfade() {

    // Set the content view to 0% opacity but visible, so that it is visible
    // (but fully transparent) during the animation.
    mContentView.setAlpha(0f);
    mContentView.setVisibility(View.VISIBLE);

    // Animate the content view to 100% opacity, and clear any animation
    // listener set on the view.
    mContentView.animate()
            .alpha(1f)
            .setDuration(mShortAnimationDuration)
            .setListener(null);

    // Animate the loading view to 0% opacity. After the animation ends,
    // set its visibility to GONE as an optimization step (it won't
    // participate in layout passes, etc.)
    mLoadingView.animate()
            .alpha(0f)
            .setDuration(mShortAnimationDuration)
            .setListener(new AnimatorListenerAdapter() {
                @Override
                public void onAnimationEnd(Animator animation) {
                    mLoadingView.setVisibility(View.GONE);
                }
            });
}

－－－－－－－－－－－－－－本文完－－－－－－－－－－－－－－－