Android编程实现图片背景渐变切换与图层叠加效果

  xmlns:tools="http://schemas.android.com/tools"

  android:layout_width="match_parent"

  android:layout_height="match_parent"

  android:paddingLeft="@dimen/activity_horizontal_margin"

  android:paddingRight="@dimen/activity_horizontal_margin"

  android:paddingTop="@dimen/activity_vertical_margin"

  android:paddingBottom="@dimen/activity_vertical_margin"

  tools:ignore="ContentDescription"

  tools:context=".MainActivity">

    android:id="@+id/color_iv"

    android:layout_width="200dp"

    android:layout_height="200dp"

    android:layout_centerHorizontal="true"

    android:src="@drawable/image_bg_2"

    android:layout_margin="20dp"/>

    android:id="@+id/note_text"

    android:layout_below="@+id/color_iv"

    android:layout_width="wrap_content"

    android:layout_height="wrap_content"

    android:textSize="16sp"

    android:layout_margin="10dp"

    android:text="点击颜色块，切换图片背景"/>

    android:layout_width="match_parent"

    android:layout_height="48dip"

    android:layout_below="@+id/note_text"

    android:layout_marginBottom="8dip"

    android:layout_marginLeft="4dip"

    android:layout_marginRight="4dip"

    android:orientation="horizontal">

      android:layout_width="0dip"

      android:layout_height="match_parent"

      android:layout_margin="4dip"

      android:layout_weight="1"

      android:background="#99666666"

      android:onClick="onColorClicked"

      android:tag="#99666666"/>

      android:layout_width="0dip"

      android:layout_height="match_parent"

      android:layout_margin="4dip"

      android:layout_weight="1"

      android:background="#9996AA39"

      android:onClick="onColorClicked"

      android:tag="#9996AA39"/>

      android:layout_width="0dip"

      android:layout_height="match_parent"

      android:layout_margin="4dip"

      android:layout_weight="1"

      android:background="#99C74B46"

      android:onClick="onColorClicked"

      android:tag="#99C74B46"/>

      android:layout_width="0dip"

      android:layout_height="match_parent"

      android:layout_margin="4dip"

      android:layout_weight="1"

      android:background="#99F4842D"

      android:onClick="onColorClicked"

      android:tag="#99F4842D"/>

      android:layout_width="0dip"

      android:layout_height="match_parent"

      android:layout_margin="4dip"

      android:layout_weight="1"

      android:background="#993F9FE0"

      android:onClick="onColorClicked"

      android:tag="#993F9FE0"/>

      android:layout_width="0dip"

      android:layout_height="match_parent"

      android:layout_margin="4dip"

      android:layout_weight="1"

      android:background="#995161BC"

      android:onClick="onColorClicked"

      android:tag="#995161BC"/>

packagecom.sinatj.colorgradientanim;

importandroid.graphics.Color;

importandroid.graphics.drawable.ColorDrawable;

importandroid.graphics.drawable.Drawable;

importandroid.graphics.drawable.LayerDrawable;

importandroid.graphics.drawable.TransitionDrawable;

importandroid.os.Build;

importandroid.os.Handler;

importandroid.support.v7.app.ActionBarActivity;

importandroid.os.Bundle;

importandroid.view.View;

importandroid.widget.ImageView;

publicclassMainActivityextendsActionBarActivity {

  privateImageView imageView;

  privateDrawable oldBackground =null;

  privateDrawable bgDrawable;

  @Override

  protectedvoidonCreate(Bundle savedInstanceState) {

    super.onCreate(savedInstanceState);

    setContentView(R.layout.activity_main);

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

    bgDrawable = getResources().getDrawable(R.drawable.image_bg_1);

    //初始颜色

    changeColor(Color.parseColor("#6696AA39"));

  }

  privatevoidchangeColor(intnewColor) {

    Drawable colorDrawable =newColorDrawable(newColor);

    //图层叠加

    LayerDrawable ld =newLayerDrawable(newDrawable[]{bgDrawable, colorDrawable});

    if(oldBackground ==null) {

      imageView.setBackgroundDrawable(ld);

    }else{

      //渐变切换

      TransitionDrawable td =newTransitionDrawable(newDrawable[]{oldBackground, ld});

      imageView.setBackgroundDrawable(td);

      td.startTransition(300);

    }

    oldBackground = ld;

  }

  publicvoidonColorClicked(View v) {

    intcolor = Color.parseColor(v.getTag().toString());

    changeColor(color);

  }

}