表面效果 - YumeMochi

平滑圆角来自 Miuix 的 miuix-squircle，背景捕获和模糊来自 miuix-blur，basic 依赖前者，advanced 对外导出后者的 Backdrop 类型，因此使用玻璃表面时不需要额外声明 Miuix Blur 依赖

Miuix 工件	YumeMochi 模块	用途
`miuix-squircle`	`basic`	通过 `squircleSurface` 绘制连续圆角表面
`miuix-blur`	`advanced`	通过 `LayerBackdrop`、`drawBackdrop` 和 `blur` 捕获并处理背景

圆角表面

yumeMochiSurface 是对 Miuix Squircle 的主题化封装：它提供 MochiTheme.colors.bg 和 MochiTheme.radius.sm 作为默认值，适合普通容器、列表项和基础卡片

Box(
    modifier = Modifier
        .yumeMochiSurface()
        .padding(MochiTheme.spacing.xl),
)

default:"MochiTheme.radius.sm"

连续圆角半径

平台行为： Miuix 在支持 runtime shader 的环境中绘制 Squircle，不可用时会自动回退为普通圆角，Android 与 Windows Desktop 调用同一个 YumeMochi API，不需要手写平台分支

玻璃表面

MochiGlassSurface 是对 Miuix Blur 的主题化封装：它接收捕获下层内容的 Backdrop，再绘制模糊、覆盖色与连续圆角，先创建并挂载背景捕获器，再传入玻璃组件

创建

使用 rememberLayerBackdrop() 创建 LayerBackdrop

挂载

把 Modifier.layerBackdrop(backdrop) 加到背景和玻璃表面的共同容器

传入

将同一 backdrop 传给 MochiGlassSurface

@Composable
fun GlassPanel() {
    val backdrop = rememberLayerBackdrop()

    Box(Modifier.layerBackdrop(backdrop)) {
        BackgroundContent()
        MochiGlassSurface(backdrop = backdrop) {
            ForegroundContent()
        }
    }
}

Backdrop

required

从共同背景容器捕获的实例

Modifier

default:"Modifier"

玻璃容器的外层 Modifier

default:"20.dp"

模糊半径

Color

default:"MochiTheme.colors.bg.copy(alpha = 0.72f)"

模糊上方的覆盖色

default:"MochiTheme.radius.md"

裁剪与表面共用的连续圆角

@Composable () -> Unit

required

渲染在玻璃上的内容

性能： 模糊会捕获并处理背景像素，将它用于菜单、弹窗和小型浮层，不要作为页面根背景或长列表的每一项，当 runtime shader 不可用时，Miuix 会停止模糊绘制，但内容和覆盖色仍会正常显示

​圆角表面

​玻璃表面

圆角表面

玻璃表面