自訂View繪製映像與移動字型

標籤：自訂   view   跑馬燈   開發   

自訂View在開發中是經常遇到的，例如一個跑馬燈的效果、或者自訂一個轉盤來顯示下載進度的百分百比。今天把實現方式寫下來，下面是源碼部分：

MainActivity：沒變動

import android.app.Activity;import android.os.Bundle;public class MainActivity extends Activity {    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);    }}

主布局：只增加了一個自訂View

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent" >    <com.example.myview.MineView        android:layout_width="wrap_content"        android:layout_height="wrap_content" >    </com.example.myview.MineView></RelativeLayout>

自訂View：

import java.util.Random;import android.content.Context;import android.graphics.Canvas;import android.graphics.Paint;import android.graphics.RectF;import android.os.SystemClock;import android.util.AttributeSet;import android.view.View;public class MineView extends View {    /**     * 字型移動的X座標     */    private int rx = 0;    /**     * 畫筆工具     */    private Paint paint;    /**     * 建立線程對象，用於迴圈順延強制命令     */    private MyThread t;    /**     * 0表示圓的left，60表示圓的top，100表示圓的right，160表示圓的bottom     */    private RectF rectF = new RectF(0, 60, 100, 160);    /**     * 表示區間角度     */    private float sweepAngle;    /**     * 建立隨機數對象     */    private Random random;    /**     * isdestroy表示該Activity是否已經結束     */    private boolean isdestroy = false;    public MineView(Context context, AttributeSet attrs) {        super(context, attrs);        System.out.println("構造器");        paint = new Paint();        random = new Random();        //消除鋸齒，否則映像會很難看        paint.setAntiAlias(true);        if (t == null) {            t = new MyThread();            t.start();        }    }    public MineView(Context context) {        super(context);        System.out.println("構造器");        paint = new Paint();        paint.setAntiAlias(true);        if (t == null) {            t = new MyThread();            t.start();        }    }    @Override    protected void onDraw(Canvas canvas) {        super.onDraw(canvas);        paint.setTextSize(30);        // rx表示移動字型的x座標        canvas.drawText("移動字型", rx, 30, paint);        // rectF表示圓的對象，0表示起始角度，sweepAngle表示區間角度，true和false表示繪製過程的方式，paint表示畫筆對象        canvas.drawArc(rectF, 0, sweepAngle, true, paint);    }    class MyThread extends Thread {        @Override        public void run() {            super.run();            while (true) {                rx += 5;                // 如果字型移動出螢幕以外，就讓字型從頭開始                if (rx > getWidth()) {                    rx = (int) (0 - paint.measureText("移動字型"));                }                sweepAngle += 5;                // 如果角度大於360就讓圓從0度開始重新繪製                if (sweepAngle > 360) {                    sweepAngle = 0;                }                // 讓顏色從0-255隨機播放                int r = random.nextInt(256);                int g = random.nextInt(256);                int b = random.nextInt(256);                // 分別表示：透明度（0~255）、紅、綠、藍                paint.setARGB(255, r, g, b);                /**                 * 判斷Activity是否已經退出，如果退出則isdestroy為true，那麼立刻讓線程對象與畫筆對象為空白，並且break，                 * 否則會造成記憶體溢出，此辦法必須在此處使用，否則會造成null 指標的BUG。                 */                if (isdestroy) {                    if (t != null) {                        t = null;                    }                    if (paint != null) {                        paint = null;                    }                    break;                }                // 睡眠                SystemClock.sleep(50);                // 可以讓ondraw方法重新執行                postInvalidate();                // invalidate();分線程無效，要在主線程使用            }        }    }    /**     * 當視窗銷毀的時候會調用此方法，用於關閉資源     */    @Override    protected void onDetachedFromWindow() {        super.onDetachedFromWindow();        isdestroy = true;        System.out.println("onDetachedFromWindow");    }}

運行效果：運行起來是動態，我不會上傳動態效果，想看效果的自己跑起來就可以了。

650) this.width=650;" src="http://s1.51cto.com/wyfs02/M02/78/02/wKiom1Zzoh_ShUmcAABtzj_3aUE173.jpg" title="QQ20151218140504.jpg" alt="wKiom1Zzoh_ShUmcAABtzj_3aUE173.jpg" />

注意：這裡的跑馬燈效果只是一種非常笨的方式，有更簡單的辦法，我以後會介紹！

本文出自 “移動平台開發” 部落格，請務必保留此出處http://liuxudong1001.blog.51cto.com/10877072/1726020

自訂View繪製映像與移動字型