Jetpack Compose:删除对话框背景(Android)

问题描述 投票:0回答:4

我有以下代码片段,用于在 Android 上的 Jetpack Compose 中显示带有一些文本的简单对话框:

    Dialog(onDismissRequest = { showDialog.value = false }) {
        Text(
            text = "Hello",
            color = Color.Black,
            fontSize = 24.sp,
            modifier = Modifier
                .background(
                    color = Color.Green,
                    shape = RoundedCornerShape(size = 16.dp)
                )
                .padding(8.dp)
        )
    }

产生以下输出:

现在棘手的部分开始了:当迷人的绿色圆形和黑色文本被定义时,边缘的白色背景却没有被定义。那么这个白色背景是从哪里来的呢?

整个可组合屏幕本身在其他时候被包装到自定义主题中。我已经将每种主题颜色替换为不同的主题颜色,以检查对话框的背景是否有变化。

我还尝试将对话框本身包装在第二个主题中以覆盖所有其他颜色,但也没有成功。

注意:当我定义没有任何样式的原始文本可组合项时,白色背景也存在,因此它似乎是对话框的某种标准背景。

目标是删除白色背景颜色或用透明颜色替换,以便在暗淡背景上仅具有圆形形状。

android kotlin android-jetpack-compose android-jetpack
4个回答
1
投票

感谢大家提供有用的意见,最终我的代码在不同的项目设置中运行良好的信息让我朝不同的方向思考。

所以我尝试将我的代码向上移动一些层并移出主题定义。没有其他结果。

但后来我想到,我有一个包含 Compose 和良好的旧视图实现的混合项目,因此还有一些 xml 样式。

深入挖掘一下 compose

androidx.compose.ui.window.Dialog
,我们可以看到
R.style.DialogWindowTheme
中调用了
DialogWrapper
。我不是 100% 确定,但我假设我自己的 xml 定义会覆盖此样式的某些属性并影响撰写对话框的外观。

因此,如果您也有像我一样的类似麻烦,请检查以下内容:

  • 您是否在同一个项目中使用 xml 样式并进行撰写?

  • 您是否为对话框创建了样式并覆盖主题中的

    dialogTheme

    <item name="android:dialogTheme">@style/AppTheme.SomeDialogStyles</item>

  • 然后请检查您是否设置了自定义背景颜色

    <item name="android:background">@color/some_color</item>

我的问题的解决方案是删除

android:background
属性。现在我正在对所有现有对话框进行冒烟测试,看看这是否会产生一些负面影响,但我在撰写对话框中的白色背景问题已解决!


1
投票

我尝试使用Dialog,但无法清除标志WindowManager.LayoutParams.FLAG_DIM_BEHIND

你可以尝试使用Popup来代替Dialog,一切对我来说都很好。

Popup(
        onDismissRequest = {},
        properties = PopupProperties(
            focusable = true,
            dismissOnBackPress = false,
            dismissOnClickOutside = false,
            excludeFromSystemGesture = true,
        )
    ) {
        Box(
            contentAlignment = Alignment.Center,
            modifier = Modifier
                .fillMaxSize()
                .background(Color.Transparent)
        ) {
            // Your content code is here
        }
    }

0
投票

试试这个:

Dialog(
    onDismissRequest = {

    }
) {
    Column(modifier = Modifier.background(color = Color.Transparent)) {
        Text(
            text = "Hello",
            color = Color.Black,
            fontSize = 24.sp,
            modifier = Modifier
                .background(
                    color = Color.Green,
                    shape = RoundedCornerShape(size = 16.dp)
                )
                .padding(8.dp)
        )
    }
}

0
投票

您可以使用containerColor属性更改撰写AlertDialog的颜色。

AlertDialog(
  containerColor = Color.White,
  title = { ... },
  text = { ... },
  ...
}
© www.soinside.com 2019 - 2024. All rights reserved.