2D绘图的学习Paint,Canvas(一)

前言

安卓2D绘图,都是主要涉及到2个类:Paint,Canvas.

一,Paint

Paint画笔,用于指定图形或者文字的颜色,大小等。 常用方法: setAntiAlias: 设置画笔的锯齿效果。 setColor: 设置画笔颜色 setAlpha: 设置Alpha值 setTextSize: 设置字体尺寸。 setStyle: 设置画笔风格,空心或者实心。 setStrokeWidth: 设置空心的边框宽度。

1,HelloWorld

先从经典的helloworld开始,我们画出一个蓝色,字体大小为20sp的HelloWorld。 效果:

代码:

/*** 字体颜色*/private int mTextColor = 0xff0000ff;/*** 画笔*/private Paint mPaint;/*** 绘制的文本*/private String text = “HelloWorld”;public CanvasView(Context context, AttributeSet attrs, int defStyle) {super(context, attrs, defStyle);//初始化画笔,设置字体大小,颜色mPaint = new Paint();mPaint.setTextSize(sp2px(20));mPaint.setColor(mTextColor);setBackgroundColor(Color.parseColor(“#fff1f1f1”));}public CanvasView(Context context, AttributeSet attrs) {this(context, attrs,0);}public CanvasView(Context context) {this(context,null);}(int widthMeasureSpec, int heightMeasureSpec) {//设置该View的大小为文字的大小int width = (int) mPaint.measureText(text);int height = (int) Math.abs(mPaint.descent()-mPaint.ascent());widthMeasureSpec = MeasureSpec.makeMeasureSpec(width, MeasureSpec.EXACTLY);heightMeasureSpec = MeasureSpec.makeMeasureSpec(height, MeasureSpec.EXACTLY);super.onMeasure(widthMeasureSpec, heightMeasureSpec);}(Canvas canvas) {//在canvas上画出文字,参数分别为:文本字符串,文字X和Y的偏移,画笔canvas.drawText(text, 0, getHeight()-mPaint.descent(), mPaint);}(int value){return (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_SP, value, getResources().getDisplayMetrics());}

在构造函数中初始化画笔,然后在onDraw()方法中调用canvas的drwaText()方法即可。为了精确,我把View的高度和宽度设为了文字的宽度和高度。这里还涉及到字体偏移的问题,后面再一起讨论。

二,Canvas

Canvas画布,就像黑板一样,可以理解为画画的背景。 常用方法: drawColor();设置画布背景色 drawLine();线 drawRect()矩形 drawRoundRect();圆角矩形 drawArc();圆弧,三点钟方向为0° drawCircle();

1,线

先从最简单的几何图形,开始学习canvas的使用方法。 效果:

代码:

mPaint.setStrokeWidth(dp2px(2));canvas.drawLine(0, 10, getWidth(), 10, mPaint);

设置画笔宽度,画出线条。drawLine()方法中,前两个参数为第一个点坐标(x1,y1),第3,4个参数为第二个点的坐标(x2,y2),最后一个为画笔。

2,矩形

效果:

代码:

mPaint.setStrokeWidth(dp2px(2));//设置风格为空心轨迹mPaint.setStyle(Style.STROKE);RectF rectF = new RectF(getWidth()/2, 10, getWidth()-10, getHeight()-10);canvas.drawRoundRect(rectF, 10, 10, mPaint);

设置Paint的Style为空心轨迹,根据2个点的坐标画出矩形,圆角矩形是通过在一个矩形中绘制的。drawRect()方法的参数和线条完全相同,都是根据2个坐标点来绘制的。drawRoundRect()方法参数为矩形,x方向上的圆角,y方向上的圆角,画笔

3,圆

效果:

代码:

canvas.drawCircle(getWidth()/2, getHeight()/2, getWidth()/2-30, mPaint);

同样设置好画笔后,绘制圆形。参数分别为:圆心的坐标(x1,y1),圆的半径,画笔。

4,圆弧

效果:

代码:

//设置画笔抗锯齿(圆滑)mPaint.setAntiAlias(true);RectF rectF = new RectF(0, 0, getWidth()/2, getHeight());canvas.drawArc(rectF, 0, 90, true, mPaint);RectF rectF2 = new RectF(getWidth()/2, 0, getWidth(), getHeight());canvas.drawArc(rectF2, 0, 90, false, mPaint);

圆弧是在一个矩形中画出,所以我们先初始化一个矩形,然后再在这个矩形中,绘制圆弧。drawArc()方法参数分别为:矩形,,圆弧中心的坐标(x1,y1),是否连接圆点,画笔。

5,图片当你感到悲哀痛苦时,最好是去学些什么东西。

2D绘图的学习Paint,Canvas(一)

相关文章:

你感兴趣的文章:

标签云: