具有自定义形状的 DialogFragment

Question

如何使用自定义形状创建对话框片段？

我有一个图标需要放在对话框的顶部window（透明）。

对话框本身应该是：

对话框布局：

<FrameLayout
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="80dp">
        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="40dp"
            android:layout_gravity="bottom|center">
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/server_error_title"
                android:layout_marginTop="80dp"
                android:layout_centerHorizontal="true"
                android:textSize="20sp"
                android:textAllCaps="true"
                android:text="@string/server_error_title"
                android:textColor="@color/soft_blue"
                android:fontFamily="sans-serif-medium"/>
            <View
                android:layout_width="60dp"
                android:layout_height="2dp"
                android:id="@+id/server_error_divider"
                android:layout_marginTop="21dp"
                android:layout_centerHorizontal="true"
                android:layout_below="@id/server_error_title"
                android:background="@color/soft_blue" />
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/server_error_message"
                android:layout_marginTop="19dp"
                android:layout_centerHorizontal="true"
                android:layout_below="@id/server_error_divider"
                style="@style/TextDialog"
                android:text="@string/server_error_message"/>
            <View
                android:layout_width="match_parent"
                android:layout_height="1dp"
                android:id="@+id/server_error_large_divider"
                android:layout_marginTop="51dp"
                android:layout_below="@id/server_error_message"
                android:background="@color/greyish"/>
           <LinearLayout
               android:layout_width="match_parent"
               android:layout_height="wrap_content"
               android:gravity="center_horizontal"
               android:background="@color/white_grey"
               android:layout_below="@id/server_error_large_divider">
               <Button
                   android:layout_width="320dp"
                   android:layout_height="46dp"
                   android:id="@+id/server_error_close_btn"
                   android:layout_marginTop="30dp"
                   android:layout_marginBottom="30dp"
                   style="@style/TextButton2"
                   android:text="@string/server_error_close_btn"
                   android:background="@drawable/big_button_shape" />
           </LinearLayout>
        </RelativeLayout>
        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/error_dialog_icon"
            android:src="@drawable/ic_error_circle"
            android:layout_gravity="center|top"/>
    </FrameLayout>

但我得到的是：

我需要自定义 ViewGroup 还是可以用更简单的方式完成？

Answer 1

您可以根据自己的想法将 Views(custom button, layout) 放在 LinearLayout 中。

对话框方法，使 Window 透明：

Dialog dialog = new Dialog(this);
dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
dialog.setContentView(R.layout.test);
dialog.getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));
dialog.show();

test.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@android:color/transparent" >

<LinearLayout
    android:id="@+id/linearLayout1"
    android:layout_width="match_parent"
    android:layout_height="100dp"
    android:layout_alignParentTop="true"
    android:layout_centerHorizontal="true"
    android:layout_marginTop="57dp"
    android:background="#f00"
    android:orientation="vertical" >
</LinearLayout>

<ImageView
    android:id="@+id/imageView1"
    android:layout_width="100dp"
    android:layout_height="100dp"
    android:layout_alignParentTop="true"
    android:layout_centerHorizontal="true"
    android:src="@drawable/ic_launcher" />

</RelativeLayout>

结果（避免BG）

Answer 2

创建样式并将您的形状设置为背景，例如：

<style name="MyDialogFragmentStyl" parent="ThemeOverlay.AppCompat.Dialog">
    <item name="android:windowBackground">@drawable/my_dialog_background</item>
</style>

Answer 3

这样试试，它会显示透明对话框

Dialog dialog = new Dialog(mContext, android.R.style.Theme_Panel);
            dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
            dialog.getWindow().setBackgroundDrawable(new ColorDrawable(android.graphics.Color.TRANSPARENT));
            dialog.setContentView(R.layout.yourlayout);
            dialog.setCanceledOnTouchOutside(true);
            TextView text = (TextView) dialog.findViewById(R.id.----);
            dialog.show();

Answer 4

为您的 xml 使用以下示例代码：

<FrameLayout
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@android:color/transparent">
        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="45dp"
            android:background="@android:color/white"
            android:layout_gravity="bottom|center">
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/server_error_title"
                android:layout_marginTop="80dp"
                android:layout_centerHorizontal="true"
                android:textSize="20sp"
                android:textAllCaps="true"
                android:text="@string/server_error_title"
                android:textColor="@color/soft_blue"
                android:fontFamily="sans-serif-medium"/>
            <View
                android:layout_width="60dp"
                android:layout_height="2dp"
                android:id="@+id/server_error_divider"
                android:layout_marginTop="21dp"
                android:layout_centerHorizontal="true"
                android:layout_below="@id/server_error_title"
                android:background="@color/soft_blue" />
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/server_error_message"
                android:layout_marginTop="19dp"
                android:layout_centerHorizontal="true"
                android:layout_below="@id/server_error_divider"
                style="@style/TextDialog"
                android:text="@string/server_error_message"/>
            <View
                android:layout_width="match_parent"
                android:layout_height="1dp"
                android:id="@+id/server_error_large_divider"
                android:layout_marginTop="51dp"
                android:layout_below="@id/server_error_message"
                android:background="@color/greyish"/>
           <LinearLayout
               android:layout_width="match_parent"
               android:layout_height="wrap_content"
               android:gravity="center_horizontal"
               android:background="@color/white_grey"
               android:layout_below="@id/server_error_large_divider">
               <Button
                   android:layout_width="320dp"
                   android:layout_height="46dp"
                   android:id="@+id/server_error_close_btn"
                   android:layout_marginTop="30dp"
                   android:layout_marginBottom="30dp"
                   style="@style/TextButton2"
                   android:text="@string/server_error_close_btn"
                   android:background="@drawable/big_button_shape" />
           </LinearLayout>
        </RelativeLayout>

        <FrameLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:padding="4dp"
        android:background="@drawable/error_circle">

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/error_dialog_icon"
            android:src="@drawable/ic_error_circle"
            android:layout_gravity="center|top"/>

        </FrameLayout>
    </FrameLayout>

和error_circle：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:innerRadius="0dp"
    android:shape="oval"
    android:useLevel="false" >
    <solid android:color="@android:color/transparent" />

    <stroke
        android:width="45dp"
        android:color="@android:color/white" />
</shape>

编辑：

在 DialogFragment 的 onCreateView() 中：

getDialog().requestWindowFeature(Window.FEATURE_NO_TITLE);

getDialog().getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));

具有自定义形状的 DialogFragment

DialogFragment with custom shape

android

android-custom-view

android-layout

android-dialogfragment

android-viewgroup