本案例需要自定義一個View 來繪制水平儀的用戶界面,首先需要在項目文件夾的src/wyf/ytl 目錄下創(chuàng)建一個名為Main-View 的java 類, 并使其繼承自View 類, 其代碼框架如下:
package wyf.ytl; //聲明所在包
import android.content.Context;//引入Context 類
import android.graphics.Bitmap; //引入Bitmap 類
import android.graphics.BitmapFactory; //引入相關類
import android.graphics.Canvas; //引入Canvas 類
import android.graphics.Color; //引入Color 類
import android.graphics.Paint; //引入Paint 類
import android.graphics.RectF; //引入RectF 類
import android.graphics.Paint.Style; //引入Style 類
import android.util.AttributeSet; //引入AttributeSet 類
import android.view.View; //引入View 類
public class MainView extends View{
Paint paint = new Paint(); //畫筆
//圖片資源的聲明
Bitmap shangBitmap1; //上面的大矩形圖
Bitmap shangBitmap2; //上面的氣泡
Bitmap zuoBitmap1; //左面的大矩形圖
Bitmap zuoBitmap2; //左面圖的氣泡
Bitmap zhongBitmap1; //中間的大圓圖
Bitmap zhongBitmap2; //中間的小氣泡
Bitmap xiaBitmap1; //右下的矩形圖
Bitmap xiaBitmap2; //右下的氣泡
//背景矩形的位置聲明
int shang1_X = 60; //上面的大矩形圖
int shang1_Y = 12;
int zuo1_X = 12; //左面的大矩形圖
int zuo1_Y = 60;
int zhong1_X = 65; //中間的大圓圖
int zhong1_Y = 65;
int xia1_X = 145; //右下的矩形圖
int xia1_Y = 145;//水泡的位置聲明
int shang2_X; //上面的氣泡XY 坐標
int shang2_Y;
int zuo2_X; //左面圖的氣泡XY 坐標
int zuo2_Y;
int zhong2_X; //中間的小氣泡XY 坐標
int zhong2_Y;
int xia2_X; //右下的氣泡XY 坐標
int xia2_Y;
public MainView(Context context, AttributeSet attrs){
super(context, attrs);
initBitmap(); //初始化圖片資源
initLocation(); //初始化氣泡的位置
}
private void initBitmap(){ //初始化圖片的方法
…//該處省略了部分代碼,將在后面進行介紹
}
private void initLocation(){ //初始化氣泡位置的方法
…//該處省略了部分代碼,將在后面進行介紹
}
@Override
protected void onDraw(Canvas canvas){//重寫的繪制方法
super.onDraw(canvas);
…//該處省略了部分代碼,將在后面進行介紹
}
}
上述代碼中的initBitmap 以及initLocation 方法是對界面進行初始化方法, 而onDraw 方法會根據(jù)需要繪制整個界面。
MainView 類構(gòu)造器中調(diào)用了兩個單獨的方法對整個界面進行了初始化, 這是一種非常好的編程習慣。因為把不同功能的代碼各自編寫成獨立的方法可以使主邏輯清晰, 且各個方法中的代碼都不是很長, 會大大提高代碼的可讀性以及可維護性。
完成了代碼框架的開發(fā)后就可以對其中各個方法進行開發(fā)了, 首先開發(fā)的是圖片資源的初始化方法, 其代碼如下:
private void initBitmap(){ //初始化圖片資源的方法
shangBitmap1 = BitmapFactory.decodeResource(getResources(), R.drawable.shang1);
shangBitmap2 = BitmapFactory.decodeResource(getResources(), R.drawable.shang2);
zuoBitmap1 = BitmapFactory.decodeResource(getResources(), R.drawable.zuo1);
zuoBitmap2 = BitmapFactory.decodeResource(getResources(), R.drawable.zuo2);
zhongBitmap1 = BitmapFactory.decodeResource(getResources(), R.drawable.zhong1);
zhongBitmap2 = BitmapFactory.decodeResource(getResources(), R.drawable.zhong2);
xiaBitmap1 = BitmapFactory.decodeResource(getResources(), R.drawable.xia1);
xiaBitmap2 = BitmapFactory.decodeResource(getResources(), R.drawable.xia2);
}
上述代碼為initBitmap 方法的全部代碼, 其作用是對程序中所有的圖片資源進行初始化, 在開發(fā)該方法之前, 應該確保所有的圖片資源已經(jīng)存放到了指定的目錄下。
完成了圖片資源初始化方法的開發(fā)后, 便可對氣泡位置初始化方法initLocation 進行開發(fā)了, 其代碼如下:
private void initLocation(){ //初始化氣泡位置的方法
shang2_X = shang1_X + shangBitmap1.getWidth()/2- shangBitmap2.getWidth()/2;
shang2_Y = shang1_Y + shangBitmap1.getHeight()/2- shangBitmap2.getHeight()/2;
zuo2_X = zuo1_X + zuoBitmap1.getWidth()/2- zuoBitmap2.getWidth()/2;
zuo2_Y = zuo1_Y + zuoBitmap1.getHeight()/2- zuoBitmap2.getHeight()/2;
zhong2_X = zhong1_X + zhongBitmap1.getWidth()/2- zhongBitmap2.getWidth()/2;
zhong2_Y = zhong1_Y + zhongBitmap1.getHeight()/2- zhongBitmap2.getHeight()/2;
xia2_X = xia1_X + xiaBitmap1.getWidth()/2- xiaBitmap2.getWidth()/2;
xia2_Y = xia1_Y + xiaBitmap1.getHeight()/2- xiaBitmap2.getHeight()/2;
}
在該方法中通過相應圖片的寬度和高度動態(tài)計算氣泡的初始坐標, 采用此方法動態(tài)計算氣泡坐標的好處是當日后更改圖片資源后, 不需要重寫修改源代碼即可正常運行, 大大提高了程序的可維護性。
在完成了各個初始化方法的開發(fā)后就可以對繪制方法onDraw 進行開發(fā), 該方法主要負責界面的繪制工作, 其代碼如下:
@Override
protected void onDraw(Canvas canvas){//界面繪制方法super.onDraw(canvas);
canvas.drawColor(Color.WHITE); //設置背景色為白色
paint.setColor(Color.BLUE); //設置畫筆顏色
paint.setStyle(Style.STROKE); //設置畫筆為不填充
canvas.drawRect(5, 5, 315, 315, paint);//繪制外邊框矩形
//畫背景矩形
canvas.drawBitmap(shangBitmap1, shang1_X,shang1_Y, paint); //上
canvas.drawBitmap(zuoBitmap1, zuo1_X,zuo1_Y, paint); //左
canvas.drawBitmap(zhongBitmap1, zhong1_X,zhong1_Y, paint); //中
canvas.drawBitmap(xiaBitmap1, xia1_X,xia1_Y, paint); //下
//開始繪制氣泡
canvas.drawBitmap(shangBitmap2, shang2_X,shang2_Y, paint); //上
canvas.drawBitmap(zuoBitmap2, zuo2_X,zuo2_Y, paint); //左
canvas.drawBitmap(zhongBitmap2, zhong2_X,zhong2_Y, paint); //中
canvas.drawBitmap(xiaBitmap2, xia2_X, xia2_Y, paint);//下
paint.setColor(Color.GRAY);//設置畫筆顏色用來繪制刻度
評論
查看更多