AndroidX Compose 基础 API 设计模式解析

祖筱泳

于 2025-06-08 09:00:09 发布

阅读量394

点赞数 5

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/gitblog_01111/article/details/148505059

AndroidX Compose 基础 API 设计模式解析

androidx Development environment for Android Jetpack extension libraries under the androidx namespace. Synchronized with Android Jetpack's primary development branch on AOSP. 项目地址: https://gitcode.com/gh_mirrors/an/androidx

前言

Jetpack Compose 作为 Android 现代 UI 工具包，其 API 设计遵循着一套精心设计的模式。本文将深入解析 Compose 库中的基础 API 设计模式，帮助开发者理解 Compose 的核心设计理念。

1. @Composable 组件模式

@Composable 组件是 Compose 中最基本的构建块，它们遵循以下设计原则：

必须接受一个 Modifier 作为第一个默认参数
必须只发射一个 Layout 节点
可以绘制内容（直接绘制或通过内容参数）
可以接受用户输入
可以通过插槽（slots）接受任意数量的其他可组合项

@Composable
fun CustomComponent(
    modifier: Modifier = Modifier,  // Modifier 必须是第一个参数
    content: @Composable () -> Unit  // 内容插槽
) {
    Box(
        modifier = modifier.customStyle(),  // 应用自定义样式
        content = content  // 渲染内容
    )
}

这种设计确保了组件的一致性和可组合性，使开发者能够轻松地构建和组合 UI 元素。

2. Modifier 模式

Modifier 是 Compose 中用于修改组件行为的强大工具：

每个 Modifier 都包装一个单独的布局
可以与其他 Modifier 链式组合
可以执行 Compose 的任何基本功能：测量、布局、绘制、语义等

Button(
    modifier = Modifier
        .padding(16.dp)  // 添加内边距
        .background(Color.Blue)  // 设置背景
        .clickable { /* 点击处理 */ },  // 添加点击行为
    onClick = { /* 按钮点击 */ }
) {
    Text("按钮")
}

Modifier 的链式调用提供了声明式且灵活的组件定制方式。

3. 组件与 Modifier 的选择

在设计 API 时，需要明确何时使用组件，何时使用 Modifier：

应该使用组件的情况：

描述用户可见的小部件或布局（如 Button、Text、Column）
需要随时间变化发射不同组件的情况

应该使用 Modifier 的情况：

不需要发射新的布局节点
只修改单个布局
可应用于任意布局的特性（如内边距、背景）

错误示例：

// 不应该将内边距实现为组件
@Composable
fun Padding(allSides: Dp, content: @Composable () -> Unit) {
    Box(Modifier.padding(allSides)) {
        content()
    }
}

正确示例：

// 应该使用 Modifier 扩展函数
fun Modifier.customPadding(allSides: Dp) = this.padding(allSides)

// 使用方式
Text("Hello", modifier = Modifier.customPadding(16.dp))

4. Remember 工厂模式

Remember 工厂用于在组合中创建状态对象，适用于以下情况：

对象构造需要读取多个 CompositionLocal
需要自动支持 rememberSavable
涉及复杂的 remember 交互和资源清理

Remember 工厂的参数处理有三种模式：

简单键模式：参数变化时重新创建对象
参数状态更新模式：参数变化时更新现有对象
参数工厂模式：通过 lambda 提供参数

// 简单键模式示例
@Composable
fun rememberCustomState(param: Param): CustomState {
    return remember(param) {
        CustomState(param)
    }
}

// 参数状态更新模式示例
@Composable
fun rememberCustomState(param: Param): CustomState {
    return remember {
        CustomState()
    }.apply {
        updateParam(param)
    }
}

// 参数工厂模式示例
@Composable
fun rememberCustomState(paramProvider: () -> Param): CustomState {
    return remember {
        CustomState(paramProvider())
    }
}

5. 插槽模式

插槽是通过 @Composable lambda 传递给组件的参数，允许调用者控制组件的部分行为：

单个插槽应命名为 content 并作为尾随 lambda
多个插槽中有一个是"主要"内容时，"主要"内容应作为尾随 lambda 并命名为 content
多个同等重要的插槽时，都不应命名为 content 且都应是非空的

// 单个内容插槽
@Composable
fun CustomButton(
    onClick: () -> Unit,
    modifier: Modifier = Modifier,
    content: @Composable () -> Unit  // 内容插槽
) { /* ... */ }

// 多个插槽
@Composable
fun CustomTab(
    modifier: Modifier = Modifier,
    text: @Composable (() -> Unit)? = null,  // 可选文本插槽
    icon: @Composable (() -> Unit)? = null,  // 可选图标插槽
    content: @Composable () -> Unit  // 主要内容插槽
) { /* ... */ }

6. 默认对象模式

默认对象公开了组件使用的默认参数和常量，使开发者能够轻松创建行为一致的自定义组件：

object CustomComponentDefaults {
    // 默认样式
    fun modifier(): Modifier = Modifier.fillMaxWidth()
    
    // 默认颜色
    val backgroundColor: Color = Color.Blue
}

// 使用方式
@Composable
fun CustomComponent(
    modifier: Modifier = CustomComponentDefaults.modifier(),
    backgroundColor: Color = CustomComponentDefaults.backgroundColor
) { /* ... */ }

这种模式确保了组件的一致性和可定制性。