制作圆形自定义警报对话框：着色区域不正确

Question

我已成功尝试使用以下代码制作自定义警报对话框。但是，当我尝试使custom_dialog.xml 中的Constraint Layout 具有圆角时，它显示了一个错误：由于圆角，黑色（变暗/着色）区域没有覆盖白色区域。这就是我要说的：

我的MainActivity.kt代码：

package com.example.customdialog

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.view.LayoutInflater
import android.view.View
import androidx.appcompat.app.AlertDialog
import kotlinx.android.synthetic.main.activity_main.*
import kotlinx.android.synthetic.main.custom_dialog.view.*

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
    }

    fun showDialog(view: View) {
        val mDialogView = LayoutInflater.from(this).inflate(R.layout.custom_dialog, null)
        val mBuilder = AlertDialog.Builder(this)
            .setView(mDialogView)

        val mAlertDialog = mBuilder.show()
        mDialogView.closeDialog.setOnClickListener {
            mAlertDialog.dismiss()
        }
    }
}

我的custom_dialog.xml代码：

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@drawable/rounded_corners">

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="141dp"
        android:layout_marginLeft="141dp"
        android:layout_marginTop="16dp"
        android:layout_marginEnd="142dp"
        android:layout_marginRight="142dp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        android:src="@mipmap/smiley_foreground"
        android:tint="#FFF"/>

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="16dp"
        android:text="WORKED!"
        android:textColor="#FFF"
        android:textSize="18sp"
        android:textStyle="bold"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/imageView" />

    <TextView
        android:id="@+id/textView3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:text="Apparently, the custom dialog worked"
        android:textColor="#FFF"
        android:textSize="18sp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/textView2" />

    <Button
        android:id="@+id/closeDialog"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginTop="8dp"
        android:layout_marginEnd="16dp"
        android:layout_marginRight="16dp"
        android:layout_marginBottom="16dp"
        android:background="@drawable/rounded_button"
        android:backgroundTint="#FFF"
        android:text="Close Dialog"
        android:textColor="@color/colorPrimary"
        android:textSize="18sp"
        android:textStyle="bold"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/textView3" />

</androidx.constraintlayout.widget.ConstraintLayout>

我的代码使 Constraint Layout 从 custom_dialog.xml 舍入：

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="@color/colorPrimary"/>
    <corners android:radius="25dp"/>
    <padding android:left="0dp" android:top="0dp" android:right="0dp" android:bottom="0dp" />
</shape>

如何去除对话框周围的白色区域？

Answer 1

我遇到了同样的问题。使背景透明可以解决这个问题。

<style name="Theme_Dialog" parent="Theme.AppCompat.Light.Dialog">

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

在初始化对话框时添加此样式。

val dialog = Dialog(context, R.style.Theme_Dialog)

不确定您的 @drawable/rounded_corners"。相反，您可以拥有卡片视图并将此约束布局放在卡片视图中。使用 app:cardCornerRadius="@dimen/space_18" 您已根据需要设置了半径。

<androidx.cardview.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:toots="http://schemas.android.com/tools"
android:orientation="vertical"
android:background="@color/white_color"
app:cardCornerRadius="@dimen/space_18">

<androidx.constraintlayout.widget.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

  ..

</androidx.constraintlayout.widget.ConstraintLayout>

Answer 2

您可以轻松提供自己的风格：

<style name="MyDialogTheme" parent="Theme.AppCompat.Light.Dialog.Alert">
    <item name="android:background">@color/transparent</item>
</style>

然后在 Builder 构造函数中应用它：

AlertDialog alertDialog = new AlertDialog.Builder(getContext(), R.style.MyDialogTheme)
        ...
        .create();