Custom Drawing(自定义Draw)

原文链接

简介

自定义View最重要的一部分就是指定义Draw。根据App需要自定义Draw可简单可复杂。这篇教程涵盖了大部分常用的插座


Override onDraw()

onDraw()是绘制自定义View中最重要的方法。onDraw()的方法的参数是Canvas,Canvas定义了一些 绘制文字、线、 位图等方法。你可以使用这些方法创建自己的UI。

Create Drawing Objects

Android图形系统将绘图分为两部分:

  • 绘制什么:由 Canvas 处理。(What to draw)
  • 怎么绘制:由 Paint 处理。(How to draw)

比如:Canvas提供了方法绘制直线的方法,而Paint提供的方法可以设置直线的颜色。Canvas提供了方法绘制矩形的方法,而Paint提供的方法可以设置是填充矩形的颜色或则不填充。简而言之:Canvas定义绘制到屏幕上图形的形状,Paint定义了你绘制的每个形状的颜色、方式、字体等。

在开始绘制之前,你需要创建一个或多个Paint。下面的例子中在init()方法中创建,并在构造方法中调用:

private void init() { 
    mTextPaint = new Paint(Paint.ANTI_ALIAS_FLAG);  
    mTextPaint.setColor(mTextColor);
    if (mTextHeight == 0) {       
          mTextHeight = mTextPaint.getTextSize();  
     } else {      
         mTextPaint.setTextSize(mTextHeight);  
     }   
    mPiePaint = new Paint(Paint.ANTI_ALIAS_FLAG);  
    mPiePaint.setStyle(Paint.Style.FILL); 
    mPiePaint.setTextSize(mTextHeight); 
    mShadowPaint = new Paint(0);  
    mShadowPaint.setColor(0xff101010); 
    mShadowPaint.setMaskFilter(new BlurMaskFilter(8,BlurMaskFilter.Blur.NORMAL));   
...

提前创建对象是一个很重要的优化方式。Views会经常重绘,而且一些绘图的对象在初始化时会占用很多的资源。在onDraw()方法中创建对象会明显降低应用的性能,而且会造成UI卡顿。

Handle Layout Events

为了能够正确的绘制自定义View,你需要知道它的大小。复杂的自定义View经常会根据它们的大小、形状及在屏幕上的位置进行多次布局计算。

虽然View提供了许多处理视图大小的方法,但是大部分都不需要重写。如果自定义View不需要控制它的大小,你只需要重写onSizeChanged()

onSizeChanged()会在自定义View第一次被设置了大小时调用,当自定义View的大小发生改变时会再次调用。在onSizeChanged()中计算View的大小、尺寸以及和自定义View大小相关的其它值,而不是在每次绘制是都去计算。

需要注意的是View的大小包括了padding值,在计算时不要忘记了处理padding值。

 // Account for padding       
float xpad = (float)(getPaddingLeft() + getPaddingRight());       
float ypad = (float)(getPaddingTop() + getPaddingBottom());       
// Account for the label       
if (mShowText) 
    xpad += mTextWidth;       
float ww = (float)w - xpad;       
float hh = (float)h - ypad;       
// Figure out how big we can make the pie.       
float diameter = Math.min(ww, hh);

如果你需要改变自定义View的大小可以重写onMesure()

@Overrideprotected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {   
    // Try for a width based on our minimum   
    int minw = getPaddingLeft() + getPaddingRight() + getSuggestedMinimumWidth();   
    int w = resolveSizeAndState(minw, widthMeasureSpec, 1);   
    // Whatever the width ends up being, ask for a height that would let the pie   
   // get as big as it can   
    int minh = MeasureSpec.getSize(w) - (int)mTextWidth + getPaddingBottom() + getPaddingTop();   
    int h = resolveSizeAndState(MeasureSpec.getSize(w) - (int)mTextWidth, heightMeasureSpec, 0);   
    setMeasuredDimension(w, h);
}

上面的代码有3个重点:

  • 计算Padding
  • 使用resolveSizeAndState()得到最终的宽高值。resolveSizeAndState()经过将自定义View期望的大小与onMeasure()MeasureSpec参数里的值比较后,返回一个MeasureSpec值。
  • onMeasure()没有返回值,而是通过setMeasuredDimension()方法将处理结果应用到View。必须要调用setMeasuredDimension(),否则会有运行时错误。

Draw!

protected void onDraw(Canvas canvas) {   
    super.onDraw(canvas);   
// Draw the shadow   
    canvas.drawOval(mShadowBounds,mShadowPaint);   
// Draw the label text         
    canvas.drawText(mData.get(mCurrentItem).mLabel, mTextX, mTextY, mTextPaint);   
 // Draw the pie slices   
    for (int i = 0; i < mData.size(); ++i) {       
        Item it = mData.get(i);       
        mPiePaint.setShader(it.mShader);       
        canvas.drawArc(mBounds, 360 - it.mEndAngle,  it.mEndAngle - it.mStartAngle,true, mPiePaint);  
    }   
// Draw the pointer   
    canvas.drawLine(mTextX, mPointerY, mPointerX, mPointerY, mTextPaint);   
    canvas.drawCircle(mPointerX, mPointerY, mPointerSize, mTextPaint);
}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容