Compose for Desktop Window组件背景透明设置问题（Windows11）

问题描述 #

在Windows11系统下使用Compose for Desktop，设置Window组件的transparent = true，内部用Box配合clip()和background()实现圆角窗口，但窗口角落呈现黑色而非透明。原代码如下：

Window(
        onCloseRequest =::exitApplication,
        state = widowState,
        icon = icon,
        undecorated = true,
        transparent = true,
        resizable = false
    ){
        Box(
        modifier = Modifier
            .clip(shape = RoundedCornerShape(app_common_rounded_corner))
            .fillMaxSize()
            .background(dark_primary)
        ){}
    }

解决方法 #

1. 为Window添加透明背景参数 #

默认情况下，即使开启transparent = true，Window的底层背景仍为黑色。需要显式设置Window的background参数为Color.Transparent，让窗口底层完全透明。

2. 调整Box的Modifier顺序 #

将clip()放在background()之后，确保背景被裁剪为圆角，而非先裁剪再填充背景（后者会导致裁剪区域外的窗口黑色背景暴露）。

修改后的代码：

Window(
    onCloseRequest = ::exitApplication,
    state = widowState,
    icon = icon,
    undecorated = true,
    transparent = true,
    resizable = false,
    background = Color.Transparent // 新增：设置窗口底层背景透明
) {
    Box(
        modifier = Modifier
            .fillMaxSize()
            .background(dark_primary) // 先填充背景
            .clip(RoundedCornerShape(app_common_rounded_corner)) // 再裁剪圆角
    ) {}
}

原理说明 #

• 设置background = Color.Transparent后，Window组件的底层不再有黑色背景，裁剪圆角后露出的是系统桌面，解决角落变黑问题。
• Modifier的执行顺序是从左到右，先设置背景再裁剪，能保证背景区域被正确裁剪为圆角，避免窗口底层的黑色区域透出。

内容的提问来源于stack exchange，提问作者ashes