Android 上的圖形繪製

Android - Paint

在 Android 上如何繪製幾合圖形。

2D繪圖

在Android中繪圖要使用到android.graphics之下的類別，Paint是畫筆，Canvas是畫布。當你繼承View類別後，覆寫OnDraw(Canvas canvas)方法會得到一個畫布，你就可以在畫布上畫一些圖形。

要使用自已的View，在程式碼中可以直接把它new出來，然後丟給setContentView。或是你也可以在xml檔中使用，使用方式必須加上Package名稱。

例如：使用Android提供的TextView

<TextView android:Text="xxx" ..../>

使用你自己的View則是

<com.tonycube.demo.PaintDemo android:id="@+id/paintView" ..../>

紅色部份是Package名稱，藍色部份是Class名稱。

程式碼

PaintView.java(自己的View)

package com.tonycube.demo.paint;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.RectF;
import android.graphics.Rect;
import android.util.AttributeSet;
import android.view.View;

public class PaintView extends View {

    public PaintView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        
        //畫筆
        Paint paint = new Paint();        
        
        //畫布底色
        canvas.drawColor(Color.WHITE);
        
        //畫筆色(灰)
        paint.setColor(Color.GRAY);
        //畫圓
        canvas.drawCircle(160, 160, 150, paint);
        
        //畫方
        paint.setColor(Color.BLUE);
        Rect rect = new Rect(100, 110, 120, 130);
        canvas.drawRect(rect, paint);
        
        //畫圓角方
        paint.setColor(Color.GREEN);
        RectF rectf = new RectF(200, 110, 220, 130);
        canvas.drawRoundRect(rectf, 7, 7, paint);
        
        //畫弧
        paint.setColor(Color.YELLOW);
        RectF oval = new RectF(50, 150, 270, 250);
        canvas.drawArc(oval, 180, -180, true, paint);
        
        //畫字
        paint.setColor(Color.BLACK);
        canvas.drawText("Andy", 160, 350, paint);
    }
}

main.xml(layout)

<?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" />

    <com.tonycube.demo.paint.PaintView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:id="@+id/paintView" />
</LinearLayout>

PaintDemoActivity.java(啟動畫面)

package com.tonycube.demo.paint;

import android.app.Activity;
import android.os.Bundle;

public class PaintDemoActivity extends Activity {
    
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        //setContentView(R.layout.main);
        
        PaintView pv = new PaintView(this, null);
        setContentView(pv);
    }
}

註解掉的部份是使用layout的xml，這裡則是在程式碼中直接建立。

本文網址：https://blog.tonycube.com/2012/01/android.html
由 Tony Blog 撰寫，請勿全文複製，轉載時請註明出處及連結，謝謝 😀