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

查志強發表於2014-06-25

【原文:http://blog.csdn.net/corder_raine/article/details/8317407

14天學會安卓開發  
作者:神祕的N (英文名  corder_raine)
聯絡方式:369428455(反饋)
交流群:284552167(示例,原文件下載)
版權為作者所有,如有轉載請註明出處
目錄       





第十二天.Android動畫技術
12.1 Tween動畫
12.1.1 動畫實現
Ø  Tween動畫
u  對場景中的物件不斷進行影象變換,如平移、縮放、旋轉。
u  Frame幀動畫
u  順序播放事先做好的影象,如電影。
u  GIF動畫
12.1.2 程式碼實現Tween動畫1
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
/* 裝載資源 */
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
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
<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動畫
01
02
03
04
05
06
07
08
09
10
11
12
13
/* 裝載動畫布局 */
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

1
2
3
4
5
6
7
<alpha
       android:fromAlpha="0.1"
       android:toAlpha="1.0"
       android:duration="2000"
/>
</set>


R.anim.scale_animation

01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
  <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

1
2
3
4
5
6
7
8
9
<translate
       android:fromXDelta="10"
       android:toXDelta="100"
       android:fromYDelta="10"
       android:toYDelta="100"
       android:duration="1000"
/>
</set>


R.anim.rotate_animation

01
02
03
04
05
06
07
08
09
10
11
<setxmlns: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動畫
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
/* 例項化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動畫
01
02
03
04
05
06
07
08
09
10
11
12
13
14
/* 定義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

01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
<animation-listxmlns:android="http://schemas.android.com/apk/res/android"
   android:oneshot="false">
   <itemandroid:drawable="@drawable/a1"android:duration="500"/>
   <itemandroid:drawable="@drawable/a2"android:duration="500"/>
   <itemandroid:drawable="@drawable/a3"android:duration="500"/>
   <itemandroid:drawable="@drawable/a4"android:duration="500"/>
   <itemandroid:drawable="@drawable/a5"android:duration="500"/>
   <itemandroid:drawable="@drawable/a6"android:duration="500"/>
   <itemandroid:drawable="@drawable/a7"android:duration="500"/>
   <itemandroid:drawable="@drawable/a8"android:duration="500"/>
   <itemandroid:drawable="@drawable/a9"android:duration="500"/>
   <itemandroid:drawable="@drawable/a10"android:duration="500"/>
   <itemandroid:drawable="@drawable/a11"android:duration="500"/>
   <itemandroid:drawable="@drawable/a12"android:duration="500"/>
   <itemandroid:drawable="@drawable/a13"android:duration="500"/>
   <itemandroid:drawable="@drawable/a14"android:duration="500"/>
   <itemandroid:drawable="@drawable/a15"android:duration="500"/>    
</animation-list>



** 案例AnimationDrawableDemo2

12.3 GIF動畫
Ø  簡單介紹案例GifAnimationDemo 

12.4 全屏與橫屏技術
01
02
03
04
05
06
07
08
09
10
11
12
13
publicvoid 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 獲取螢幕屬性
01
02
03
04
05
06
07
08
09
10
11
12
13
14
publicvoid 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);
       }



示例下載

相關文章