Compose 三层结构设计规范1（基于Slot API）

Compose 三层结构设计规范（基于Slot API）

结构层：简洁，不包含业务资源和默认值

中间层：尽可能复用参数，写常用到的默认值

调用层：只写差异的数据

一、三层结构角色定位与默认值策略

1. 结构层 (ProfileCardLayout)："纯骨架"

默认值策略：尽量不给业务默认值。
核心职责：仅定义"坑位"位置、层级（Z-axis）堆叠规则、基础物理规则（内边距padding、间距spacing）。
参数处理规则 ：
- Modifier：默认赋值为 Modifier。
- Slot (Composable 类型)：默认赋值为 null。
- 禁止写死任何 R.drawable 或 R.color 等业务资源。

2. 中间层/业务层 (UserInfoCard)："配置员"

默认值策略：大胆定义业务默认值。
核心职责：将结构层抽象为具体业务组件，定义卡片默认背景、默认图标等业务级UI规则。
参数处理规则 ：
- 为 IconRes、backgroundImage、TextStyle 等参数赋予具体业务默认值。
- 实现调用层在90%场景下仅需传递 title 和 details 等核心数据。

3. 调用层 (Screen/Page)："使用者"

默认值策略：仅传递"差异化"数据。
核心职责：仅关注具体业务数据（如显示"陈奕迅"或"周杰伦"），不处理UI配置细节。
核心优势：代码简洁，业务逻辑清晰，避免被UI配置细节淹没。

二、三层结构参数处理示例对比

维度	结构层 (ProfileCardLayout)	中间层 (UserInfoCard)	调用层 (UserInfoCard)
背景图	backgroundImage: @Composable? = null	bg: Int = R.drawable.ic_default	(不传，用默认)
图标	leftContent: @Composable	icon: IconRes = IconRes(R.id.vip)	icon = IconRes(R.id.svip)
内边距	写死在 Row 上 (Layout 规定)	不涉及	不涉及

三、三层结构设计的核心优势

易于维护：UI视觉改版时（如所有卡片内边距从16dp改为20dp），仅需修改结构层一处即可生效。
视觉统一：业务元素改版时（如VIP图标样式统一更换），仅需修改中间层的默认值。
开发效率：编写新页面时，仅需传递1-2个差异化参数，即可完成卡片UI渲染。

四、结构层代码示例

kotlin 复制代码

@Composable
fun ProfileCardLayout(
    modifier: Modifier = Modifier,
    backgroundImage: (@Composable () -> Unit)? = null,
    // 若左侧内容是核心，可不设 null，强制传入
    leftContent: @Composable () -> Unit, 
    rightContent: (@Composable () -> Unit)? = null,
    overlayContent: (@Composable () -> Unit)? = null
) {
    Box(modifier = modifier) {
        // 背景层
        backgroundImage?.invoke()

        Row(
            modifier = Modifier
                .fillMaxSize()
                .padding(...) // 布局定义的内边距（结构层规定）
        ) {
            // 给左侧 Box 设置 weight，避免右侧内容被挤压
            Box(modifier = Modifier.weight(1f)) {
                leftContent()
            }
            
            rightContent?.let {
                Box { it() }
            }
        }
        // ... overlay
    }
}

五、业务层补充说明

UserInfoCard 中间层已包含 backgroundImage 默认值，符合设计规范。针对 details 文字过长的处理规则（自动换行/单行显示加省略号），建议在中间层定义为业务规则。

总结

结构层仅负责布局规则，不包含任何业务默认值和资源；中间层承接业务默认配置，调用层仅传差异化数据。
三层结构设计可实现单点维护、视觉统一、高效开发的核心目标。
文字超长显示规则属于业务规则，建议在中间层（UserInfoCard）统一定义。