自定义View

最新推荐文章于 2023-10-09 17:41:38 发布

立花泷える宫水三叶

最新推荐文章于 2023-10-09 17:41:38 发布

阅读量82

点赞数

分类专栏： Android 文章标签： canvas

本文链接：https://blog.youkuaiyun.com/weixin_43880692/article/details/119830954

版权

Android 专栏收录该内容

32 篇文章

订阅专栏

本文深入介绍了Android自定义View的创建，包括继承View、使用onDraw方法和Canvas进行图形绘制。讲解了Paint的设置，如填充模式、线条宽度、文字大小、抗锯齿等。此外，详细阐述了如何绘制点、线、矩形、圆形、椭圆、弧形等基本图形，并展示了各种绘制方法的实例。同时，提到了Android坐标系以及Paint的 StrokeCap属性用于设置点的形状。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

自定义View

自定义View初学

首先我们要先继承View这个类
了解onDraw和canvas
- onDraw是绘制方法
- canvas是绘制的实现
Paint：画笔的使用
1. Paint.setStyle(Style style) 设置绘制模式
  1. FILL 填充模式
  2. STROKE 画线模式
  3. FILL_AND_STROKE 并用既画线又填充，使用setStrokeWidth来设置线条宽度
2. Paint.setColor(int color) 设置颜色
3. Paint.setStrokeWidth(float width) 设置线条宽度
4. Paint.setTextSize(float textSize) 设置文字大小
5. Paint.setAntiAlias(boolean aa) 设置抗锯齿开关
  1. true为开启
  2. false为关闭
  3. 也可以通过初始化Paint时设置
```
Paint mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
```
Android的坐标系：是以view的左上角为原点，向右是横坐标正方向，向下是纵坐标正方向
canvas的使用方法
1. 绘制点drawPoint(float x, float y, Paint paint) ：
  1. setStrokeCap可以设置点的形状，这是一个设置线条端点形状的方法，
    1. ROUND 圆形的点
    2. SQUARE/BUTT 方形的点
```
mPaint.setStrokeCap(Paint.Cap.ROUND);
mPaint.setStrokeCap(Paint.Cap.SQUARE);
mPaint.setStrokeCap(Paint.Cap.BUTT);
```
  2. 绘制单个点：
```
canvas.drawPoint(50,50,mPaint);
```
  3. 绘制点集合：
```
float[] points = {0, 0, 50, 50, 50, 100, 100, 50, 100, 100, 150, 50, 150, 100};
canvas.drawPoints(points,2/*调过两个数，即前两个*/,8/*绘制8个点*/,mPaint);
```
2. 绘制矩形drawRect(float left, float top, float right, float bottom, Paint paint) ：
  1. ```
  canvas.drawRect(100,100,500,500,mPaint);
```
2. ```
canvas.drawRect(new Rect(100,100,500,500),mPaint);
```
  3. ```
  canvas.drawRect(new RectF(100f,100f,500f,500f),mPaint);
```
3. 绘制圆形drawCircle(float centerX, float centerY, float radius, Paint paint)：
  1. cx 横坐标 cy 纵坐标 radius 半径 paint 画笔
  2. ```
  canvas.drawCircle(800,300,200,mPaint);
```
3. ```
//给原图像蒙上一层颜色
canvas.drawColor(Color.parseColor("#88880000"));
```
4. 绘制椭圆drawOval(float left, float top, float right, float bottom, Paint paint) ：
  1. left,top,right,bottom是椭圆的左上右下四个边界坐标
  2. ```
  canvas.drawOval(100,800,400,1400,mPaint);
```
5. 绘制线条drawLine(float startX, float startY, float stopX, float stopY, Paint paint) ：
  1. startX, startY, stopX, stopY 分别是线的起点和终点坐标。
  2. ```
  canvas.drawLine(500,200,800,800,mPaint);
```
6. 绘制线条集合drawLines(float[] pts, int offset, int count, Paint paint) / drawLines(float[] pts, Paint paint) ：
```
float[] linePoints = {20, 20, 120, 20, 70, 20, 70, 120, 20, 120, 120, 120, 150, 20, 250, 20, 150, 20, 150, 120, 250, 20, 250, 120, 150, 120, 250, 120};
canvas.drawLines(linePoints, mPaint);
```
7. 绘制圆角矩形drawRoundRect(float left, float top, float right, float bottom, float rx, float ry, Paint paint) ：
  1. left, top, right, bottom 是四条边的坐标，rx 和 ry 是圆角的横向半径和纵向半径。
  2. ```
  canvas.drawRoundRect(800,800,1400,1400,50,50,mPaint);
```
8. 绘制弧形或者扇形drawArc(float left, float top, float right, float bottom, float startAngle, float sweepAngle, boolean useCenter, Paint paint) ：
  1. left, top, right, bottom 描述的是这个弧形所在的椭圆；startAngle 是弧形的起始角度（x 轴的正向，即正右的方向，是 0 度的位置；顺时针为正角度，逆时针为负角度），sweepAngle 是弧形划过的角度；useCenter 表示是否连接到圆心，如果不连接到圆心，就是弧形，如果连接到圆心，就是扇形。
  2. ```
  canvas.drawOval(100,1500,600,1800,mPaint);
  canvas.drawArc(100,1500,600,1800,20,140,false, mPaint);
  mPaint.setStyle(Paint.Style.FILL);
  canvas.drawArc(100,1500,600,1800,-110,100,true,mPaint);
```