碼農日常-『Android studio』AlertDialog對話視窗 @ 碼農日常大小事

嗨～各位好

雖然本邊緣人老是在和自己對話

不過能秉著做筆記的精神來...做筆記(?)

最近退伍後開始上班了

一轉眼就過了三個月

接著便會記錄一些上班後遇到的一些用到的功能

那就開始吧

今天要用到的功能是AlertDialog(對話窗格)的各種用法

在各種形況下都會遇到使用AlertDialog

像是基本的通知..到功能選擇

甚至是當作簡易的從使用者取得資料的窗格使用(例如帳號密碼等)

都非常地常見

在這邊將演示四種AlertDialog的用法

簡單一下敘述今天演示的四種功能

1.一般的AlertDialog，不論按下哪一個按鈕選項方格都會自動消失，但可限制返回鍵

2.延伸型Dialog，按下按鈕可設定方格不消失，並且可鎖定灰色區域及返回鍵

3.自定義View型Dialog，並可自由使用裡面的元件

4.自定義Dialog所有的View(含按鈕)，並且在Dialog上再放一個Dialog

好的，開始。

GitHub在此:

https://github.com/thumbb13555/AlertDialogExample

一般型的AlertDialog

此對話盒是最基本型的對話盒

基本大致如下:

AlertDialog.Builder alertDialog = 
     new AlertDialog.Builder(MainActivity.this);
        alertDialog.setTitle("這是標題");
        alertDialog.setMessage("文字在此");
        alertDialog.setPositiveButton("確定", new DialogInterface.OnClickListener() {
            @Override
            public void onClick(DialogInterface dialog, int which) {
                Toast.makeText(getBaseContext(),"確定",Toast.LENGTH_SHORT).show();
            }
        });
        alertDialog.setNegativeButton("中立",(dialog, which) -> {
            setToast("中立");
        });
        alertDialog.setNeutralButton("取消",(dialog, which) -> {
            setToast("取消");
        });
        alertDialog.setCancelable(false);
        alertDialog.show();

(基本上全部複製就可以直接用囉！)

第一行的紅色是確立建立起對話盒

AlertDialog.Builder alertDialog = new AlertDialog.Builder(MainActivity.this);

然後要顯示對話盒則記得要在最後加入.show()喔！

alertDialog.show();

因為程式是順序讀取，因此沒加入的話便會不顯示

此外，假設show寫錯了地方，雖然不會造成崩潰，但是會少顯示寫在show後面的東西

要特別注意

而alertDialog常用的方法有以下

1..setTitle() 設置標題

2.setMessage 設置內容

3.setPositiveButton 設置最右邊按鈕

4.setNegativeButton 設置中間按鈕

5.setNeutralButton 設置最左邊按鈕

此外alertDialog還有一個方法就是

.setCeneclable()方法

傳入值為true或false

該方法可以設置是否接受返回鍵使用，但是很遺憾這種alertDialog無法設置無法點擊灰色部分

還有就是一但點選了任何一個按鈕，對話盒都會消失

以上這些方法肯定無法滿足饑渴的你們Ψ(｀∀´#)ﾉ

因此有了以下第二種設計

需手動關閉對話盒的方法

這邊的功能新增了:在按下"確定"時不讓對話盒消失，但是顯示回傳訊息

以下是這種Dialog的程式

AlertDialog.Builder alertDialog = new AlertDialog.Builder(MainActivity.this);
        alertDialog.setTitle("這是標題");
        alertDialog.setMessage("文字在此");
        alertDialog.setPositiveButton("確定",((dialog, which) -> {}));
        alertDialog.setNegativeButton("中立",((dialog, which) -> {}));
        alertDialog.setNeutralButton("取消",((dialog, which) -> {}));
        AlertDialog dialog = alertDialog.create();
        dialog.show();
        dialog.getButton(AlertDialog.BUTTON_POSITIVE).setOnClickListener((v -> {
            setToast("按了確定但是不給你消失");
        }));
        dialog.getButton(AlertDialog.BUTTON_NEGATIVE).setOnClickListener((v ->{
            setToast("中立");
            dialog.dismiss();
        }));
        dialog.getButton(AlertDialog.BUTTON_NEUTRAL).setOnClickListener((v -> {
            setToast("取消");
            dialog.dismiss();
        }));

        dialog.setCancelable(false);
        dialog.setCanceledOnTouchOutside(false);

一樣要先將對話盒建立起來

按鈕設置也要記得設置，但是裡面可以不用寫任何東西

在設完該設置完的條件後，請加入：

AlertDialog dialog = alertDialog.create();

dialog.show();

這兩行

之後聰明的你們肯定會加入按鈕功能的

但這時候如果加入在show之前的話將無法完成點選後不消失的功能

因此必須加入dialog屬性的其中個方法

dialog.getButton

然後將方法延伸

dialog.getButton(AlertDialog.BUTTON_POSITIVE).setOnClick...

當然，在括弧內的順序要對好，否則會出現牛頭不對馬嘴的情形

最後，加入以下方法

dialog.setCancelable(false); //禁用返回

dialog.setCanceledOnTouchOutside(false);//點擊灰色部分不消失

這樣就可以鎖定返回以及豁色部分囉

最後，因為該方法需要手動將對話盒消失

故必須在條件後加入

dialog.dismiss();

才能讓對話盒消失喔

接著在第三個範例中會加入設置自定義View的方法

以下是第三個範例

這個範例中我先在外部加了一個Layout

詳細可查看Ｇit內的檔案

https://github.com/thumbb13555/AlertDialogExample/blob/master/app/src/main/res/layout/set_custom_dialog_layout.xml

然後把這個Layout設置好後，使用

getLayoutInflater().inflate這個方法將Layout加入其中

程式如下

AlertDialog.Builder alertDialog = new AlertDialog.Builder(MainActivity.this);
        View vvvvvvvv = getLayoutInflater().inflate(R.layout.set_custom_dialog_layout,null);
        alertDialog.setTitle("這是標題");
        alertDialog.setView(v);
        alertDialog.setPositiveButton("確定",(((dialog, which) -> {})));

        AlertDialog dialog = alertDialog.create();
        dialog.show();
        dialog.getButton(AlertDialog.BUTTON_POSITIVE).setOnClickListener((v1 -> {
            dialog.dismiss();
        }));


        TextView tvDisplay = vvvvvvvv.findViewById(R.id.textView);
        Switch swPlay = vvvvvvvv.findViewById(R.id.switch1);
        dialog.setCanceledOnTouchOutside(false);
        swPlay.setChecked(status?true:false);
        tvDisplay.setText(swPlay.isChecked()?"開":"關");
        /*此處註解程式已用lambda代替，請參考
        swPlay.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
            @Override
            public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {

            }
        });*/
        swPlay.setOnCheckedChangeListener((buttonView, isChecked) -> {
            tvDisplay.setText(isChecked?"開":"關");
            status = (isChecked?true:false);
            /*對懶人寫法不熟的請參考註解
            if (isChecked == true){
                tvDisplay.setText("開");
            }else {
                tvDisplay.setText("關");
            }
            */
        });

注意，在設置完Layout後你還不能滿意地看著你的程式說

恩～甚好～(･ω･)b

因為你還沒將你的View告訴你的alertDialog

因此在此呼叫

alertDialog.setView()的方法

並且在括弧內輸入你的View(就是Layout檔案)，就可以成功顯示囉

在這個示範中另外還有控制這些view裡的元件

這時候要記得findViewById的前面加入一個 view.find....

這樣才找得到元件喔

備註:為了客倌的方便，我取了很奇怪的名字以為辨別(Ｇit內沒有)

下面那邊則是控件的使用

深藍色的status變數是我有在全域變數中宣告過的Boolean方法

複製上去後記得加入喔

Boolean status = false;

此外，swPlay.isChecked()?"開":"關"

是if...else的懶人寫法

不熟的朋友建議去搜尋了解喔～(・∀・)

最後是大幅度客製化的AlertDialog

除標題可加入色彩，還自訂標題、按鈕、控件等

最後在功能上加入按下後將在AlertDialog再加上一個AlertDialog

示範如下

客製化的部分其實就是在程式中不要去使用內建的方法

轉為什麼都自己設計就是了

綠色的Title是放了個Layout後並把背景設為綠色

裡面的文字也是用TextView寫的

兩個按鈕則是放入按鈕，並把背景設為白

然後加入按鈕監聽器的方法完成

其實搞懂了就意外的超級單純

放上程式吧

AlertDialog.Builder alertDialog = new AlertDialog.Builder(MainActivity.this);
        View v = getLayoutInflater().inflate(R.layout.set_custom_dialog_layout_with_button,null);
        alertDialog.setView(v);
        Button btOK = v.findViewById(R.id.button_ok);
        Button btC  = v.findViewById(R.id.buttonCancel);
        EditText editText = v.findViewById(R.id.ededed);
        AlertDialog dialog = alertDialog.create();
        dialog.show();
        btOK.setOnClickListener((v1 -> {
            AlertDialog.Builder twoDialog = new AlertDialog.Builder(MainActivity.this);
            twoDialog.setTitle("這是疊上去的AlertDialog");
            twoDialog.setPositiveButton("瞭解",((dialog1, which) -> {}));
            twoDialog.show();
            }));
        btC.setOnClickListener((v1 -> {setToast(editText.getText().toString());dialog.dismiss();}));

前面的東西都跟上面所教的一樣，就不再贅述

在button的功能內，紅字的部分是在裡面放入一個一般的AlertDialog

其實就是真的意外的超級單純XD

好吧對不起我真的不知道要介紹什麼了(´д｀)

有什麼問題就留言吧

反正我也是個菜逼八，不要客氣喔ლↂ‿‿ↂლ

最後，為求方便，我大部分的範例都用lambda語法撰寫

如果不會的朋友們，建議可以去學一下如何使用喔～

真的很方便的（´υ｀）

那整理一下四個方法放在這邊做比較

一般AlertDialog

AlertDialog.Builder alertDialog = 
     new AlertDialog.Builder(MainActivity.this);
        alertDialog.setTitle("這是標題");
        alertDialog.setMessage("文字在此");
        alertDialog.setPositiveButton("確定", new DialogInterface.OnClickListener() {
            @Override
            public void onClick(DialogInterface dialog, int which) {
                Toast.makeText(getBaseContext(),"確定",Toast.LENGTH_SHORT).show();
            }
        });
        alertDialog.setNegativeButton("中立",(dialog, which) -> {
            setToast("中立");
        });
        alertDialog.setNeutralButton("取消",(dialog, which) -> {
            setToast("取消");
        });
        alertDialog.setCancelable(false);
        alertDialog.show();

可自訂消失與否的Dialog

AlertDialog.Builder alertDialog = new AlertDialog.Builder(MainActivity.this);
        alertDialog.setTitle("這是標題");
        alertDialog.setMessage("文字在此");
        alertDialog.setPositiveButton("確定",((dialog, which) -> {}));
        alertDialog.setNegativeButton("中立",((dialog, which) -> {}));
        alertDialog.setNeutralButton("取消",((dialog, which) -> {}));
        AlertDialog dialog = alertDialog.create();
        dialog.show();
        dialog.getButton(AlertDialog.BUTTON_POSITIVE).setOnClickListener((v -> {
            setToast("按了確定但是不給你消失");
        }));
        dialog.getButton(AlertDialog.BUTTON_NEGATIVE).setOnClickListener((v ->{
            setToast("中立");
            dialog.dismiss();
        }));
        dialog.getButton(AlertDialog.BUTTON_NEUTRAL).setOnClickListener((v -> {
            setToast("取消");
            dialog.dismiss();
        }));

        dialog.setCancelable(false);
        dialog.setCanceledOnTouchOutside(false);

可自訂Layout的lLertDialog

AlertDialog.Builder alertDialog = new AlertDialog.Builder(MainActivity.this);
        View vvvvvvvv = getLayoutInflater().inflate(R.layout.set_custom_dialog_layout,null);
        alertDialog.setTitle("這是標題");
        alertDialog.setView(v);
        alertDialog.setPositiveButton("確定",(((dialog, which) -> {})));

        AlertDialog dialog = alertDialog.create();
        dialog.show();
        dialog.getButton(AlertDialog.BUTTON_POSITIVE).setOnClickListener((v1 -> {
            dialog.dismiss();
        }));


        TextView tvDisplay = vvvvvvvv.findViewById(R.id.textView);
        Switch swPlay = vvvvvvvv.findViewById(R.id.switch1);
        dialog.setCanceledOnTouchOutside(false);
        swPlay.setChecked(status?true:false);
        tvDisplay.setText(swPlay.isChecked()?"開":"關");
        /*此處註解程式已用lambda代替，請參考
        swPlay.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
            @Override
            public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {

            }
        });*/
        swPlay.setOnCheckedChangeListener((buttonView, isChecked) -> {
            tvDisplay.setText(isChecked?"開":"關");
            status = (isChecked?true:false);
            /*對懶人寫法不熟的請參考註解
            if (isChecked == true){
                tvDisplay.setText("開");
            }else {
                tvDisplay.setText("關");
            }
            */
        });

完全自訂的AlertDialog，並且可在Dialog上再疊一個Dialog

AlertDialog.Builder alertDialog = new AlertDialog.Builder(MainActivity.this);
        View v = getLayoutInflater().inflate(R.layout.set_custom_dialog_layout_with_button,null);
        alertDialog.setView(v);
        Button btOK = v.findViewById(R.id.button_ok);
        Button btC  = v.findViewById(R.id.buttonCancel);
        EditText editText = v.findViewById(R.id.ededed);
        AlertDialog dialog = alertDialog.create();
        dialog.show();
        btOK.setOnClickListener((v1 -> {
            AlertDialog.Builder twoDialog = new AlertDialog.Builder(MainActivity.this);
            twoDialog.setTitle("這是疊上去的AlertDialog");
            twoDialog.setPositiveButton("瞭解",((dialog1, which) -> {}));
            twoDialog.show();
            }));
        btC.setOnClickListener((v1 -> {setToast(editText.getText().toString());dialog.dismiss();}));

好了，那今天的筆記就寫到這

希望對各位有幫助！

加油囉各位:)

TK2

碼農日常

碼農日常大小事

碼農日常發表在痞客邦留言(3) 人氣()

E-mail轉寄

«	四月 2024					»
日	一	二	三	四	五	六
	1	2	3	4	5	6
7	8	9	10	11	12	13
14	15	16	17	18	19	20
21	22	23	24	25	26	27
28	29	30

碼農日常大小事

認真打好每一篇文章，認真分享程序猿每一件大小事；走過晃過依然滿載而歸

Hello