安卓：自定义视图和圆角的AlertDialog

Question

我正在尝试构建一个带有自定义视图（没有标题或页脚）和圆角的AlertDialog。我看到了很多关于如何做到这一点的帖子，我也尝试了很多方法，但是我无法像我想要的那样构建它。

这是我的目标：

我创建了一个名为 dialog_background.xml 的 drawable 用于 dialog。

<shape xmlns:android="http://schemas.android.com/apk/res/android" >

    <solid
        android:color="#FFAAAAAA" />

    <stroke
        android:width="2dp"
        android:color="#FF000000" />

    <corners android:radius="20dp" />
</shape>

我添加了一个style来使用它：

<style name="MyDialog" parent="@android:style/Theme.Dialog">
    <item name="android:background">@drawable/dialog_background</item>
</style>

我的自定义视图的“layout”将有两个按钮。 现在，我向您展示一个空的“LinearLayout”，以使其简单易懂。 这是playdialog.xml：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    style="@style/MyDialog"
     >

</LinearLayout>

为了构建对话框，我使用了一个DialogFragment。以下是它的onCreateDialog函数：

public Dialog onCreateDialog(Bundle savedInstanceState) {
    AlertDialog.Builder builder = new AlertDialog.Builder(getActivity());
    LayoutInflater inflater = getActivity().getLayoutInflater();

    builder.setView(inflater.inflate(R.layout.playdialog, null));
    return builder.create();
}

好的，如果我使用这样的代码，我会得到这个：

我尝试通过修改DialogFragment代码，将dialog背景设置为透明：

public Dialog onCreateDialog(Bundle savedInstanceState) {
    AlertDialog.Builder builder = new AlertDialog.Builder(getActivity());
    LayoutInflater inflater = getActivity().getLayoutInflater();

    builder.setView(inflater.inflate(R.layout.playdialog, null));

    **NEW**        

    Dialog d = builder.create();
    d.getWindow().setBackgroundDrawable(new ColorDrawable(android.graphics.Color.TRANSPARENT));
    return d; 
}

结果完全一样，所以我意识到我的dialog下面的那个白色矩形来自我的自定义view，而不是dialog。我已经将view的背景设置为dialog_background.xml，因此不能将其设置为透明或者会失去圆角、颜色等。

然后我决定使用dialog_background.xml修改dialog的背景，并使我的view具有纯色背景。

在我的自定义view布局（playdialog.xml）中，我用以下内容替换了style="@style/MyDialog":

android:background="#FFAAAAAA"

然后在我的DialogFragment中，我使用了这段代码：

public Dialog onCreateDialog(Bundle savedInstanceState) {
    AlertDialog.Builder builder = new AlertDialog.Builder(getActivity());
    LayoutInflater inflater = getActivity().getLayoutInflater();

    builder.setView(inflater.inflate(R.layout.playdialog, null));

    **NEW**        

    Dialog d = builder.create();
    d.getWindow().setBackgroundDrawableResource(R.drawable.dialog_background);
    return d; 
}

这是我得到的：

几乎是我想要的，但是你可以看到我的自定义视图边框，所以还不够好。此时我不知道还能做什么。

有人知道我该怎么解决吗？

谢谢！

- PX Developer

---

你能修复这个问题吗？使用圆角时，我无法消除边角处的白色部分。 - sabbir

Answer 1

我刚刚创建了一个自定义警告对话框，但它的角不是圆形的。

首先，按以下方式为其创建布局 -

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="240sp"
android:layout_height="wrap_content"
android:background="#FFFFFF"
tools:ignore="SelectableText" >

<RelativeLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_margin="1sp"
    tools:ignore="UselessParent" >

    <TableLayout 
        android:id="@+id/tablelayout_dialog_title"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:stretchColumns="1" >

        <TableRow
            android:id="@+id/tablerow_dialog_title"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"            
            tools:ignore="UselessParent" >

            <ImageView 
                android:id="@+id/imageview_dialog_image"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/alertwhite" 
                android:layout_gravity="center"
                android:background="#643c3a"
                android:contentDescription="@string/string_todo"/>

            <TextView
                android:id="@+id/textview_dialog_title"
                android:layout_width="wrap_content"
                android:layout_height="fill_parent" 
                android:background="#643c3a"
                android:padding="10sp"
                android:gravity="center_vertical"
                android:textColor="#FFFFFF"
                android:textSize="15sp" />

        </TableRow>     
    </TableLayout>

    <View 
        android:id="@+id/viewline_dialog"
        android:layout_below="@+id/tablelayout_dialog_title"
        android:layout_width = "wrap_content" 
        android:layout_height="0.25dip"
        android:background="#ffffff"          
        android:layout_centerVertical ="true" />

    <TextView
        android:id="@+id/textview_dialog_text"
        android:layout_below="@+id/viewline_dialog"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:padding="8sp"
        android:background="#643c3a"
        android:textColor="#FFFFFF"
        android:textSize="12sp" />

    <View 
        android:id="@+id/viewline1_dialog"
        android:layout_width = "wrap_content" 
        android:layout_height="0.5dip"
        android:background="#ffffff"          
        android:layout_centerVertical ="true" 
        android:layout_below="@+id/textview_dialog_text"/>

    <TableLayout 
        android:id="@+id/tablelayout_dialog_button"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:stretchColumns="*"
        android:layout_below="@+id/viewline1_dialog"
        android:background="#a8a8a8" >

        <TableRow
            android:id="@+id/tablerow_dialog_button"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"            
            tools:ignore="UselessParent" >

            <Button
                android:id="@+id/button_dialog_yes"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_margin="8sp"
                android:paddingTop="5sp"
                android:paddingBottom="5sp"
                android:background="@drawable/roundedcornerbuttonfordialog_shape"
                android:text="@string/string_yes" />

            <Button
                android:id="@+id/button_dialog_no"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_margin="8sp"
                android:paddingTop="5sp"
                android:paddingBottom="5sp"
                android:background="@drawable/roundedcornerbuttonfordialog_shape"
                android:text="@string/string_no" />

        </TableRow>
    </TableLayout>

</RelativeLayout>

现在，编写对话框的代码如下所示 -

public static void callAlert(String message, final Context context){
    final Dialog dialog = new Dialog(context);
    dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
    dialog.setContentView(R.layout.customdialog_layout);
    dialog.getWindow().setBackgroundDrawable(new ColorDrawable(Color.WHITE));               

    TextView tvTitle = (TextView) dialog.findViewById(R.id.textview_dialog_title);
    tvTitle.setText("MyApp..");

    TextView tvText = (TextView) dialog.findViewById(R.id.textview_dialog_text);
    tvText.setText(message);    

    Button buttonDialogYes = (Button) dialog.findViewById(R.id.button_dialog_yes);
    buttonDialogYes.setOnClickListener(new OnClickListener() {          
        public void onClick(View v) {
            // Do your stuff...
            dialog.dismiss();
        }
    });

    Button buttonDialogNo = (Button) dialog.findViewById(R.id.button_dialog_no);
    buttonDialogNo.setOnClickListener(new OnClickListener() {
        public void onClick(View v) {
            // Do your stuff...
            dialog.dismiss();
        }           
    });
    dialog.show();
}

并将此方法称为 -

String message = "Your Message";
callAlert(message, callingClass.this);

希望这能对您有所帮助。

- Manoj Fegde

---

使用对话框而不是AlertDialog，就像你所做的那样，解决了问题。谢谢！:D - PX Developer

在我看来，我不会使用TableLayout来尝试进行格式化。我会坚持使用Linear、Relative和Frame。扁平化您的视图层次结构可以提高性能。 - jpotts18

谢谢！你用这个 dialog.getWindow().setBackgroundDrawable(new ColorDrawable(Color.WHITE)); 代码解决了我的问题。 - Luis Aguilar

Answer 2

在我的情况下，为了去除对话框中的边框，这个解决方案很有帮助：

dialog.setStyle(DialogFragment.STYLE_NO_FRAME, 0);

就像这里描述的一样 https://dev59.com/W2Qn5IYBdhLWcg3wZGd4#19521674

- Penzzz

Answer 3

以下代码解决了这个问题。

MyDialog mydialog = new MyDialog(this, "for testing",
            new myOnClickListener() {

                @Override
                public void onPositiveButtonClick() {
                    // TODO Auto-generated method stub
                    Toast.makeText(getApplicationContext(),
                            "I am positive button in the dialog",
                            Toast.LENGTH_LONG).show();
                }

                @Override
                public void onNegativeButtonClick() {
                    // TODO Auto-generated method stub
                    Toast.makeText(getApplicationContext(),
                            "I am negative button in the dialog",
                            Toast.LENGTH_LONG).show();
                }
            });

    // this will remove rectangle frame around the Dialog
    mydialog.getWindow().setBackgroundDrawableResource(android.R.color.transparent);
    mydialog.show();

谢谢， Nagendra

- Anisetti Nagendra

---

它没有消除角落中的白色部分 :( - sabbir

Answer 4

为什么不使用你展示的图片，比如“这是我的目标：”，将你的目标背景图保存在drawable文件夹中。

private AlertDialog createAlertDialog() {
    AlertDialog.Builder builder = new AlertDialog.Builder(this);
    builder.setView(getLayoutInflater().inflate(R.layout.playdialog, null));
    return builder.create();
}  

那么

AlertDialog dialog = createAlertDialog();
dialog.show();

- umesh

---

不建议使用图像，原因是它们不易扩展，并且重新渲染需要消耗大量计算资源和不必要的能源。 - computingfreak