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

最新推荐文章于 2025-10-30 17:42:10 发布

原创最新推荐文章于 2025-10-30 17:42:10 发布 · 4.3k 阅读

2 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#android #ui #colors #layout #matrix

本文介绍如何在Android中实现一个简单的模拟器启动界面动画效果，通过自定义View和Shader渲染来创建文字阴影滑动动画。关键步骤包括自定义MaskedTextView控件，设置线性渐变着色器，并在onDraw方法中更新渲染位置。

关键点：

1.自定义控件。

2.Shader渲染的使用。

上图，见代码。

screen animation

main.xml

<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_gravity="center_vertical"> <com.example.android.MaskedTextView android:id="@+id/text" android:layout_width="fill_parent" android:layout_height="fill_parent" android:gravity="center_vertical" /> </LinearLayout>

Activity.class

package com.example.android; import android.app.Activity; import android.os.Bundle; public class MaskedTextViewActivity extends Activity { public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); ((MaskedTextView) findViewById(R.id.text)).setStart(true); } }

自定义View

package com.example.android; import android.content.Context; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.LinearGradient; import android.graphics.Matrix; import android.graphics.Paint; import android.graphics.Shader; import android.util.AttributeSet; import android.view.View; /** 此代码源于David_Zhang，由Sodino注释，欢迎挑错。 */ public class MaskedTextView extends View { private Paint txtPaint; /** 阴影渲染在X轴上的位移。 */ private float moveX = 0; private boolean start = false; /** 每次渲染的位移像素值。 */ private static final int MOVE_SPEEND = 1; private void init() { txtPaint = new Paint(); txtPaint.setColor(Color.GRAY); txtPaint.setAntiAlias(true); txtPaint.setTextSize(26); // 创建一个线性梯度着色器 // 参数中colors的数组长度与positions的数组长度相对应 // 本例中初始化后相应的纯色位置如下(与平铺模式有关)： // Black: 200 * 0 // YELLOW: 200 * 0.3 // DKGRAY: 200 * 0.6 // WHITE: 200 * 1 // 最后一个参数为：着色器的颜色平铺模式。共有三种选择： // 1.MIRROR: 颜色平铺从0→colors[i]→0，边缘过渡。 // 2.REPEAT: 颜色平铺从0→colors[i]，边缘无过渡。 // 3.CLAMP:与边框着色有关。 Shader shader = new LinearGradient(0, 0, 200, 0, new int[] { Color.BLACK, Color.YELLOW, Color.DKGRAY, Color.WHITE }, new float[] { 0, 0.3f, 0.6f, 1 }, Shader.TileMode.MIRROR); txtPaint.setShader(shader); } /** 由xml实例化的UI组件在VM中是调用本构造函数生成新实例的。 */ public MaskedTextView(Context context, AttributeSet attrs) { super(context, attrs); init(); } public void setStart(boolean start) { this.start = start; // 由UI主线程调用，开始渲染本UI组件。 invalidate(); } protected void onDraw(Canvas canvas) { moveX += MOVE_SPEEND; Matrix matrix = new Matrix(); if (start) { // 阴影渲染沿x轴向右移动dx像素,沿y轴向下移动0像素。 // 渲染的位移形成动画。 matrix.setTranslate(moveX, 0); invalidate(); } else { matrix.setTranslate(0, 0); } txtPaint.getShader().setLocalMatrix(matrix); canvas.drawText(getContext().getString(R.string.msg), 0, 25, txtPaint); } }

本文内容归CSDN博客博主Sodino 所有

转载请注明出处:http://blog.csdn.net/sodino/archive/2011/02/18/6193645.aspx