绘制基础知识-canvas paint

先来看一下Canvas

Canvas 用来提供draw方法的调用。绘制东西需要4个基本的组建：一个bitmap用来存放像素，一个canvas用来提供draw方法的调用(往bitmap里写入)，原始绘制元素（e.g.Rect, Path, text,Bitmap）, 一个paint。
看一下canvas的主要方法：

canvas.save()保存canvas的状态，保存之后，可以调用canvas的平移、缩放、旋转、错切、裁剪等操作。
canvas.restore();恢复canvas之前保存的状态。
canvas.translate(x,y);移动坐标原点到指定位置。
canvas.drawArc();绘制圆弧。
canvas.drawText();绘制文本。
canvas.drawLine();绘制线段。
canvas.drawRect();绘制矩形。

Paint类

Paint 类提供绘制几何图形，文本，和位图所需要的样式和颜色信息。
paint的主要方法：
paint.setAntiAlias()抗锯齿。
paint.setStrokeWidth() 设置画笔的宽度。
paint.setStyle()设置空心。
paint.setDither()设置防抖动。
### HappinessView.java

public class HappinessView extends View {private static final float CIRCLE_RADIUS = 100f;private static final float faceRadiusToEyeRadiusRadio = 10f;private static final float faceRadiusToEyeOffsetRadio = 3f;private static final float faceRadiusToEyeSeparationRadio = 1.5f;private static final float faceRadiusToMouthWidthRadio = 1;private static final float faceRadiusToMouthHeightRadio = 3;private static final float faceRadiusToMouthOffsetRatio = 3;private enum Eye{ Left, Right}public HappinessView(Context context) {super(context);}@Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);Paint paint = new Paint();paint.setStyle(Paint.Style.STROKE);paint.setAntiAlias(true);paint.setColor(Color.BLUE);canvas.drawCircle(100, 100, CIRCLE_RADIUS, paint);circlePathForEye(canvas, paint, Eye.Left);circlePathForEye(canvas, paint, Eye.Right);bezierPathForSmile(canvas, paint);}private void bezierPathForSmile(Canvas canvas, Paint paint) {float fractionOfMaxSmile = -1f;float mouthWidth = CIRCLE_RADIUS / faceRadiusToMouthWidthRadio;float mouthHeight = CIRCLE_RADIUS / faceRadiusToMouthHeightRadio;float mouthVerticalOffset = CIRCLE_RADIUS / faceRadiusToMouthOffsetRatio;float smileHeight = Math.max(Math.min(fractionOfMaxSmile, 1), -1) * mouthHeight;float startPointX = 100 - mouthWidth / 2;float startPointY = 100 + mouthVerticalOffset;float endPointX = startPointX + mouthWidth;float endPointY = startPointY;float point1X = startPointX + mouthWidth / 3;float point1Y = startPointY + smileHeight;float point2X = endPointX - mouthWidth / 3;float point2Y = point1Y;Path path = new Path();path.moveTo(startPointX, startPointY);path.cubicTo( point1X, point1Y, point2X, point2Y, endPointX, endPointY);canvas.drawPath(path, paint);}private void circlePathForEye(Canvas canvas, Paint paint, Eye eye){float eyeRadius = 100 / faceRadiusToEyeRadiusRadio;float eyeVerticalOffset = 100 / faceRadiusToEyeOffsetRadio;float eyeHorizontalSeparation = 100 / faceRadiusToEyeSeparationRadio;float eyeY = 100 - eyeVerticalOffset;float eyeX = 100;switch (eye) {case Left:eyeX = eyeX - eyeHorizontalSeparation / 2;break;case Right:eyeX = eyeX + eyeHorizontalSeparation / 2;break;}canvas.drawCircle(eyeX, eyeY, eyeRadius, paint);}
}