補間動畫(Tween Animation)
包括 (1)透明度漸變動畫 AlphaAnimation
(2)旋轉動畫 RotateAnimation
(3)縮放動畫 ScaleAnimation
(4)平移動畫 TranslateAnimation
1.做出如圖所示的界面兽埃,然后給各個按鈕加上onclick檩禾,對按鈕進行監(jiān)聽:
圖1-13.png
代碼如下:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<ImageView
android:id="@+id/imageView1"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="145dp"
android:src="@drawable/a09" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:orientation="horizontal" >
<Button
android:id="@+id/button1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="透明"
android:onClick="Alpha" />
<Button
android:id="@+id/button2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="旋轉"
android:onClick="Rotate"/>
<Button
android:id="@+id/button3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="縮放"
android:onClick="Scale"/>
<Button
android:id="@+id/button4"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="平移"
android:onClick="Translate" />
<Button
android:id="@+id/button5"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="全部"
android:onClick="All"/>
</LinearLayout>
</RelativeLayout>
2.在MainActivity中編寫各個按鈕應實現(xiàn)的功能
代碼如下:
先找到圖片斜做,以便把動畫效果運用到圖片上:
public class MainActivity extends Activity {
ImageView img;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
img = (ImageView) findViewById(R.id.imageView1);
}
(1)透明度漸變動畫 AlphaAnimation
public void Alpha(View view) {
AlphaAnimation aa = new AlphaAnimation(1.0f, 0.0f);// 1.0不透明的,0.0透明的
aa.setDuration(2000);// 設置動畫的持續(xù)時間,毫秒
aa.setRepeatCount(1);// 設置動畫重復的次數(shù) 重復兩次
aa.setRepeatMode(Animation.REVERSE);// 設置動畫重
復模式 REVERSE相反的回來一次 從有到無谈为,從無到有
img.startAnimation(aa); // 把動畫應用到圖片上
}
(2)旋轉動畫 RotateAnimation
public void Rotate(View view) {
// 以左上角為中心點進行旋轉360度
// RotateAnimation ra=new RotateAnimation(0.0f, 360.0f);
// 以自身中心點進行旋轉
RotateAnimation ra = new RotateAnimation(0.0f, 360.0f,
Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF,
0.5f);
ra.setDuration(2000);
ra.setRepeatCount(3); // 轉四圈
ra.setRepeatMode(Animation.REVERSE);
img.startAnimation(ra);
}
(3)縮放動畫 ScaleAnimation
public void Scale(View view) {
// 以左上角為縮放點
// ScaleAnimation sc=new ScaleAnimation(1.0f,2.0f,1.0f,2.0f);
// 以自身中心點為縮放點
ScaleAnimation sc = new ScaleAnimation(1.0f, 2.0f, 1.0f, 2.0f,
Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF,
0.5f);
sc.setDuration(2000);
sc.setRepeatCount(3);
sc.setRepeatMode(Animation.REVERSE);
img.startAnimation(sc);
}
(4)平移動畫 TranslateAnimation
public void Translate(View view) {
TranslateAnimation tr = new TranslateAnimation(
//x軸從-2.5到2.5旅挤,y軸從-2.0到2.0
Animation.RELATIVE_TO_SELF, -2.5f,
Animation.RELATIVE_TO_SELF, 2.5f,
Animation.RELATIVE_TO_SELF, -2.0f,
Animation.RELATIVE_TO_SELF, 2.0f);
tr.setDuration(5000);
tr.setRepeatCount(1);
tr.setRepeatMode(Animation.REVERSE);
// tr.setFillAfter(true);//走到哪之后,停下來
img.startAnimation(tr);
}
5.把幾種動畫效果合起來
public void All(View view) {
ScaleAnimation sc = new ScaleAnimation(1.0f, 2.0f, 1.0f, 2.0f,
Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF,
0.5f);
sc.setDuration(2000);
sc.setRepeatCount(3);
sc.setRepeatMode(Animation.REVERSE);
RotateAnimation ra = new RotateAnimation(0.0f, 360.0f,
Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF,
0.5f);
ra.setDuration(2000);
ra.setRepeatCount(3); // 轉四圈
ra.setRepeatMode(Animation.REVERSE);
AlphaAnimation aa = new AlphaAnimation(1.0f, 0.0f);// 1.0不透明的,0.0透明的
aa.setDuration(2000);// 設置動畫的持續(xù)時間伞鲫,毫秒
aa.setRepeatCount(3);// 設置動畫重復的次數(shù) 重復兩次
aa.setRepeatMode(Animation.REVERSE);// 設置動畫重
復模式 REVERSE相反的回來一次 從有到無粘茄,從無到有
AnimationSet as = new AnimationSet(true); // 創(chuàng)建一個動畫集合,把兩種動畫合在
一起
as.addAnimation(sc);
as.addAnimation(ra);
as.addAnimation(aa);
img.setAnimation(as);
}
運行結果如圖所示:
圖1-14.png
(2)
圖1-15.png
(3)
圖1-19.jpg
(4)
圖1-16.png
圖1-17.png
(5)
圖1-18.jpg
本節(jié)知識點:
1. setDuration(2000);// 設置動畫的持續(xù)時間秕脓,毫秒
2. setRepeatCount(3);// 設置動畫重復的次數(shù)
3.setRepeatMode(Animation.REVERSE);// 設置動畫重復模式 REVERSE相反的回來一次
從有到無柒瓣,從無到有
4.img.startAnimation(aa); // 把動畫應用到圖片上
5.AnimationSet as = new AnimationSet(true); // 創(chuàng)建一個動畫集合,把兩種動畫合在一
起