一：图形的位置和尺寸测量

桃扇骨 2023-10-15 17:52 38阅读 0赞

#### 绘制的基本要素: ####

**onDraw(Canvas)**：是用来重写的

**Canvas**：实际执行绘制的

**Paint**：调整粗细和颜色等

**坐标系**：以屏幕左上角为原点，向右、向下为正向数值的坐标系

**尺寸单位**：在绘制过程中所有的尺寸单位都是px，像素，在绘制阶段是直接跟屏幕打交道的

举例，我们画一条线

package com.example.viewtest.view
    
    import android.content.Context
    import android.graphics.Canvas
    import android.graphics.Paint
    import android.util.AttributeSet
    import android.view.View
    
    class TestView(context: Context, attrs: AttributeSet) : View(context, attrs) {
        
    
        private val paint = Paint(Paint.ANTI_ALIAS_FLAG)
    
        override fun onDraw(canvas: Canvas) {
        
            super.onDraw(canvas)
            canvas.drawLine(100f, 100f, 300f, 300f, paint)
        }
    }

画个圆

package com.example.viewtest.view
    
    import android.content.Context
    import android.graphics.Canvas
    import android.graphics.Paint
    import android.util.AttributeSet
    import android.view.View
    import com.example.viewtest.ext.dp
    
    class TestView(context: Context, attrs: AttributeSet) : View(context, attrs) {
        
    
        private val paint = Paint(Paint.ANTI_ALIAS_FLAG)
    
        override fun onDraw(canvas: Canvas) {
        
            super.onDraw(canvas)
    
            canvas.drawCircle(width / 2f, height / 2f, 100.dp, paint)
        }
    }

接下来讲**Path**，path不是用来绘制路径的，绘制路径只是其中一个功能而已，他是用来绘制图形的

使用**Path**绘制一个圆

package com.example.viewtest.view
    
    import android.content.Context
    import android.graphics.Canvas
    import android.graphics.Paint
    import android.graphics.Path
    import android.util.AttributeSet
    import android.view.View
    import com.example.viewtest.ext.dp
    
    class TestView(context: Context, attrs: AttributeSet) : View(context, attrs) {
        
    
        private val paint = Paint(Paint.ANTI_ALIAS_FLAG)
    
        private val path = Path()
    
        // 在尺寸发生改变的时候，初始化 path
        override fun onSizeChanged(w: Int, h: Int, oldw: Int, oldh: Int) {
        
            super.onSizeChanged(w, h, oldw, oldh)
            path.reset()
            // 最后一个参数：Direction，CW：顺时针，CCW：逆时针
            path.addCircle(width / 2f, height / 2f, 100.dp, Path.Direction.CW)
        }
    
        override fun onDraw(canvas: Canvas) {
        
            super.onDraw(canvas)
    //        canvas.drawLine(100f, 100f, 300f, 300f, paint)
    //
    //        canvas.drawCircle(width / 2f, height / 2f, 100.dp, paint)
    
            canvas.drawPath(path, paint)
        }
    }

这里主要讲一下**Direction**，Direction主要是用来处理两个图形相交处的样子，通过Direction的配合使用，可以使图形相交地方之处实现实心还是镂空的效果，这里有一个标准

如果要确定一个点是在内部还是外部，那么就从这个点像任意方向发送一条射线，这条线遇到左旋（逆时针）路径就+1，右旋路径就-1，最终结果无论正负，只要不为0，那么这就是一个在内部的点

除此之外，一般使用**path.fillType**属性，他的默认值是**Path.FillType.WINDING**，使用path.fillType是另一套计算方式，也就是说不管左旋还是右旋，一个点只记录和path的相交次数，奇数为内部，偶数为外部

镂空效果直接设置为 **path.fillType = Path.FillType.EVEN\_ODD**

举个例子，一个圆和一个方相交

package com.example.viewtest.view
    
    import android.content.Context
    import android.graphics.Canvas
    import android.graphics.Paint
    import android.graphics.Path
    import android.util.AttributeSet
    import android.view.View
    import com.example.viewtest.ext.dp
    
    class TestView(context: Context, attrs: AttributeSet) : View(context, attrs) {
        
    
        private val paint = Paint(Paint.ANTI_ALIAS_FLAG)
    
        private val path = Path()
    
        // 在尺寸发生改变的时候，初始化 path
        override fun onSizeChanged(w: Int, h: Int, oldw: Int, oldh: Int) {
        
            super.onSizeChanged(w, h, oldw, oldh)
            path.reset()
            // 最后一个参数：Direction，CW：顺时针，CCW：逆时针
            path.addCircle(width / 2f, height / 2f, 100.dp, Path.Direction.CW)
    
            path.addRect(width / 2f - 100.dp, height / 2f, width / 2f + 100.dp, height / 2f + 2 * 100.dp, Path.Direction.CCW)
            // 第二个参数的作用是是否要自动闭合
            pathMeasure = PathMeasure(path, false)
            
            pathMeasure.length
            // 给定一个长度，会返回当前长度所处位置的切点，也就是正弦值
            pathMeasure.getPosTan()
    
            path.fillType = Path.FillType.EVEN_ODD
        }
    
        override fun onDraw(canvas: Canvas) {
        
            super.onDraw(canvas)
    //        canvas.drawLine(100f, 100f, 300f, 300f, paint)
    //
    //        canvas.drawCircle(width / 2f, height / 2f, 100.dp, paint)
    
            canvas.drawPath(path, paint)
        }
    }

pathMeasure = PathMeasure(path, false)

第二个参数的作用是是否要自动闭合，如果一个图形假设是个半圆，那么测量的就是这个半圆的长度，如果是true就是半圆+起始点连接线的长度