# 1. 前言 为了实现自定义`View`，我们需要再次回顾一下之前的博客：https://blog.csdn.net/qq_26460841/article/details/110478919 简单来说，分为下面几个步骤： - 定义一个继承自`View`的类，或者也可以使用其对应的子类； - 复写`onDraw`方法； - 应用在`xml`布局文件中； # 2. 自定义View 首先在`res`下的`values`文件夹的`style.xml`文件： ~~~ <?xml version="1.0" encoding="utf-8"?> <resources> <declare-styleable name="CategoryItem"> <attr name="CategoryItem_Choosed" format="boolean" /> <!--是否选中--> <attr name="CategoryItem_Radius" format="integer"/> <!--圆角半径--> <attr name="CategoryItem_ImgSrc" format="integer"/> <!--图片资源--> <attr name="CategoryItem_Text" format="string"/> <!--文本--> </declare-styleable> </resources> ~~~ 然后新建一个类，继承自`View`， 这里需要注意`styleable`的名字和类的名字需要一样，比如下面的代码： ~~~ class CategoryItem: View { // 自定义属性 var isChoosed: Boolean = false var radius: Int = 5 var imgSrc: Int = R.drawable.ic_baseline_bookmarks_24 var text: String = MFConst.NO_CATEGORY constructor(context: Context): super(context) constructor(context: Context, attributeSet: AttributeSet): super(context, attributeSet){ val typedArray: TypedArray = context.obtainStyledAttributes(attributeSet, R.styleable.CategoryItem) typedArray.apply { isChoosed = getBoolean(R.styleable.CategoryItem_CategoryItem_Choosed, isChoosed) // 获取值，没有就设置默认值4 radius = getInt(R.styleable.CategoryItem_CategoryItem_Radius, radius) imgSrc = getInt(R.styleable.CategoryItem_CategoryItem_ImgSrc, imgSrc) text = getString(R.styleable.CategoryItem_CategoryItem_Text)?: text } typedArray.recycle() // 使用TypedArray最后一定需要回收 } override fun onDraw(canvas: Canvas?) { super.onDraw(canvas) } } ~~~