从零开始学习自定义view【1】自定义流程概览

自定义View可以让我们创造独特的用户界面元素，实现自己的交互逻辑，并且为我们的应用增加个性化和创意。上一篇《从零开始学习自定义view【0】》详细介绍了自定义view的入门和代码准备，今天我们将以更简洁的方式来整理一下自定义view的流程，之后就直接实战了哦，让我们开始吧！😎😎

1. 🚀创建一个新的自定义View类

首先，我们需要创建一个新的自定义View类。我们将这个类命名为CustomView，并继承自View类。

class CustomView(context: Context) : View(context) {

}

这个类将成为我们自定义View的基础。

2. 🪐实现构造函数和初始化方法

接下来，我们需要实现构造函数和初始化方法。在Kotlin中，我们可以使用init关键字来定义初始化代码块。在构造函数中，我们可以传入Context对象，并在初始化方法中执行必要的设置。
tips：为什么我们要传入context，可以查看上一篇文章哦。

class CustomView @JvmOverloads constructor(
    context: Context,
    attrs: AttributeSet? = null,
    defStyleAttr: Int = 0
) : View(context, attrs, defStyleAttr) {

	init {
        // 初始化代码块
    }
}

这段代码定义了一个名为CustomView的自定义视图类。它是View类的子类，并带有一个@JvmOverloads修饰的构造函数。

3. ⛪重写绘制方法

接下来，我们需要重写绘制方法，以便在自定义View中实现我们想要的绘制逻辑。在这个例子中，我们将重写onDraw方法。

class CustomView @JvmOverloads constructor(
    context: Context,
    attrs: AttributeSet? = null,
    defStyleAttr: Int = 0
) : View(context, attrs, defStyleAttr) {

	init {
        // 初始化代码块
    }

	override fun onDraw(canvas: Canvas) {
	        super.onDraw(canvas)
	        // 绘制逻辑
	    }
}

在onDraw方法中，我们可以使用传入的Canvas对象来进行绘制操作。例如，我们可以使用canvas.drawRect()方法绘制一个矩形。

class CustomView @JvmOverloads constructor(
    context: Context,
    attrs: AttributeSet? = null,
    defStyleAttr: Int = 0
) : View(context, attrs, defStyleAttr) {

	init {
        // 初始化代码块
    }

	override fun onDraw(canvas: Canvas) {
	    super.onDraw(canvas)
	    
	    val rect = Rect(0, 0, width, height)
	    val paint = Paint()
	    paint.color = Color.RED
	    canvas.drawRect(rect, paint)
	}
}

在这个示例中，我们创建了一个矩形对象，并为其设置了红色的颜色。然后，我们使用canvas.drawRect()方法将矩形绘制在View上。

4.💡 处理触摸事件

除了绘制逻辑外，我们还可以处理触摸事件，以便为自定义View添加交互性。在这个例子中，我们将重写onTouchEvent方法。

class CustomView @JvmOverloads constructor(
    context: Context,
    attrs: AttributeSet? = null,
    defStyleAttr: Int = 0
) : View(context, attrs, defStyleAttr) {

	init {
        // 初始化代码块
    }

	override fun onDraw(canvas: Canvas) {
	    super.onDraw(canvas)
	    
	    val rect = Rect(0, 0, width, height)
	    val paint = Paint()
	    paint.color = Color.RED
	    canvas.drawRect(rect, paint)
	}
	
	override fun onTouchEvent(event: MotionEvent): Boolean {
        when (event.action) {
            MotionEvent.ACTION_DOWN -> {
                // 处理按下事件
            }
            MotionEvent.ACTION_MOVE -> {
                // 处理移动事件
            }
            MotionEvent.ACTION_UP -> {
                // 处理抬起事件
            }
        }
        return true
    }
}

5. 🏆使用自定义View

最后，让我们看一下如何在布局文件中使用自定义View。我们可以在XML布局文件中添加一个CustomView的标签，并设置必要的属性。

<com.example.myapp.CustomView
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

在这个示例中，我们使用了com.example.myapp作为自定义View的完整包名。确保根据你的项目设置正确的包名。

总结

通过这篇文章，我们将学习到如何创建自定义View类、实现构造函数和初始化方法、重写绘制方法和处理触摸事件。这些知识将让我们更好的掌握自定义View的技能和应用。下一篇就来试试手吧😜😜。