Android開發之自定義View

jopen 11年前發布 | 39K 次閱讀 Android Android開發移動開發

View類是Android的一個超類，這個類幾乎包含了所有的屏幕類型。每一個View都有一個用于繪圖的畫布，這個畫布可以進行任意擴展。在游戲開發中往往需要自定義視圖(View),這個畫布的功能更能滿足我們在游戲開發中的需要。在Android中，任何一個View類都只需重寫onDraw 方法來實現界面顯示，自定義的視圖可以是復雜的3D實現，也可以是非常簡單的文本形式等。

為了實現自定義View，需要創建一個新的類，然后重寫onDraw方法，在此需要注意，新創建的類MyView要繼承View基類，同時還要加入有參數的兩個構造方法MyView(Context context)和MyView(Contextcontext,AttributeSet attr)，否則編譯運行無法通過。

在onDraw方法中，初始化了一個畫筆對象myPaint，設置畫筆顏色，還有文字大小，填充等屬性。再利用本方法傳入的參數canvas畫布完成一幅條形統計圖的繪制。具體代碼如下：

package com.viewTest;
import android.content.Context; 
import android.graphics.Canvas; 
import android.graphics.Color; 
import android.graphics.Paint; 
import android.graphics.Rect;
import android.graphics.Paint.Style; 
import android.util.AttributeSet; 
import android.view.View; 
public class MyView extends View { 
    public MyView(Context context) {
        super(context);
        // TODO Auto-generated constructor stub
    }
    public MyView(Context context,AttributeSet attr) { 
        super(context,attr); 
    } 
    private Paint myPaint; 
    private static final String myString1 = "2006-2011上半年中國移動互聯網行業各年度投資情況"; 
    private static final String myString2 = "來源：清科研究中心 2011.08"; 
    @Override 
    protected void onDraw(Canvas canvas) { 
        // TODO Auto-generated method stub 
        super.onDraw(canvas);
        myPaint = new Paint();  
        //繪制標題
        myPaint.setColor(Color.BLACK); //設置畫筆顏色
        myPaint.setTextSize(18);//設置文字大小
        canvas.drawText(myString1, 20, 20, myPaint); 
        //繪制坐標軸
        canvas.drawLine(50, 100, 50, 500, myPaint);//縱坐標軸       
        canvas.drawLine(50, 500, 400, 500, myPaint);//橫坐標軸
        int[] array1 = new int[]{0, 50, 100, 150, 200, 250, 300, 350};
        //繪制縱坐標刻度
        myPaint.setTextSize(10);//設置文字大小
        canvas.drawText("單位：百萬美元", 20, 90, myPaint); 
        for (int i = 0; i < array1.length; i++) {
            canvas.drawLine(50, 500 - array1[i], 54, 500 - array1[i], myPaint);
            canvas.drawText(array1[i] + "", 20, 500 - array1[i], myPaint);
        }
        //繪制橫坐標文字
        String[] array2 = new String[]{"2008年", "2009年", "2010年", "2011上半年"};
        for (int i = 0; i < array2.length; i++) {
            canvas.drawText(array2[i], array1[i] + 80, 520, myPaint);
        }
        //繪制條形圖
        myPaint.setColor(Color.BLUE); //設置畫筆顏色 
        myPaint.setStyle(Style.FILL); //設置填充 
        canvas.drawRect(new Rect(90, 500 - 56, 110, 500), myPaint);//畫一個矩形,前兩個參數是矩形左上角坐標，后兩個參數是右下角坐標        
        canvas.drawRect(new Rect(140, 500 - 98, 160, 500), myPaint);//第二個矩形     
        canvas.drawRect(new Rect(190, 500 - 207, 210, 500), myPaint);//第三個矩形    
        canvas.drawRect(new Rect(240, 500 - 318, 260, 500), myPaint);//第四個矩形
        myPaint.setColor(Color.BLACK); //設置畫筆顏色
        canvas.drawText("56.32", 88, 500 - 58, myPaint);//第一個矩形的數字說明
        canvas.drawText("98.00", 138, 500 - 100, myPaint);
        canvas.drawText("207.65", 188, 500 - 209, myPaint);
        canvas.drawText("318.30", 238, 500 - 320, myPaint);
        //繪制出處
        myPaint.setColor(Color.BLACK); //設置畫筆顏色
        myPaint.setTextSize(16);//設置文字大小
        canvas.drawText(myString2, 20, 560, myPaint); 
    } 
}

然后將我們自定義的View 加入到main.xml 布局文件中, 在這里設置View的背景色為白色，是為了更好地展現其中的內容。代碼如下:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >
    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="@string/hello" />
    <Button
        android:layout_width="match_parent"
        android:layout_height="40dip"
        android:text="下一張圖" />
    <com.viewTest.MyView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="#FFFFFF"/>
</LinearLayout>

初始的activity.java文件并不需要修改。最后的效果如下圖所示：