CH10-图形图像处理
目標
- 掌握常用繪圖類的使用 ,能夠繪制不同的圖形
- 掌握Matrix類的使用方式 ,能夠?qū)崿F(xiàn)為圖片添加特效的功能
- 掌握動畫的使用 ,能夠?qū)崿F(xiàn)補間動畫與逐幀動畫的效果
? 圖形圖像在Android應(yīng)用中會經(jīng)常用到,如一些程序的圖標、界面的美化等都離不開圖形圖像。Android系統(tǒng)對圖形圖像的處理非常強大,對于2D圖像它沒有沿用Java中的圖形處理類,而是使用了自定義的處理類,接下來本章將針對Android常用的繪圖類、圖形圖像特效以及動畫進行講解 。
一、常用的繪圖類
目標
- 掌握常用繪圖類的使用 ,能夠繪制不同的圖形
? Android中常用的繪圖類有Bitmap類、BitmapFactory類、Paint類以及Canvas類,通過對這幾個類的使用可以分別實現(xiàn)創(chuàng)建位圖、將指定資源解析為位圖、創(chuàng)建畫筆、繪制畫布等功能。
-
Bitmap類:可以獲取圖像文件信息,對圖像進行剪切、旋轉(zhuǎn)、縮放等操作,并可以指定格式保存圖像文件。
-
BitmapFactory類:是位圖工廠,它是一個工具類。
-
Paint類:代表畫筆,用來描述圖形的顏色及風格。
-
Canvas類:代表畫布,通過該類提供的方法,可以繪制各種圖形。
1.1 Bitmap類
Bitmap類提供了一些靜態(tài)方法,具體如下表所示。
| createBitmap(int width, int height, Config config) | 創(chuàng)建位圖,width代表要創(chuàng)建的圖片的寬度,height代表高度,config代表圖片的配置信息 |
| createBitmap(int colors[], int offset, int stride,int width, int height, Config config) | 使用顏色數(shù)組創(chuàng)建一個指定寬高的位圖,顏色數(shù)組的個數(shù)為width*height |
| createBitmap(Bitmap src) | 使用源位圖創(chuàng)建一個新的位圖 |
| createBitmap(Bitmap source, int x, int y, int width, int height) | 從源位圖的指定坐標開始剪切指定寬高的一塊圖像,用于創(chuàng)建新的位圖 |
| createBitmap(Bitmap source, int x, int y, int width, int height,Matrix m, boolean filter) | 按照Matrix規(guī)則從源位圖的指定坐標開始剪切指定寬高的一塊圖像,用于創(chuàng)建新的位圖。 |
1.2BitmapFactory類
| decodeFile(String pathName) | 將指定路徑的文件解碼為位圖 |
| decodeStream(InputStream is) | 將指定輸入流解碼為位圖 |
| decodeResource(Resources res, int id) | 將給定的資源id解析為位圖 |
1.3 Paint類
| setARGB(int a, int r, int g, int b) | 設(shè)置顏色,各參數(shù)值均為0~255之間的整數(shù),幾個參數(shù)分別用于表示透明度、紅色、綠色和藍色的值 |
| setColor(int color) | 設(shè)置顏色 |
| setAlpha(int a) | 設(shè)置透明度 |
| setAntiAlias(boolean aa) | 設(shè)置畫筆是否使用抗鋸齒功能 |
| setTextAlign(Align align) | 設(shè)置繪制文本時的文字對齊方式。參數(shù)值為Align.CENTER、Align.LEFT、Align.RIGHT,分別表示居中,左或右對齊 |
| setTextSize(float textSize) | 設(shè)置繪制文本時的文字大小 |
| setFakeBoldText(boolean fakeBoldText) | 設(shè)置繪制文字時是否為粗體文字 |
| setDither(boolean dither) | 指定是否使用圖像抖動處理,如果使用會使圖像顏色更加平滑、飽滿、清晰 |
| setShadowLayer(float radius, float dx, float dy, int color) | 設(shè)置陰影。radius表示陰影的角度,dx和dy表示陰影在x軸和y軸上的距離,color表示陰影的顏色 |
| setXfermode(Xfermode xfermode) | 設(shè)置圖像的混合模式 |
接下來定義一個畫筆,并指定該畫筆的顏色為紅色,示例代碼如下:
Paint paint = new Paint(); paint.setColor(Color.RED); //指定畫筆顏色為紅色1.4 Canvas類
| drawRect(Rect r, Paint paint) | 使用畫筆繪制矩形 |
| drawOval(RectF oval, Paint paint) | 使用畫筆繪制橢圓形 |
| drawCircle(float cx, float cy, float radius, Paint paint) | 使用畫筆在指定位置畫出指定半徑的圓 |
| drawLine(float startX, float startY, float stopX, float stopY, Paint paint) | 使用畫筆在指定位置畫線 |
| drawRoundRect(RectF rect, float rx, float ry, Paint paint) | 使用畫筆繪制指定圓角矩形,其中rx表示X軸圓角半徑,ry表示Y軸圓角半徑 |
在View的onDraw()方法中使用畫筆Paint在畫布上繪制矩形。
protected void onDraw(Canvas canvas) {super.onDraw(canvas);Paint paint = new Paint(); //創(chuàng)建畫筆 paint.setColor(Color.RED);Rect r = new Rect(40,40,200,100); //構(gòu)建矩形對象并指定位置、寬高canvas.drawRect(r,paint); //調(diào)用繪制矩形的方法 }1.5 實戰(zhàn)演練—繪制小狗
? 本節(jié)我們將通過一個繪制小狗的案例來演示如何使用這些常用的繪圖類,本案例的界面效果如下圖所示。
繪制小狗的自定義View類 drawdog\DrawView.java
package cn.itcast.drawdog;import android.content.Context; import android.graphics.Bitmap; import android.graphics.BitmapFactory; import android.graphics.Canvas; import android.graphics.Paint; import android.util.AttributeSet; import android.view.View;public class DrawView extends View {private Context mContext;public DrawView(Context context, AttributeSet attrs) {super(context, attrs);this.mContext=context;}@Overrideprotected void onDraw(Canvas canvas) {this.setBackgroundResource(R.drawable.bg);//設(shè)置畫布的背景圖片//將dog.png圖片資源解碼為位圖Bitmap dogBitmap = BitmapFactory.decodeResource(mContext.getResources(),R.drawable.dog);Paint paint = new Paint();//創(chuàng)建畫筆canvas.drawBitmap(dogBitmap, 300, 550,paint); //繪制圖片} }放置界面控件 res\layout\activity_main.xml
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"><cn.itcast.drawdog.DrawViewandroid:layout_width="wrap_content"android:layout_height="wrap_content" /> </LinearLayout>二、為圖像添加特效
目標
- 掌握Matrix類的使用方式,能夠?qū)崿F(xiàn)為圖片添加特效的功能
| 平移 | setTranslate(float dx,float dy) | 指定圖像在X、Y軸移動dx和dy的距離 |
| 平移 | preTranslate(float dx, float dy) | 使用前乘的方式計算在X、Y軸平移的距離。 |
| 平移 | postTranslate(float dx,float dy) | 使用后乘的方式計算在X、Y軸平移的距離。 |
| 旋轉(zhuǎn) | setRotate(float degrees) | 指定圖片旋轉(zhuǎn)degrees度 |
| 旋轉(zhuǎn) | preRotate(float degrees) | 使用前乘的方式指定圖片旋轉(zhuǎn)degrees度 |
| 旋轉(zhuǎn) | postRotate(float degrees, float px, float py) | 使用后乘的方式控制Matrix以參數(shù)px和py為軸心旋轉(zhuǎn)degrees度 |
| 縮放 | setScale(float sx, float sy) | 指定圖像在X軸和Y軸的縮放比例為sx和sy |
| 縮放 | preScale(float sx, float sy) | 使用前乘的方式計算圖像在X軸和Y軸的縮放比例 |
| 縮放 | postScale(float sx, float sy) | 使用后乘的方式計算圖像在X軸和Y軸的縮放比例 |
| 傾斜 | setSkew(float kx, float ky) | 指定圖像在X、Y軸的傾斜值 |
| 傾斜 | preScale(float kx, float ky) | 使用前乘的方式設(shè)置圖像在X、Y軸的傾斜值 |
| 傾斜 | postScale(float kx, float ky) | 使用后乘的方式設(shè)置圖像在X、Y軸的傾斜值 |
接下來我們通過一個案例來演示如何使用Matrix類為圖片添加特效。本案例的界面效果如下圖所示。
創(chuàng)建TranslateView類 specialeffect\TranslateView.java
package cn.itcast.specialeffect;import android.content.Context; import android.graphics.Bitmap; import android.graphics.BitmapFactory; import android.graphics.Canvas; import android.graphics.Matrix; import android.graphics.Paint; import android.util.AttributeSet; import android.view.View;public class TranslateView extends View {public TranslateView(Context context) {super(context);}public TranslateView(Context context, AttributeSet attrs) {super(context, attrs);}public TranslateView(Context context, AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);}@Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);Paint paint = new Paint(); //創(chuàng)建畫筆 // 將圖片husky.png解析為bitmap位圖對象Bitmap bitmap = BitmapFactory.decodeResource(this.getResources(), R.drawable.husky);Matrix matrix = new Matrix(); //創(chuàng)建一個矩陣matrix.setTranslate(100,100); //將矩陣向右(X軸)平移100,向下(Y軸)平移100canvas.drawBitmap(bitmap, matrix, paint);//將圖片按照矩陣的位置繪制到界面上} }引用TranslateView類 res\layout\activity_main.xml
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"><cn.itcast.specialeffect.TranslateViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"></cn.itcast.specialeffect.TranslateView> </RelativeLayout>三、動畫
目標
- 掌握動畫的使用,能夠?qū)崿F(xiàn)補間動畫與逐幀動畫的效果
? 在Android開發(fā)中,避免不了用到動畫,Android系統(tǒng)給我們提供了三種實現(xiàn)動畫效果的方式,分別為補間動畫、逐幀動畫和屬性動畫。
3.1 補間動畫
在Android中,提供了四種補間動畫:
透明度漸變動畫
? 透明度漸變動畫是通過改變View組件透明度來實現(xiàn)的漸變效果。它主要通過指定動畫開始時View的透明度、結(jié)束時View的透明度以及動畫持續(xù)時間來實現(xiàn)的。
旋轉(zhuǎn)動畫
? 旋轉(zhuǎn)動畫是通過對View指定動畫開始時的旋轉(zhuǎn)角度、結(jié)束時的旋轉(zhuǎn)角度以及動畫播放時長來實現(xiàn)的。
pivotX: 可選50、50%、50%p (p表示parent)
- 50: 表示在當前View左上角的X軸坐標加上50px的位置,作為旋轉(zhuǎn)點的x軸坐標
- 50%: 表示在當前View左上角的X軸坐標加上View自己寬度的50%的位置,作為旋轉(zhuǎn)點的x軸坐標
- 50%p: 表示在當前View左上角的X軸坐標加上父控件寬度的50%的位置,作為旋轉(zhuǎn)點的x軸坐標
縮放動畫
? 縮放動畫是通過對動畫指定開始時的縮放系數(shù)、結(jié)束時的縮放系數(shù)以及動畫持續(xù)時長來實現(xiàn)的。
平移動畫
? 平移動畫是通過指定動畫的開始位置、結(jié)束位置以及動畫持續(xù)時長來實現(xiàn)的。
接下來,我們通過一個案例來演示4種補間動畫的效果。本案例的界面效果如下圖所示。
放置界面控件 res\layout\activity_main.xml
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"android:layout_marginBottom="5dp"><ImageViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:src="@drawable/iv_tween"android:layout_centerInParent="true"android:id="@+id/iv_bean"/><LinearLayoutandroid:layout_width="match_parent"android:layout_height="wrap_content"android:layout_alignParentBottom="true"><Buttonandroid:id="@+id/btn_one"android:layout_width="0dp"android:layout_height="wrap_content"android:layout_weight="1"android:text="漸變"/><Buttonandroid:id="@+id/btn_two"android:layout_width="0dp"android:layout_height="wrap_content"android:layout_weight="1"android:text="旋轉(zhuǎn)"/><Buttonandroid:id="@+id/btn_three"android:layout_width="0dp"android:layout_height="wrap_content"android:layout_weight="1"android:text="縮放"/><Buttonandroid:id="@+id/btn_four"android:layout_width="0dp"android:layout_height="wrap_content"android:layout_weight="1"android:text="移動" /></LinearLayout> </RelativeLayout>實現(xiàn)補間動畫的4種效果 tween\MainActivity.java
package cn.itcast.tween; import android.os.Bundle; import android.support.v7.app.AppCompatActivity; import android.view.View; import android.view.animation.Animation; import android.view.animation.AnimationUtils; import android.widget.Button; import android.widget.ImageView; public class MainActivity extends AppCompatActivity implements View.OnClickListener {private Button buttonOne;private Button buttonTwo;private Button buttonThree;private Button buttonFour;private ImageView ivBean;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);//初始化控件并為對應(yīng)的控件加添點擊事件的監(jiān)聽器buttonOne = findViewById(R.id.btn_one);buttonTwo = findViewById(R.id.btn_two);buttonThree = findViewById(R.id.btn_three);buttonFour = findViewById(R.id.btn_four);ivBean = findViewById(R.id.iv_bean);buttonOne.setOnClickListener(this);buttonTwo.setOnClickListener(this);buttonThree.setOnClickListener(this);buttonFour.setOnClickListener(this);}public void onClick(View v) {switch (v.getId()) {case R.id.btn_one: //"漸變"按鈕的點擊事件Animation alpha = AnimationUtils.loadAnimation(this,R.anim.alpha_animation);ivBean.startAnimation(alpha);break;case R.id.btn_two: //"旋轉(zhuǎn)"按鈕的點擊事件Animation rotate = AnimationUtils.loadAnimation(this,R.anim.rotate_animation);ivBean.startAnimation(rotate);break;case R.id.btn_three://"縮放"按鈕的點擊事件Animation scale = AnimationUtils.loadAnimation(this,R.anim.scale_animation);ivBean.startAnimation(scale);break;case R.id.btn_four: //"平移"按鈕的點擊事件Animation translate = AnimationUtils.loadAnimation(this,R.anim.translate_animation);ivBean.startAnimation(translate);break;}} }3.2 逐幀動畫
逐幀動畫是按照準備好的靜態(tài)圖像順序播放的,利用人眼的“視覺暫留”原理,造成動畫的錯覺。
逐幀動畫的原理與放膠片看電影的原理是一樣的,它們都是一張一張地播放事先準備好的靜態(tài)圖像。
? 接下來,我們通過一個案例來講解如何使用幀動畫來實現(xiàn)動態(tài)的Wi-Fi信號效果。本案例的界面效果如下圖所示。
放置界面控件 res\layout\activity_main.xml
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout 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:background="@android:color/white"tools:context=".MainActivity"><ImageViewandroid:id="@+id/iv_wifi"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_centerHorizontal="true"android:layout_marginTop="100dp"android:layout_marginBottom="20dp"android:background="@drawable/frame" /><Buttonandroid:id="@+id/btn_play"android:layout_width="70dp"android:layout_height="70dp"android:layout_below="@+id/iv_wifi"android:layout_centerHorizontal="true"android:layout_marginTop="20dp"android:background="@android:drawable/ic_media_play" /> </RelativeLayout>創(chuàng)建動畫資源 res\drawable\frame.xml
<?xml version="1.0" encoding="utf-8"?> <animation-list xmlns:android="http://schemas.android.com/apk/res/android" ><item android:drawable="@drawable/wifi01" android:duration="300"></item><item android:drawable="@drawable/wifi02" android:duration="300"></item><item android:drawable="@drawable/wifi03" android:duration="300"></item><item android:drawable="@drawable/wifi04" android:duration="300"></item><item android:drawable="@drawable/wifi05" android:duration="300"></item><item android:drawable="@drawable/wifi06" android:duration="300"></item> </animation-list>實現(xiàn)逐幀動畫的效果 frame\MainActivity.java
package cn.itcast.frame; import android.graphics.drawable.AnimationDrawable; import android.os.Bundle; import android.support.v7.app.AppCompatActivity; import android.view.View; import android.widget.Button; import android.widget.ImageView; public class MainActivity extends AppCompatActivity implements View.OnClickListener {private ImageView iv_wifi;private Button btn_start;private AnimationDrawable animation;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);iv_wifi = findViewById(R.id.iv_wifi);btn_start = findViewById(R.id.btn_play);btn_start.setOnClickListener(this);//獲取AnimationDrawable對象animation = (AnimationDrawable) iv_wifi.getBackground();}@Overridepublic void onClick(View v) {if (!animation.isRunning()) { //如果動畫當前沒有播放animation.start();//播放動畫btn_start.setBackgroundResource(android.R.drawable.ic_media_pause);} else {animation.stop(); //停止動畫btn_start.setBackgroundResource(android.R.drawable.ic_media_play);}}@Overrideprotected void onDestroy() {super.onDestroy();if(animation.isRunning()){animation.stop();}iv_wifi.clearAnimation();//清空控件的動畫} }3.3 屬性動畫
? 在Android 3.0之后,Android系統(tǒng)給我們提供了一種全新的動畫模式,屬性動畫(Property Animation),它是一種不斷地對屬性值進行操作的模式,也就是可以將值賦值到指定對象的指定屬性上,該指定屬性可以是任意對象的任意屬性。通過屬性動畫我們?nèi)匀豢梢詫σ粋€View進行移動、縮放、旋轉(zhuǎn)和透明度漸變等操作,同時也可以對自定義View中的Point(點)對象進行動畫操作,在實現(xiàn)這些動畫操作時,我們只需要設(shè)置動畫的運行時長、動畫的類型、動畫屬性的初始值和結(jié)束值即可。
? 屬性動畫彌補了補間動畫的一些缺陷,例如補間動畫只能作用在View上,只能對View實現(xiàn)移動、縮放、旋轉(zhuǎn)和透明度漸變動畫,只能改變View的位置,不能對View自身進行修改。
1.Animator類
接下來針對屬性動畫的Animator類、評估程序、插值器、動畫監(jiān)聽器進行詳細講解。
| ValueAnimator | 屬性動畫的主計時引擎,它也可以計算要添加動畫效果的屬性值。它具有計算屬性值所需要的核心功能,同時包含每個動畫的計時詳情、有關(guān)動畫是否重復播放的信息、用于接收更新事件的監(jiān)聽器以及設(shè)置待評估自定義類型的功能 |
| ObjectAnimator | ValueAnimator的子類,用于設(shè)置目標對象和對象屬性以添加動畫效果 |
| AnimatorSet | 此類提供一種將所有動畫組合在一起的機制,使這些動畫可以一起運行。我們可以將動畫設(shè)置為一起播放、按順序播放或者在指定的延遲時間后播放 |
使用ValueAnimator類添加動畫效果
? 我們可以調(diào)用ValueAnimator類中的ofInt()方法、ofFloat()方法或ofObject()方法來獲取要添加動畫效果的值。以獲取float類型的動畫效果值為例,示例代碼如下。
ValueAnimator animation = ValueAnimator.ofFloat(0f, 100f); //獲取float類型的動畫效果值 animation.setDuration(1000); //設(shè)置動畫播放時長 animation.start(); //開始播放動畫使用ObjectAnimator類添加動畫效果
? 當實例化ObjectAnimator類時,可以指定需要添加動畫的對象與該對象屬性的名稱,同時還可以指定在哪些值之間添加動畫效果。
//獲取float類型的動畫效果值 //translationX 表示動畫的對象相對于最初位置的x軸方向的偏移量 //100f 表示動畫的結(jié)束值 ObjectAnimator animation = ObjectAnimator.ofFloat(textView,"translationX", 100f); animation.setDuration(1000); //設(shè)置動畫播放時長 animation.start(); //開始播放動畫使用AnimatorSet類添加多個動畫效果
? 通常情況下,我們會遇到根據(jù)一個動畫的開始或結(jié)束時間來播放另一個動畫。在Android系統(tǒng)中,我們可以將這些需要一起播放的動畫存放在AnimatorSet類中,便于指定這些動畫是同時播放、按順序播放、還是在指定的延遲時間后播放,同時我們還可以使用AnimatorSet類播放另一個AnimatorSet類對象中的動畫。
2.評估程序
? 評估程序(類/接口)主要用于告知屬性動畫系統(tǒng)如何計算指定屬性的值。評估程序使用Animator 類提供的計時數(shù)據(jù)(動畫的起始值和結(jié)束值)來計算屬性添加動畫效果后的值。
| IntEvaluator | 用于計算int類型的屬性值的默認評估程序 |
| FloatEvaluator | 用于計算float類型的屬性值的默認評估程序 |
| ArgbEvaluator | 用于計算顏色類型的屬性值(用十六進制值表示)的默認評估程序 |
| TypeEvaluator | 此接口用于自定義一個評估程序。如果要添加動畫效果的對象屬性值不是int類型、float類型或顏色類型,那么必須實現(xiàn)TypeEvaluator接口,才能指定如何計算對象的屬性添加動畫效果之后的值。 |
3.插值器
? 插值器Interpolator(類/接口)指定了如何根據(jù)時間計算動畫中的特定值。android.view.animation包中包含的插值器如下表所示。
| AccelerateDecelerateInterpolator | 該插值器的變化率在開始和結(jié)束時緩慢但在中間會加快 |
| AccelerateInterpolator | 該插值器的變化率在開始時較為緩慢,然后會加快 |
| AnticipateInterpolator | 該插值器先反向變化,然后再急速正向變化 |
| AnticipateOvershootInterpolator | 該插值器先反向變化,再急速正向變化,然后超過定位值,最后返回到最終值 |
| … | … |
動畫監(jiān)聽器
? 動畫監(jiān)聽器(一個接口)主要用于監(jiān)聽動畫播放期間的重要事件,動畫監(jiān)聽器有Animator.AnimatorListener和ValueAnimator.AnimatorUpdateListener。
(1)Animator.AnimatorListener
? 動畫監(jiān)聽器Animator.AnimatorListener(接口)中有4個方法,如下所示:
-
onAnimationStart():動畫開始播放時調(diào)用該方法。
-
onAnimationEnd():動畫結(jié)束播放時調(diào)用該方法。
-
onAnimationRepeat():動畫重復播放時調(diào)用該方法。
-
onAnimationCancel():動畫取消播放時調(diào)用該方法,取消動畫時也會調(diào)用onAnimationEnd()方法。
(2)ValueAnimator.AnimatorUpdateListener
? 動畫監(jiān)聽器ValueAnimator.AnimatorUpdateListener中只有1個方法onAnimationUpdate(),該方法在動畫播放的每一幀都會被調(diào)用。如果使用ValueAnimator.AnimatorUpdateListener監(jiān)聽某個動畫播放的每一幀事件,那么可以調(diào)用ValueAnimator類的getAnimatedValue()方法獲取動畫添加完效果之后生成的值。
? 如果某個類中使用了ValueAnimator類,那么該類必須實現(xiàn)ValueAnimator.AnimatorUpdateListener監(jiān)聽器。
3.4 實戰(zhàn)演練—飛舞的蝴蝶和鳥
? 本節(jié)我們通過一個綜合案例飛舞的蝴蝶和鳥來演示如何使用逐幀動畫與屬性動畫,本案例的界面效果如下圖所示。
放置界面控件 res\layout\activity_main.xml
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"android:background="@drawable/bg"><ImageViewandroid:id="@+id/iv_bird"android:layout_width="120dp"android:layout_height="120dp"android:layout_marginTop="20dp"android:background="@drawable/bird_animation" /><ImageViewandroid:layout_marginBottom="100dp"android:layout_alignParentBottom="true"android:id="@+id/iv_butterfly"android:layout_width="120dp"android:layout_height="120dp"android:layout_marginTop="20dp"android:background="@drawable/butterfly_animation" /> </RelativeLayout>實現(xiàn)界面效果 butterfliesandbirds\MainActivity.java
package cn.itcast.butterfliesandbirds; import android.animation.AnimatorSet; import android.animation.ObjectAnimator; import android.graphics.drawable.AnimationDrawable; import android.os.Bundle; import android.support.v7.app.AppCompatActivity; import android.util.DisplayMetrics; import android.view.animation.Animation; import android.view.animation.LinearInterpolator; import android.widget.ImageView; public class MainActivity extends AppCompatActivity {private int screenWidth;private ImageView iv_butterfly,iv_bird;private AnimationDrawable animation;private AnimatorSet flyAnimatorSet;private ObjectAnimator objectAnimator;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);init();}private void init(){getWindowWidth();iv_butterfly=findViewById(R.id.iv_butterfly);iv_bird=findViewById(R.id.iv_bird);flyAnimation(1); //實現(xiàn)蝴蝶飛舞的效果flyAnimation(2); //實現(xiàn)小鳥飛舞的效果}/*** 獲取屏幕寬度*/private void getWindowWidth(){DisplayMetrics dm=new DisplayMetrics();getWindowManager().getDefaultDisplay().getMetrics(dm);screenWidth= dm.widthPixels;}/*** 實現(xiàn)飛舞的效果*/private void flyAnimation(int flag){flyAnimatorSet=new AnimatorSet();if (flag==1) {//獲取逐幀動畫animation= (AnimationDrawable) iv_butterfly.getBackground();//設(shè)置蝴蝶在水平方向移動的距離為屏幕的寬度-270 // translationX 水平方向移動objectAnimator = ObjectAnimator.ofFloat(iv_butterfly,"translationX", screenWidth - 270);objectAnimator.setDuration(3*1000);//設(shè)置動畫時間為3秒}else if (flag==2){//獲取逐幀動畫animation= (AnimationDrawable) iv_bird.getBackground();//設(shè)置小鳥在水平方向移動的距離為屏幕的寬度objectAnimator = ObjectAnimator.ofFloat(iv_bird,"translationX", screenWidth);objectAnimator.setRepeatCount(Animation.RESTART); //重新開始播放動畫objectAnimator.setRepeatCount(Animation.INFINITE);//循環(huán)播放動畫objectAnimator.setDuration(10*1000);//設(shè)置動畫時間為10秒}objectAnimator.setInterpolator(new LinearInterpolator());//設(shè)置線性插值器flyAnimatorSet.play(objectAnimator);animation.start(); //開啟逐幀動畫flyAnimatorSet.start();//開啟屬性動畫} }總結(jié)
以上是生活随笔為你收集整理的CH10-图形图像处理的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 鼠标在linux下如何工作,如何在Lin
- 下一篇: Anaconda的Spyder闪退的我的