作者:張玉庭的博客
今天在空余時(shí)間學(xué)了一會(huì)關(guān)于自定義View的實(shí)現(xiàn), 想著以后在MyViewDemo
做一系列的有意思的自定義View稚字。這一次的自定義view實(shí)踐主要了解一下自定義view的實(shí)現(xiàn)過(guò)程
-
Demo展示

image
-
關(guān)于View的實(shí)現(xiàn)過(guò)程
- view的測(cè)量獲取其寬高
- view的繪制
- view的刷新
-
view的測(cè)量獲取其寬高
首先自定義一個(gè)view--PieChartView并讓其繼承View,然后重寫(xiě)測(cè)量View大小的方法onMeasure()并獲取其寬高為繪制圖做準(zhǔn)備失驶。
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
mWidth = MeasureSpec.getSize(widthMeasureSpec);
mHeight = MeasureSpec.getSize(heightMeasureSpec);
}
-
view的繪制
view的繪制主要用到畫(huà)布Canvas写隶,以及畫(huà)筆Paint疙剑。我們這時(shí)重寫(xiě)View的方法onDraw()筹煮。首先將畫(huà)布的圓心移到View的中間(調(diào)用 canvas.translate(mWidth / 2, mHeight / 2)),然后獲取半徑的長(zhǎng)度脊奋,通過(guò)過(guò)相關(guān)的運(yùn)算畫(huà)出兩部分不一樣的餅狀圖
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
canvas.translate(mWidth / 2, mHeight / 2);//餅狀圖圓心移到中間
float r = (float) ((Math.min(mWidth, mHeight) / 2));//半徑
RectF rectF = new RectF(-r, -r, r, r);
//男士的扇形圖
mPaint.setStyle(Paint.Style.FILL);//填充
mPaint.setColor(Color.CYAN);
canvas.drawArc(rectF, -90, percent * 360, true, mPaint);
//女士的扇形圖
mPaint.setStyle(Paint.Style.FILL);
mPaint.setColor(Color.RED);
canvas.drawArc(rectF, percent * 360 - 90, (1 - percent) * 360, true, mPaint);
}
-
view的刷新
通過(guò)在布局文件調(diào)用兩個(gè)seekbar控件啰扛,并通過(guò)監(jiān)聽(tīng)OnSeekBarChangeListener()并調(diào)用View的刷新方法
setPercent(float percent),最終調(diào)用重新繪制畫(huà)布的方法invalidate()刷新View;
SeekBar.OnSeekBarChangeListener onSeekBarChangeListener = new SeekBar.OnSeekBarChangeListener() {
@Override
public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
if (seekBar.getId() == R.id.seekBar) {
seekBar1.setProgress(progress);
seekBar2.setProgress(100 - progress);
} else {
seekBar2.setProgress(progress);
seekBar1.setProgress(100 - progress);
}
pieChartView.setPercent((float) (1.0 * seekBar2.getProgress() / 100));
}
@Override
public void onStartTrackingTouch(SeekBar seekBar) {
}
@Override
public void onStopTrackingTouch(SeekBar seekBar) {
}
};