Android自定义控件-绘图基础

baidu_24743861

已于 2022-08-04 17:34:07 修改

阅读量1.1k

点赞数

分类专栏： java 文章标签： android

于 2022-07-28 12:03:40 首次发布

本文链接：https://blog.csdn.net/baidu_24743861/article/details/126029081

版权

java 专栏收录该内容

21 篇文章 0 订阅

订阅专栏

一. Paint画笔

(1) void setColor(int color) : 设置画笔颜色

color只能取8位的0xAARRGGBB样式的颜色值，A代表透明度（Alpha），取值范围是0-255（对应十六进制数0x00-0xFF），取值越小，透明度越高，图像也越透明。当取0时，图像完全不可见。R：红色值，取值范围是0-255，取值越小，红色越少。G：绿色值，取值范围是0-255，取值越小，绿色越少。B：蓝色值，取值范围是0-255，取值越小，蓝色越少。

(2) void setStyle(Style style) 设置填充样式

style取值如下：

Paint.Style.FILL 仅填充内部
Paint.Style.STROKE 仅描边
Paint.Style.FILL_AND_STROKE 填充内部和描边

（3）void setStrokeWidth(float width) 设置描边宽度值，单位是px,当Paint的样式是STROKE 和FILL_AND_STROKE 时有效

二.Canvas画布

重写 void onDraw(Canvas canvas)函数

（1）画布背景设置

void drawColor(@ColorInt int color)   //0xffff00ff  紫色画布
void drawARGB(int a, int r, int g, int b)   //(0xff,0xff,0,0xff)
void drawRGB(int r, int g, int b)   //(0xff,0xff,0xff)

（2）void drawLine(float startX, float startY, float stopX, float stopY, @NonNull Paint paint)

参数说明：startX：起始点X坐标

startY：起始点Y坐标

stopX：结束点X坐标

stopY：结束点Y坐标

从上图可以看出：直线的粗细与画笔的Style是没有关系的，直线的粗细与setStrokeWidth()有直接的关系。

所以，一般而言，p a i n t . s e t S t r o k e Width（），S t y l e起作用时，用于设置描边宽度；在S t y l e不起作用时，用于设置画笔宽度。

(3) void drawPoint(float x, float y, @NonNull Paint paint) 画点

参数说明：float x：x的坐标，float y：y的坐标

        Paint paint = new Paint();
        paint.setColor(Color.RED);
        paint.setStrokeWidth(10);
        canvas.drawPoint(100,100,paint);

（4）void drawCircle (float cx, float cy, float radius, Paint paint)

参数说明：cx：圆心的x坐标，cy：圆心的y坐标，radius：圆的半径，paint：绘制时所使用的画笔。

 @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        Paint paint = new Paint();
        paint.setColor(0xffffff00); 
        paint.setStyle(Paint.Style.FILL);
        paint.setStrokeWidth(50); //50px

        canvas.drawCircle(200,100,80,paint);
    }

（5）画矩形

1）工具类 RectF 和 Rect
RectF(float left, float top, float right, float bottom)  //（矩形左侧的X坐标，顶部的Y坐标，右侧的X坐标，下部的Y坐标）左上角点和右下角点确定
Rect(int left, int top, int right, int bottom)

RectF与Rect的构造函数基本相同，不同的只是RectF所保存的数值类型是float类型，而Rect所保存的数值类型是int类型。 

2）画矩形
void drawRect(@NonNull RectF rect, @NonNull Paint paint)
void drawRect(@NonNull Rect r, @NonNull Paint paint)
void drawRect(float left, float top, float right, float bottom, @NonNull Paint paint)

一定要记住，在onDr aw（）函数中不能创建变量！一般在自定义控件的构造函数中创建变，即在初始化时一次性创建。

（6）绘制路径 Path类

void drawPath(@NonNull Path path, @NonNull Paint paint)

1）直线路径

void moveTo(float x, float y) ，（x,y）是直线的起点坐标

void lineTo(float x2, float y2) ，（x2,y2）是直线的终点，又是下一次绘制直线路径的起始点；lineTo()函数可以一直使用。

void close() 如果连续画了几条直线，但没有形成闭环，那么调用close()函数会将路径首尾点连接起来，形成闭环

示例：画三角

       Paint paint = new Paint();
        paint.setColor(Color.RED);
        paint.setStrokeWidth(10);
        paint.setStyle(Paint.Style.STROKE);
        paint.setAntiAlias(true);

        Path path = new Path();
        path.moveTo(100, 100);
        path.lineTo(100, 200);
        path.lineTo(200, 200);
        path.close();
        
        canvas.drawPath(path, paint);

2）弧线路径

void arcTo(@NonNull RectF oval, float startAngle, float sweepAngle) 这是一个画弧线路径的方法，弧线是从椭圆上截取的一部分。

参数说明：RectF oval：生成椭圆的矩形；float startAngle：弧开始的角度，以X轴正方向为0度；float sweepAngle：弧持续的角度。

        Paint paint = new Paint();
        paint.setColor(Color.RED);
        paint.setStrokeWidth(10);
        paint.setStyle(Paint.Style.STROKE);
        paint.setAntiAlias(true);
        RectF rectF = new RectF(100,300,150,500);
        canvas.drawRect(rectF,paint);


        paint.setColor(Color.GREEN);
        Path path = new Path();
//        path.moveTo(100,300);
        path.arcTo(rectF,180,270);
        canvas.drawPath(path,paint);

三.Region

1、构造Region

Region是一块任意形状的封闭图形

（1）直接构造函数

Region(@NonNull Region region) // 复制一个Region范围

Region(@NonNull Rect r) //创建一个矩形区域（常用）

Region(int left, int top, int right, int bottom) //创建一个矩形区域（常用）

 Region region = new Region(new Rect(100,100,200,300));
 drawRegion(canvas,paint,region);


    /**
     * 自定义画区域函数
     */
    private void drawRegion(Canvas canvas, Paint paint, Region region) {
        RegionIterator iter = new RegionIterator(region);
        Rect r = new Rect();
        while (iter.next(r)){
            canvas.drawRect(r,paint);
        }
    }

（2）间接构造函数

通过 public Region()的空构造函数与set系列函数相结合来实现的

public void setEmpty() //置空
public boolean set(Region region) //利用新的区域替换原来的区域
public boolean set(Rect r) //利用矩形所代表的区域替换原来的区域
public boolean set(int left , int top , int right , int bottom) //根据矩形的两个角点构造出矩形区域来替换原来的区域
public boolean setPath(Path path , Region clip) //根据路径的区域和某区域的交集构造出新的区域

 //画椭圆路径
 Path path = new Path();
 RectF rect = new RectF(50, 50, 200, 500);
 path.addOval(rect, Path.Direction.CCW);  

Region rgn =new Region() ;
rgn . setPath(ovalPath , new Region(50, 50 , 200, 200));

 //画出路径
 drawRegion(canvas , paint，rgn);


 //Path.Direction.CCW  逆时针
 //Path.Direction.CW   顺时针

2、区域相交

（1）union函数

boolean union(@NonNull Rect r) 该函数用于与指定矩形取并集，即将Rect所指定的矩形加入当前区域中。

 Paint paint = new Paint();
 paint.setColor(Color.RED);
 paint.setStyle(Paint.Style.FILL);

 Region region= new Region(l0 , 10 , 200 ,1 00 );
 region . union ( new Rect (l 0, 10,50,300));

 //画出区域
 drawRegion(canvas,paint,region);

（2）区域操作

系列方法一：

boolean op (Rect r , Op op)

boolean op(int left , int top , int right , int bottom , Op op)

boolean op(Region region , Op op)

用当前的Region对象与指定的一个Rect对象或者Region对象执行相交操作，并将结果赋值给当前的Region对象。如果计算成功，则返回true；否则返回false。

四、属性动画

   ValueAnimator valueAnimator = ValueAnimator.ofInt(0, 300, 100, 400);
        valueAnimator.setDuration(300);
        valueAnimator.addUpdateListener(new AnimatorUpdateListener() {
            @Override
            public void onAnimationUpdate(ValueAnimator animation) {
                int curValue = (Integer)animation.getAnimatedValue();//获取ValueAnimator在运动时，当前运动点的值
                tv.layout(curValue ,curValue, curValue+tv.getWidth () ,curValue+  tv.getHeight ());
            }
        });
        valueAnimator.start();

tv从（0,0）位置运动到（300,300）再到（100,100）再到（400,400）位置