第二十七講：Android之Animation（二）

標籤：android   style   blog   http   io   color   ar   使用   java   

勿以惡小而為之，勿以善小而不為。惟賢惟德，能服於人。—— 劉  備

本講內容：Animation 動畫 

一、Interpolator 插值器 (定義動畫變化的速率)         我們也可以自訂的插值器

Interpolator對象	資源ID	功能作用
AccelerateDecelerateInterpolator	@android:anim/accelerate_decelerate_interpolator	先加速再減速
AccelerateInterpolator	@android:anim/accelerate_interpolator	加速
AnticipateInterpolator	@android:anim/anticipate_interpolator	先回退一小步然後加速前進
AnticipateOvershootInterpolator	@android:anim/anticipate_overshoot_interpolator	在上一個基礎上超出終點一小步再回到終點
BounceInterpolator	@android:anim/bounce_interpolator	最後階段彈球效果
CycleInterpolator	@android:anim/cycle_interpolator	周期運動
DecelerateInterpolator	@android:anim/decelerate_interpolator	減速
LinearInterpolator	@android:anim/linear_interpolator	勻速
OvershootInterpolator	@android:anim/overshoot_interpolator	速到達終點並超出一小步最後回到終點

二、上一講我們用編碼實現動畫效果，本講將以XML形式定義動畫

我們通過一個例子感受一下，代碼的講解都寫在注釋裡了

下面是res/layout/activity_main.xml 布局檔案：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical"    tools:context="com.example.text.MainActivity$PlaceholderFragment" > <ImageView         android:id="@+id/image"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_gravity="center"        android:src="@drawable/c1"        android:layout_weight="1"/>   <Button        android:id="@+id/translate"        android:layout_width="match_parent"   android:layout_height="wrap_content"   android:text="測試translate動畫效果" />   <Button        android:id="@+id/alpha"        android:layout_width="match_parent"   android:layout_height="wrap_content"   android:text="測試alpha動畫效果" />   <Button        android:id="@+id/rotate"        android:layout_width="match_parent"   android:layout_height="wrap_content"   android:text="測試rotate動畫效果" />   <Button        android:id="@+id/scale"        android:layout_width="match_parent"   android:layout_height="wrap_content"   android:text="測試scale動畫效果" />    </LinearLayout>

在res檔案下建立一個檔案名稱為anim

下面是建立res/anim/alpha.xml檔案：

<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android"android:interpolator="@android:anim/accelerate_interpolator"><scale android:fromXScale="1.0" android:toXScale="0.0"android:fromYScale="1.0" android:toYScale="0.0" android:pivotX="50%"android:pivotY="50%" android:duration="2000" /></set>

android:interpolator="@android:anim/accelerate_interpolator"   <span style="font-family: Arial; font-size: 14px; line-height: 26px;">定義一個加速插值器</span>

下面是建立res/anim/rotate.xml檔案：

<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android"android:interpolator="@android:anim/accelerate_interpolator"><rotate android:fromDegrees="0"android:toDegrees="-360"android:pivotX="50%"android:pivotY="50%"android:duration="5000" /></set>

下面是建立res/anim/scale.xml檔案：

<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android"android:interpolator="@android:anim/accelerate_interpolator"><scale android:fromXScale="1.0" android:toXScale="0.0"android:fromYScale="1.0" android:toYScale="0.0" android:pivotX="50%"android:pivotY="50%" android:duration="2000" /></set>

下面是建立res/anim/translate.xml檔案：

<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android"android:interpolator="@android:anim/accelerate_interpolator"><translate android:fromXDelta="50%" android:toXDelta="100%" android:fromYDelta="0%" android:toYDelta="100%" android:duration="2000" /></set>

下面是MainActivity.java主介面檔案：

public class MainActivity extends Activity implements OnClickListener {private Button translate;private Button alpha;private Button rotate;private Button scale;private ImageView image;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);image = (ImageView) findViewById(R.id.image);translate = (Button) findViewById(R.id.translate);alpha = (Button) findViewById(R.id.alpha);rotate = (Button) findViewById(R.id.rotate);scale = (Button) findViewById(R.id.scale);translate.setOnClickListener(this);alpha.setOnClickListener(this);rotate.setOnClickListener(this);scale.setOnClickListener(this);}@Overridepublic void onClick(View v) {switch (v.getId()) {case R.id.translate:// 使用AnimationUtils裝載動畫設定檔案Animation anim1 = (Animation) AnimationUtils.loadAnimation(MainActivity.this, R.anim.translate);image.startAnimation(anim1);break;case R.id.alpha:Animation anim2 = AnimationUtils.loadAnimation(MainActivity.this,R.anim.alpha);image.startAnimation(anim2);break;case R.id.rotate:Animation anim3 = AnimationUtils.loadAnimation(MainActivity.this,R.anim.rotate);image.startAnimation(anim3);break;case R.id.scale:Animation anim4 = AnimationUtils.loadAnimation(MainActivity.this,R.anim.scale);image.startAnimation(anim4);break;}}}

下面是運行結果：

本講到這裡，謝謝大家！

第二十七講：Android之Animation（二）