Android UI模拟器启动界面动画效果的简单实现

Android UI模拟器启动界面动画效果的简单实现

关键点：

1.自定义控件。

2.Shader渲染的使用。 

上图，见代码。

main.xml

[xhtml]

1. <?xml version="1.0" encoding="utf-8"?>  
2. <LinearLayout xmlns:Android="http://schemas.android.com/apk/res/android"  
3.     android:orientation="vertical" android:layout_width="fill_parent"  
4.     android:layout_height="fill_parent" android:layout_gravity="center_vertical">  
5.     <com.example.android.MaskedTextView  
6.         android:id="@+id/text"  
7.         android:layout_width="fill_parent"  
8.         android:layout_height="fill_parent"  
9.         android:gravity="center_vertical"  
10.     />  
11. </LinearLayout>  

Activity.class

[java]

1. package com.example.android;  
2. import android.app.Activity;  
3. import android.os.Bundle;  
4. public class MaskedTextViewActivity extends Activity {  
5.     public void onCreate(Bundle savedInstanceState) {  
6.         super.onCreate(savedInstanceState);  
7.         setContentView(R.layout.main);  
8.         ((MaskedTextView) findViewById(R.id.text)).setStart(true);  
9.     }  
10. }  

自定义View

[java]

1. package com.example.android;  
2. import android.content.Context;  
3. import android.graphics.Canvas;  
4. import android.graphics.Color;  
5. import android.graphics.LinearGradient;  
6. import android.graphics.Matrix;  
7. import android.graphics.Paint;  
8. import android.graphics.Shader;  
9. import android.util.AttributeSet;  
10. import android.view.View;  
11. /** 此代码源于David_Zhang，由Sodino注释，欢迎挑错。 */  
12. public class MaskedTextView extends View {  
13.     private Paint txtPaint;  
14.     /** 阴影渲染在X轴上的位移。 */  
15.     private float moveX = 0;  
16.     private boolean start = false;  
17.     /** 每次渲染的位移像素值。 */  
18.     private static final int MOVE_SPEEND = 1;  
19.     private void init() {  
20.         txtPaint = new Paint();  
21.         txtPaint.setColor(Color.GRAY);  
22.         txtPaint.setAntiAlias(true);  
23.         txtPaint.setTextSize(26);  
24.         // 创建一个线性梯度着色器   
25.         // 参数中colors的数组长度与positions的数组长度相对应<br/>   
26.         // 本例中初始化后相应的纯色位置如下(与平铺模式有关)：<br/>   
27.         // Black: 200 * 0<br/>   
28.         // YELLOW: 200 * 0.3<br/>   
29.         // DKGRAY: 200 * 0.6<br/>   
30.         // WHITE: 200 * 1<br/>   
31.         // 最后一个参数为：着色器的颜色平铺模式。共有三种选择：<br/>   
32.         // 1.MIRROR: 颜色平铺从0→colors[i]→0，边缘过渡。   
33.         // 2.REPEAT: 颜色平铺从0→colors[i]，边缘无过渡。   
34.         // 3.CLAMP:与边框着色有关。   
35.         Shader shader = new LinearGradient(0, 0, 200, 0, new int[] {  
36.                 Color.BLACK, Color.YELLOW, Color.DKGRAY, Color.WHITE },  
37.                 new float[] { 0, 0.3f, 0.6f, 1 }, Shader.TileMode.MIRROR);  
38.         txtPaint.setShader(shader);  
39.     }  
40.     /** 由xml实例化的UI组件在VM中是调用本构造函数生成新实例的。 */  
41.     public MaskedTextView(Context context, AttributeSet attrs) {  
42.         super(context, attrs);  
43.         init();  
44.     }  
45.     public void setStart(boolean start) {  
46.         this.start = start;  
47.         // 由UI主线程调用，开始渲染本UI组件。   
48.         invalidate();  
49.     }  
50.     protected void onDraw(Canvas canvas) {  
51.         moveX += MOVE_SPEEND;  
52.         Matrix matrix = new Matrix();  
53.         if (start) {  
54.             // 阴影渲染沿x轴向右移动dx像素,沿y轴向下移动0像素。   
55.             // 渲染的位移形成动画。   
56.             matrix.setTranslate(moveX, 0);  
57.             invalidate();  
58.         } else {  
59.             matrix.setTranslate(0, 0);  
60.         }  
61.         txtPaint.getShader().setLocalMatrix(matrix);  
62.         canvas.drawText(getContext().getString(R.string.msg), 0, 25, txtPaint);  
63.     }  
64. }