背景
前面的文章我們介紹了一些關(guān)于自定義View的基本知識(shí)和自定義View的類型廊驼,今天真正的來實(shí)現(xiàn)一個(gè)自定義View。
自定義圓形
從簡(jiǎn)單的開始,我們先實(shí)現(xiàn)一個(gè)自定義的圓形View妒挎,屬于繼承View重寫 onDraw方法的類型
public class CircleView extends View{ private int mColor = Color.GREEN; private Paint mPaint = new Paint(Paint.ANTI_ALIAS_FLAG); public CircleView(Context context) { super(context); init(); } public CircleView(Context context, AttributeSet attrs) { super(context, attrs); init(); } public CircleView(Context context, AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); init(); } /** * 初始化畫筆的顏色 */ private void init(){ mPaint.setColor(mColor); } @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); int width = getWidth(); int height = getHeight(); int radius = Math.min(width,height) / 2; canvas.drawCircle(width / 2,height / 2,radius,mPaint); } }
以上代碼就簡(jiǎn)單的實(shí)現(xiàn)了一個(gè)具有圓形效果的自定義View绳锅,它會(huì)在自己的中興點(diǎn)按照寬高的最小值為直徑繪制一個(gè)實(shí)心的園,很簡(jiǎn)單饥漫,大家應(yīng)該都會(huì)榨呆,但是在我們使用的時(shí)候我們會(huì)發(fā)現(xiàn)
<com.aotuman.circleview.view.CircleView android:padding="5dp" android:layout_margin="5dp" android:layout_width="wrap_content" android:layout_height="200dp" android:background="@android:color/black"/>
我們可以看到,在這樣的使用不庸队,padding和warp_content并不起作用积蜻,因?yàn)槲覀兦懊娴奈恼抡f到過,這種方式的自定義View要自己處理padding和warp_content彻消。
padding和warp_content的處理
其實(shí)對(duì)于這兩個(gè)屬性的處理也很簡(jiǎn)單竿拆,我們只要稍稍的修改一下onDraw方法就可以了,下面是見證奇跡的時(shí)刻:
@Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); //獲取padding的數(shù)值 final int paddingLeft = getPaddingLeft(); final int paddingRight = getPaddingRight(); final int paddingTop = getPaddingTop(); final int paddingBottom = getPaddingBottom(); int width = getWidth() - paddingLeft - paddingRight; int height = getHeight() - paddingTop - paddingBottom; int radius = Math.min(width,height) / 2; canvas.drawCircle(paddingLeft + width / 2,paddingRight + height / 2,radius,mPaint); }
@Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { super.onMeasure(widthMeasureSpec, heightMeasureSpec); int widthSpecMode = MeasureSpec.getMode(widthMeasureSpec); int widthSpecSize = MeasureSpec.getSize(widthMeasureSpec); int heightSpecMode = MeasureSpec.getMode(heightMeasureSpec); int heightSpecSize = MeasureSpec.getSize(heightMeasureSpec); int width = (int)this.getContext().getResources() .getDimension(R.dimen.cricleView_width); int height = (int)this.getContext().getResources() .getDimension(R.dimen.cricleView_height); if(widthSpecMode == MeasureSpec.AT_MOST && heightSpecMode == MeasureSpec.AT_MOST){ setMeasuredDimension(width,height); }else if(widthSpecMode == MeasureSpec.AT_MOST){ setMeasuredDimension(heightSpecSize,heightSpecSize); }else if(heightSpecMode == MeasureSpec.AT_MOST){ setMeasuredDimension(widthSpecSize,widthSpecSize); } }
怎么樣效果很明顯吧宾尚。
總結(jié)
今天的非潮瘢基礎(chǔ),就是講了一個(gè)超級(jí)簡(jiǎn)單的自定義繪制煌贴,只是適合初學(xué)者御板,希望大神們不要噴,哈哈牛郑。