【Android】自定义View组件，并实现在 Compose、Kotlin、Xml 中调用

宾有为

已于 2024-03-18 20:31:27 修改

阅读量3.1k

点赞数 20

CC 4.0 BY-SA版权

分类专栏： Android 文章标签： android kotlin xml 自定义view compose

于 2024-01-01 16:39:19 首次发布

本文链接：https://blog.csdn.net/baidu_41616022/article/details/134098172

从事 Android 开发以来，很少有过自定义 View 的相关开发需求，大部分 UI 都是可以集成某些官方组件，在组件的基础上完成能够大大缩短开发时间。但今天我要讲的是：如何使用 Android 开发一个Compose、Xml都可以调用的组件？接下来请跟随我的脚步一起去学习 View 的自定义组件开发吧。

Android 屏幕坐标

自定义 View 之前，需要先了解 View 的坐标，知道哪里是起点，哪里是终点，才能更好的展开工作。

经历过九年义务教育的朋友们，相信大家都见过下面的这幅图 👇

很眼熟吧？这张图片的东西被称之为 👉 平面直角坐标系。

在 Android 系统上，也是用的平面直角坐标系来确定 View 的方向、大小，只不过它是“倒”过来的平面直角坐标系，如下图👇

在这里插入图片描述
不明白？我们再把这个图片代入到 Android 屏幕上来

在这里插入图片描述
看懂了吧？在 Android 系统上，直角坐标系的原点就是屏幕的左上角，往右是 x 轴，往下是 y 轴，整个 Android 的屏幕就是处于平面直角坐标系的第四象限上，其坐标的单位则使用的是像素(px) 来表示。如果你的手机是 1080*1920 像素，则意味着，以原点为起点，至屏幕的右侧，共有 1080 像素 (px) ，以原点为起点，至屏幕的底部，共有 1920 个像素(px)。

自定义 View 的方式

在 Android 中，自定义 View 一般可分为两种方式：继承 ViewGroup 或 View 实现自定义。

ViewGroup
自定义 ViewGroup 一般是利用现有的组件根据特定的布局方式来组成新的组件，大多继承自 ViewGroup 或各种 Layout ，包含子 View。
View
在没有现成的View，需要自己实现的时候，就是用自定义 View，一般继承自 View、SurfaceView 或其它的 View。

本文只讲解通过继承 View 来实现自定义 View，通过继承 ViewGroup 实现自定义 View 的文章可参考往期文章👉【Android】实现自定义标题栏

自定义 View

View 完成自定义的过程需要经历：初始化 → onMeasure → onSizeChanged → onLayout → onDraw 五个阶段。

初始化

重写构造函数

View 的初始化方式可通过四种构造函数进行初始化，如下：

constructor(context: Context?) : this(context, null)

constructor(context: Context?, attrs: AttributeSet?) : this(context, attrs, 0)

constructor(context: Context?, attrs: AttributeSet?, defStyleAttr: Int) : this(context, attrs, defStyleAttr, 0)

constructor(context: Context?, attrs: AttributeSet?, defStyleAttr: Int, defStyleRes: Int) : super(context, attrs, defStyleAttr, defStyleRes) {
   
   }

构造函数	使用场景
public View(Context context)	一般在 Activity、Fragment 中使用（本文使用该构造函数）： View view = new View(context);
public View(Context context, AttributeSet attrs)	当从XML文件构造视图，提供XML文件中指定的属性时，会调用此函数（本文使用该构造函数）： < View android:layout_width=“wrap_content” android:layout_height=“wrap_content”/>
public View(Context context, AttributeSet attrs, int defStyleAttr)	从XML执行膨胀，并从主题属性应用特定于类的基本样式。View的这个构造函数允许子类在膨胀时使用自己的基本样式。
public View(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes)	从XML执行膨胀，并从主题属性或样式资源应用特定于类的基本样式。View的这个构造函数允许子类在膨胀时使用自己的基本样式。（本文使用该构造函数）

注意：重写构造方法时，拥有四个参数的那个构造函数必须使用super用于访问父类的构造方法，另外三个构造方法，则需要使用this指引下一个构造方法。这样，当调用第一、二、三个构造方法时，就会执行第四个构造方法，使用该方式才能使UI渲染上，否则会出现实例化 View 无效的情况出现。具体参考上方的四个构造方法。

自定义 XML 属性

如果自定义的 View 在 XML 布局上用的到，自定义属性这一步则少不了，届时需要在 res/values/arrts.xml 文件夹添加 XML 的属性。若没有 arrts.xml 文件则需手动创建。创建完成后在其中编写的代码如下：

<resources>
    <declare-styleable name="StepView">
        <attr name="type">
	        <!--      添加枚举，在布局样式使用type属性时可直接使用以下的选项      -->
            <enum name="start" value="0" />
            <enum name="middle" value="1" />
            <enum name="stop" value="2" />
        </attr>
        <attr name="text" format="string"