web-dev-qa-db-ja.com

androidで角の丸いカスタムダイアログを作成する方法

私がやろうとしていること：カスタムダイアログを作成しようとしています。角が丸い。

ハッピングとは：カスタムダイアログを作成できますが、角が丸いわけではありません。セレクターを追加しようとしましたが、まだできませんでした

Javaコード：

private void launchDismissDlg() {

        dialog = new Dialog(getActivity(), Android.R.style.Theme_Dialog);
        dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
        dialog.setContentView(R.layout.dlg_dismiss);
        dialog.setCanceledOnTouchOutside(true);

        Button btnReopenId = (Button) dialog.findViewById(R.id.btnReopenId);
        Button btnCancelId = (Button) dialog.findViewById(R.id.btnCancelId);

        btnReopenId.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View v) {



            }
        });


        btnCancelId.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View v) {



            }
        });
        dialog.setCanceledOnTouchOutside(false);
        dialog.getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_STATE_ALWAYS_HIDDEN);
        dialog.getWindow().setLayout(LayoutParams.MATCH_PARENT,LayoutParams.WRAP_CONTENT);
        dialog.show();

    }

xmlコード：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    Android:background="@Android:color/white"
    Android:orientation="vertical" >

    <TableLayout
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content" >

        <TableRow
            Android:id="@+id/tableRow1"
            Android:layout_width="match_parent"
            Android:layout_height="wrap_content"
            Android:layout_marginTop="20dp"
            Android:gravity="center" >

            <TextView
                Android:id="@+id/textView1"
                Android:layout_width="wrap_content"
                Android:layout_height="wrap_content"
                Android:gravity="center"
                Android:text="&quot;I WOULD LIKE TO DISMISS THE VENDOR&quot;"
                Android:textColor="@color/col_dlg_blue_light"
                Android:textSize="14sp"
                Android:textStyle="bold" />
        </TableRow>

        <TableRow
            Android:id="@+id/tableRow2"
            Android:layout_width="match_parent"
            Android:layout_height="wrap_content"
            Android:layout_marginTop="5dp"
            Android:gravity="center" >

            <TextView
                Android:id="@+id/textView2"
                Android:layout_width="wrap_content"
                Android:layout_height="wrap_content"
                Android:gravity="center"
                Android:text="BECAUSE"
                Android:textColor="@Android:color/black"
                Android:textStyle="bold" />
        </TableRow>



        <TableRow
            Android:id="@+id/tableRow4"
            Android:layout_width="match_parent"
            Android:layout_height="wrap_content" >

            <Button
                Android:id="@+id/btnReopenId"
                Android:layout_width="0dp"
                Android:layout_height="wrap_content"
                Android:layout_weight="1"
                Android:background="@color/col_dlg_green_light"
                Android:text="REOPEN"
                Android:padding="5dp"
                Android:textSize="14sp"
                Android:textColor="@Android:color/white"
                Android:textStyle="bold" />

            <Button
                Android:id="@+id/btnCancelId"
                Android:layout_width="0dp"
                Android:layout_height="wrap_content"
                Android:layout_weight="1"
                Android:background="@color/col_dlg_pink_light"
                Android:text="CANCEL"
                Android:padding="5dp"
                Android:textSize="14sp"
                Android:textColor="@Android:color/white"
                Android:textStyle="bold" />
        </TableRow>
    </TableLayout>

</LinearLayout>
androidandroid-dialog
83
Devrath

Drawableにxmlを作成します（dialog_bg.xmlなど）

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:Android="http://schemas.Android.com/apk/res/Android">
    <solid
        Android:color="@color/white"/>
    <corners
        Android:radius="30dp" />
    <padding
        Android:left="10dp"
        Android:top="10dp"
        Android:right="10dp"
        Android:bottom="10dp" />
</shape>

レイアウトxmlの背景として設定します

Android:background="@drawable/dialog_bg"

Androidはダイアログレイアウトをルートビュー内に配置し、カスタムレイアウトの角を非表示にするため、ダイアログのルートビューの背景を透明に設定します。

dialog.getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));
245
Koma Yip

以下を行う必要があります。

  • ダイアログの背景に角の丸い背景を作成します。

    <?xml version="1.0" encoding="utf-8"?>
<shape xmlns:Android="http://schemas.Android.com/apk/res/Android"
Android:shape="rectangle" >

    <solid Android:color="#fff" />

    <corners
        Android:bottomLeftRadius="8dp"
        Android:bottomRightRadius="8dp"
        Android:topLeftRadius="8dp"
        Android:topRightRadius="8dp" />

</shape>

  • これで、ルートレイアウトのDialogのXMLファイルで、必要なマージンでその背景を使用します。

    Android:layout_marginLeft="20dip"
Android:layout_marginRight="20dip"
Android:background="@drawable/dialog_background"

  • 最後にJava部分でこれを行う必要があります：

    dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
dialog.setContentView(layoutResId);
View v = getWindow().getDecorView();
v.setBackgroundResource(Android.R.color.transparent);

これは私にとって完璧に機能します。

19
SMR

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

これは私のために働く

10
Gabriel Ribeiro Silva

dimen.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <integer name="weight">1</integer>

    <dimen name="dialog_top_radius">21dp</dimen>

    <dimen name="textview_dialog_head_min_height">50dp</dimen>
    <dimen name="textview_dialog_drawable_padding">5dp</dimen>

    <dimen name="button_dialog_layout_margin">3dp</dimen>


</resources>

styles.xml

<style name="TextView.Dialog">
        <item name="Android:paddingLeft">@dimen/dimen_size</item>
        <item name="Android:paddingRight">@dimen/dimen_size</item>
        <item name="Android:gravity">center_vertical</item>
        <item name="Android:textColor">@color/black</item>
    </style>

    <style name="TextView.Dialog.Head">
        <item name="Android:minHeight">@dimen/textview_dialog_head_min_height</item>
        <item name="Android:textColor">@color/white</item>
        <item name="Android:background">@drawable/dialog_title_style</item>
        <item name="Android:drawablePadding">@dimen/textview_dialog_drawable_padding</item>
    </style>

    <style name="TextView.Dialog.Text">
        <item name="Android:textAppearance">@style/Font.Medium.16</item>
    </style>

    <style name="Button" parent="Base.Widget.AppCompat.Button">
        <item name="Android:layout_height">@dimen/button_min_height</item>
        <item name="Android:layout_width">match_parent</item>
        <item name="Android:textColor">@color/white</item>
        <item name="Android:gravity">center</item>
        <item name="Android:textAppearance">@style/Font.Medium.20</item>
    </style>

 <style name="Button.Dialog">
        <item name="Android:layout_weight">@integer/weight</item>
        <item name="Android:layout_margin">@dimen/button_dialog_layout_margin</item>
    </style>

    <style name="Button.Dialog.Middle">
        <item name="Android:background">@drawable/button_primary_selector</item>
    </style>

dialog_title_style.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:shape="rectangle">

    <gradient
        Android:angle="270"
        Android:endColor="@color/primaryDark"
        Android:startColor="@color/primaryDark" />

    <corners
        Android:topLeftRadius="@dimen/dialog_top_radius"
        Android:topRightRadius="@dimen/dialog_top_radius" />

</shape>

dialog_background.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:Android="http://schemas.Android.com/apk/res/Android">
    <solid Android:color="@color/backgroundDialog" />
    <corners
        Android:topLeftRadius="@dimen/dialog_top_radius"
        Android:topRightRadius="@dimen/dialog_top_radius" />
    <padding />
</shape>

dialog_one_button.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    Android:background="@drawable/dailog_background"
    Android:orientation="vertical">

    <TextView
        Android:id="@+id/dialogOneButtonTitle"
        style="@style/TextView.Dialog.Head"
        Android:text="Process Completed" />

    <LinearLayout
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content"
        Android:layout_marginBottom="16dp"
        Android:layout_marginLeft="16dp"
        Android:layout_marginRight="16dp"
        Android:orientation="vertical">

        <TextView
            Android:id="@+id/dialogOneButtonText"
            style="@style/TextView.Dialog.Text"
            Android:text="Return the main menu" />

        <LinearLayout
            Android:layout_width="match_parent"
            Android:layout_height="wrap_content"
            Android:orientation="horizontal">

            <Button
                Android:id="@+id/dialogOneButtonOkButton"
                style="@style/Button.Dialog.Middle"
                Android:text="Ok" />

        </LinearLayout>

    </LinearLayout>

</LinearLayout>

OneButtonDialog.Java

package com.example.sametoztoprak.concept.dialogs;

import Android.app.Dialog;
import Android.graphics.Color;
import Android.graphics.drawable.ColorDrawable;
import Android.os.Bundle;
import Android.support.v7.app.AppCompatActivity;
import Android.view.View;
import Android.view.Window;
import Android.widget.Button;
import Android.widget.TextView;

import com.example.sametoztoprak.concept.R;
import com.example.sametoztoprak.concept.models.DialogFields;

/**
 * Created by sametoztoprak on 26/09/2017.
 */

public class OneButtonDialog extends Dialog implements View.OnClickListener {

    private static OneButtonDialog oneButtonDialog;
    private static DialogFields dialogFields;

    private Button dialogOneButtonOkButton;
    private TextView dialogOneButtonText;
    private TextView dialogOneButtonTitle;

    public OneButtonDialog(AppCompatActivity activity) {
        super(activity);
    }

    public static OneButtonDialog getInstance(AppCompatActivity activity, DialogFields dialogFields) {
        OneButtonDialog.dialogFields = dialogFields;
        return oneButtonDialog = (oneButtonDialog == null) ? new OneButtonDialog(activity) : oneButtonDialog;
    }

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        setContentView(R.layout.dialog_one_button);
        getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));

        dialogOneButtonTitle = (TextView) findViewById(R.id.dialogOneButtonTitle);
        dialogOneButtonText = (TextView) findViewById(R.id.dialogOneButtonText);
        dialogOneButtonOkButton = (Button) findViewById(R.id.dialogOneButtonOkButton);

        dialogOneButtonOkButton.setOnClickListener(this);
    }

    @Override
    protected void onStart() {
        super.onStart();
        dialogOneButtonTitle.setText(dialogFields.getTitle());
        dialogOneButtonText.setText(dialogFields.getText());
        dialogOneButtonOkButton.setText(dialogFields.getOneButton());
    }

    @Override
    public void onClick(View v) {
        switch (v.getId()) {
            case R.id.dialogOneButtonOkButton:

                break;
            default:
                break;
        }
        dismiss();
    }
}

enter image description here

8
Samet öztoprak

背景の形をそのまま使用できます

<shape xmlns:Android="http://schemas.Android.com/apk/res/Android"
Android:shape="rectangle">
<solid Android:color="@Android:color/transparent"/>
<corners Android:radius="10dp" />
<padding Android:left="10dp" Android:right="10dp"/>
</shape>

詳細については this をご覧ください。

4
Sanjeet A

背景のドローアブルを持たずに新しい方法を作りました。親としてcardviewを持たせ、それにapp:cardCornerRadius="20dp"を与え、それをJavaクラスdialog.getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));に与えます

それを作る別の方法です

2
Sattar

ダイアログのcorner radiusを制御し、elevation shadowを保持する場合の完全なソリューションを次に示します。

ダイアログ：

class OptionsDialog: DialogFragment() {

override fun onCreateView(inflater: LayoutInflater, container: ViewGroup, savedInstanceState: Bundle?): View {
    dialog?.window?.setBackgroundDrawable(ColorDrawable(Color.TRANSPARENT))
    return inflater.inflate(R.layout.dialog_options, container)
}

}

dialog_options.xmlレイアウト：

<FrameLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
xmlns:app="http://schemas.Android.com/apk/res-auto"
Android:layout_width="wrap_content"
Android:layout_height="wrap_content">

<androidx.cardview.widget.CardView
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content"
    Android:layout_margin="40dp"
    app:cardElevation="20dp"
    app:cardCornerRadius="12dp">

    <androidx.constraintlayout.widget.ConstraintLayout
        id="@+id/actual_content_goes_here"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content">
    </androidx.constraintlayout.widget.ConstraintLayout>

</androidx.cardview.widget.CardView>
</FrameLayout>

重要なのは、CardViewを別のViewGroup（ここではFrameLayout）でラップし、マージンを設定して標高シャドウ用のスペースを作成することです。

2
laszlo

最も簡単な方法は、から使用することです

CardViewとそのカード：cardCornerRadius

<?xml version="1.0" encoding="utf-8"?>
<Android.support.v7.widget.CardView 
 xmlns:Android="http://schemas.Android.com/apk/res/Android"
 xmlns:card="http://schemas.Android.com/apk/res-auto"
 Android:orientation="vertical"
 Android:id="@+id/cardlist_item"
 Android:layout_width="match_parent"
 Android:layout_height="130dp"
 card:cardCornerRadius="40dp"
 Android:layout_marginLeft="8dp"
 Android:layout_marginRight="8dp"
 Android:layout_marginTop="5dp"
 Android:layout_marginBottom="5dp"
Android:background="@color/white"
>

  <RelativeLayout
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    Android:layout_margin="12sp"
    Android:orientation="vertical"
    Android:weightSum="1"

     >

   //whatever your dialog contains


     </RelativeLayout>





</Android.support.v7.widget.CardView>

そして、ダイアログを作成するとき

dialog.getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));
2
behrad

設定

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

ダイアログが影を落とさないようにします。

解決策は使用することです

dialog.getWindow().setBackgroundDrawableResource(R.drawable.dialog_rounded_background);

どこですかR.drawable.dialog_rounded_background

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:Android="http://schemas.Android.com/apk/res/Android" >
    <item>
        <shape Android:shape="rectangle" Android:padding="10dp">
            <solid
                Android:color="@color/dialog_bg_color"/>
            <corners
                Android:radius="30dp" />
        </shape>
    </item>

</layer-list>
0
Zoran

特にダイアログにナビゲートするためにナビゲーションアーキテクチャコンポーネントアクションを使用している場合に、XMLで何かをするのが好きな人にとって

次を使用できます。

<style name="DialogStyle" parent="ThemeOverlay.MaterialComponents.Dialog.Alert">

    <!-- dialog_background is drawable shape with corner radius -->
    <item name="Android:background">@drawable/dialog_background</item>

    <item name="Android:windowBackground">@Android:color/transparent</item>
</style>
0
user158