第十二天.Android動畫技術 · 14天學會安卓開發

## 第十二天.Android動畫技術 ## ### 12.1 Tween動畫 ### #### 12.1.1 動畫實現 #### + Tween動畫對場景中的對象不斷進行圖像變換，如平移、縮放、旋轉。 + Frame幀動畫順序播放事先做好的圖像，如電影。 + GIF動畫 #### 12.1.2 代碼實現Tween動畫1 #### ``` /* 裝載資源 */ Bitmap mBitQQ mBitQQ = ((BitmapDrawable)getResources().getDrawable(R.drawable.qq)).getBitmap(); /* 繪制圖片 */ canvas.drawBitmap(mBitQQ, 0, 0, null); /* 創建Alpha動畫 */ private Animation mAnimationAlpha = newAlphaAnimation(0.1f, 1.0f); /* 設置動畫的時間 */ mAnimationAlpha.setDuration(3000); /* 開始播放動畫 */ this.startAnimation(mAnimationAlpha); /* 創建Scale動畫 */ private Animation mAnimationScale =newScaleAnimation(0.0f, 1.0f, 0.0f, 1.0f,Animation.RELATIVE_TO_SELF, 0.5f,Animation.RELATIVE_TO_SELF, 0.5f); /* 設置動畫的時間 */ mAnimationScale.setDuration(500); /* 開始播放動畫 */ this.startAnimation(mAnimationScale); ``` #### 12.1.3 代碼實現Tween動畫2 #### ``` /* 創建Translate動畫 */ private Animation mAnimationTranslate =new TranslateAnimation(10, 100,10, 100); /* 設置動畫的時間 */ mAnimationTranslate.setDuration(1000); /* 開始播放動畫 */ this.startAnimation(mAnimationTranslate); /* 創建Rotate動畫 */ private Animation mAnimationRotate =newRotateAnimation(0.0f, +360.0f,Animation.RELATIVE_TO_SELF, 0.5f,Animation.RELATIVE_TO_SELF, 0.5f); /* 設置動畫的時間 */ mAnimationRotate.setDuration(1000); /* 開始播放動畫 */ this.startAnimation(mAnimationRotate); ``` #### 12.2.4 代碼實現Tween動畫:main.xml #### ``` <LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" > <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="@string/hello" /> <Button android:id="@+id/AlphaAnimation" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Alpha動畫"/> <Button android:id="@+id/ScaleAnimation" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Scale動畫"/> <Button android:id="@+id/TranslateAnimation" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Translate動畫"/> <Button android:id="@+id/RotateAnimation" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Rotate動畫"/> </LinearLayout> ``` #### 12.2.5 XML布局實現Tween動畫 #### ``` /* 裝載動畫布局 */ mAnimationAlpha =AnimationUtils.loadAnimation(mContext,R.anim.alpha_animation); /* 開始播放動畫 */ this.startAnimation(mAnimationAlpha); /* 裝載動畫布局 */ mAnimationScale =AnimationUtils.loadAnimation(mContext,R.anim.scale_animation); this.startAnimation(mAnimationScale); /* 裝載動畫布局 */ mAnimationTranslate =AnimationUtils.loadAnimation(mContext,R.anim.translate_animation); this.startAnimation(mAnimationTranslate); /* 裝載動畫布局 */ mAnimationRotate =AnimationUtils.loadAnimation(mContext,R.anim.rotate_animation); this.startAnimation(mAnimationRotate); ``` **R.anim.alpha_animation** ``` <setxmlns:android="http://schemas.android.com/apk/res/android" > <alpha android:fromAlpha="0.1" android:toAlpha="1.0" android:duration="2000" /> </set> ``` **R.anim.scale_animation** ``` <setxmlns:android="http://schemas.android.com/apk/res/android"> <scale android:interpolator="@android:anim/accelerate_decelerate_interpolator" android:fromXScale="0.0" android:toXScale="1.0" android:fromYScale="0.0" android:toYScale="1.0" android:pivotX="50%" android:pivotY="50%" android:fillAfter="false" android:duration="500" /> </set> ``` **R.anim.translate_animation** ``` <setxmlns:android="http://schemas.android.com/apk/res/android"> <translate android:fromXDelta="10" android:toXDelta="100" android:fromYDelta="10" android:toYDelta="100" android:duration="1000" /> </set> ``` **R.anim.rotate_animation** ``` <set xmlns:android="http://schemas.android.com/apk/res/android"> <rotate android:interpolator="@android:anim/accelerate_decelerate_interpolator" android:fromDegrees="0" android:toDegrees="+360" android:pivotX="50%" android:pivotY="50%" android:duration="1000" /> </set> ``` 案例AnimationDemo2 ### 12.2 Frame幀動畫 ### #### 12.2.1 代碼實現Frame動畫 #### ``` /* 實例化AnimationDrawable對象 */ private AnimationDrawable frameAnimation = newAnimationDrawable(); /*裝載資源 */ //這里用一個循環了裝載所有名字類似的資源，如“a1.......15.png”的圖片 for(int i = 1; i <= 15; i++){ intid = getResources().getIdentifier("a" + i, "drawable", mContext.getPackageName()); Drawable mBitAnimation =getResources().getDrawable(id); /*為動畫添加一幀 */ //參數mBitAnimation是該幀的圖片 //參數500是該幀顯示的時間,按毫秒計算 frameAnimation.addFrame(mBitAnimation,500); } /*設置播放模式是否循環false表示循環而true表示不循環 */ frameAnimation.setOneShot(false ); /*設置本類將要顯示這個動畫 */ this.setBackgroundDrawable(frameAnimation); /*開始播放動畫 */ frameAnimation.start(); ``` 案例AnimationDrawableDemo #### 12.2.2 XML實現Frame動畫 #### ``` /* 定義AnimationDrawable動畫對象 */ private AnimationDrawable frameAnimation= null; /* 定義一個ImageView用來顯示動畫 */ ImageView img = new ImageView(mContext); /* 裝載動畫布局文件 */ img.setBackgroundResource(R.anim.frameanimation); /* 構建動畫 */ private AnimationDrawable frameAnimation= (AnimationDrawable) img.getBackground(); /* 設置是否循環 */ frameAnimation.setOneShot( false ); /* 設置該類顯示的動畫 */ this.setBackgroundDrawable(frameAnimation); /* 開始播放動畫 */ frameAnimation.start(); ``` **frameanimation.xml** ``` <animation-listxmlns:android="http://schemas.android.com/apk/res/android" android:oneshot="false"> <item android:drawable="@drawable/a1"android:duration="500" /> <item android:drawable="@drawable/a2"android:duration="500" /> <item android:drawable="@drawable/a3"android:duration="500" /> <item android:drawable="@drawable/a4"android:duration="500" /> <item android:drawable="@drawable/a5"android:duration="500" /> <item android:drawable="@drawable/a6"android:duration="500" /> <item android:drawable="@drawable/a7"android:duration="500" /> <item android:drawable="@drawable/a8"android:duration="500" /> <item android:drawable="@drawable/a9"android:duration="500" /> <item android:drawable="@drawable/a10"android:duration="500" /> <item android:drawable="@drawable/a11"android:duration="500" /> <item android:drawable="@drawable/a12"android:duration="500" /> <item android:drawable="@drawable/a13"android:duration="500" /> <item android:drawable="@drawable/a14"android:duration="500" /> <item android:drawable="@drawable/a15"android:duration="500" /> </animation-list> ``` 案例AnimationDrawableDemo2 ### 12.3 GIF動畫 ### + 簡單介紹案例GifAnimationDemo ### 12.4 全屏與橫屏技術 ### ``` public void onCreate(BundlesavedInstanceState){ super.onCreate(savedInstanceState); /*設置為無標題欄 */ requestWindowFeature(Window.FEATURE_NO_TITLE); /*設置為全屏模式 */ getWindow().setFlags( WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN); /*設置為橫屏 */ setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE); setContentView(R.layout.main); } ``` 全屏技術在拍照、錄制視頻、游戲中很常用 ### 12.5 獲取屏幕屬性 ### ``` public void onCreate(BundlesavedInstanceState){ super.onCreate(savedInstanceState); setContentView(R.layout.main); /*定義DisplayMetrics對象 */ DisplayMetricsdm = new DisplayMetrics(); /*取得窗口屬性 */ getWindowManager().getDefaultDisplay().getMetrics(dm); /*窗口的寬度 */ intscreenWidth = dm.widthPixels; /*窗口的高度 */ intscreenHeight = dm.heightPixels; mTextView= (TextView) findViewById(R.id.TextView01); mTextView.setText("屏幕寬度：" + screenWidth + "\n屏幕高度：" + screenHeight); } ``` [示例下載](http://www.apkbus.com/android-83550-1-1.html)