使用TransitionDrawable为UI的背景切换添加交错渐变的过渡效果 上一篇介绍了如何使用RippleDrawable为UI添加点击水波纹效果 这一篇将作为介绍Drawable的第二篇，讲解如何使用TransitionDrawable来为UI背景切换设置交错渐变的过度效果。当你在加载显示一个ImageView或者更改一个UI的背景时，不希望切换的太过突然，希望添加一些类似于过渡效果的话，那么使用TransitionDrawable绝对是一个比较不错的选择，最起码比起在UI加载后强制使用一个动画要好一点，而且在代码上实现也更加简单。好了，废话不多说了，开始直接上代码。 首先在drawable目录下新建一个文件transition_drawable.xml 代码如下：
<?xml version="1.0" encoding="utf-8"?> <transition xmlns:android="http://schemas.android.com/apk/res/androi> <item android:drawable="@color/color_gray" /> <item android:drawable="@color/colorAccent" /> </transition>这个用作TextView背景切换时从灰色渐变过度到红色。 主布局文件： activity_main.xml:
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/activity_main" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" android:weightSum="1" tools:context="com.example.transitiondrawable.MainActivity"> <TextView android:id="@+id/tv" android:layout_width="match_parent" android:layout_height="80dp" android:layout_gravity="center_horizontal" android:gravity="center_horizontal|center_vertical" android:text="Hello World!" /> <ImageView android:id="@+id/iv" android:layout_width="200dp" android:layout_height="200dp" android:layout_gravity="center_horizontal" android:layout_marginBottom="40dp" android:layout_marginTop="30dp" android:contentDescription="null" /> <Button android:id="@+id/btn" android:layout_width="match_parent" android:layout_height="60dp" android:layout_gravity="center_horizontal" android:gravity="center_vertical|center_horizontal" android:text="@string/set_image" /> </LinearLayout>这里的ImageView所使用的TransitionDrawable将使用java代码生成，通过点击button可以切换ImageView中显示的图片。 Activity代码如下：
package com.example.transitiondrawable; import android.content.res.Resources; import android.graphics.drawable.Drawable; import android.graphics.drawable.TransitionDrawable; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.util.Log; import android.view.View; import android.widget.ImageView; import android.widget.TextView; public class MainActivity extends AppCompatActivity { private TextView tv; private ImageView iv; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); tv = (TextView) findViewById(R.id.tv); TransitionDrawable transitionDrawable = (TransitionDrawable) getResources().getDrawable(R.drawable.transition_drawable, null); tv.setBackground(transitionDrawable); transitionDrawable.startTransition(3000); Resources res = getResources(); TransitionDrawable imageTransitionDrawable = new TransitionDrawable(new Drawable[]{res.getDrawable(R.drawable.third,null), res.getDrawable(R.drawable.fourth,null)}); iv = (ImageView)findViewById(R.id.iv); iv.setImageDrawable(imageTransitionDrawable); imageTransitionDrawable.startTransition(3000); Drawable a = iv.getDrawable(); findViewById(R.id.btn).setOnClickListener(new View.OnClickListener(){ @Override public void onClick(View v) { if(iv.getDrawable() instanceof TransitionDrawable){ TransitionDrawable transitionDrawable = (TransitionDrawable) iv.getDrawable(); final Drawable first = transitionDrawable.getDrawable(1); TransitionDrawable btnTransitionDrawable = new TransitionDrawable(new Drawable[]{first,getResources().getDrawable(R.drawable.fifth)}); iv.setImageDrawable(btnTransitionDrawable); btnTransitionDrawable.startTransition(5000); }else{ final Drawable first = iv.getDrawable(); TransitionDrawable btnTransitionDrawable = new TransitionDrawable(new Drawable[]{first,getResources().getDrawable(R.drawable.fifth)}); iv.setImageDrawable(btnTransitionDrawable); btnTransitionDrawable.startTransition(5000); } } }); } }代码也很简单，我写的可能有点乱，通过set方法将TransitionDrawable设置为背景或者要显示的图画，然后调用TransitionDrawable中的startTransition方法，传入的参数为渐变过程的时间。 效果图如下：
基本上就是这些东西，涉及到东西不多，关于TransitionDrawable方面的东西就讲到这里，有兴趣的小伙伴可以追一下系统源码，看一下是如何实现的。 这是我的微信公众号，如果可以的话，希望您可以关注一下，这将是对我最大的鼓励，谢谢！！
源码已经上传至GitHub中，可以直接git clone获取源码！！！ 源码地址，里面除了本篇blog的源码，还有其他的源码哦，不要弄错了！！！
