Android——最全的系統對話方塊(AlertDialog)詳解

Jetictors發表於2017-12-14

Android——最全的系統對話方塊(AlertDialog)詳解

在實際應用開發中,用到系統對話方塊中的情況幾乎是沒有的。按開發流程來說,UI工程師都會給出每一個彈窗的樣式,故而在實際開發中都是自定義彈窗的。 即使用到的地方不多,但是我們也是需要了解並且能熟練的運用它,下面為大家奉上各種系統對話方塊的實現。

目錄

Android——最全的系統對話方塊(AlertDialog)詳解

系統對話方塊的幾種型別與實現

在專案的實際開發中,用到的系統對話方塊幾乎是沒有的。原因大概包含以下幾點:

  • 樣式過於單一,不能滿足大部分實際專案中的需求。
  • 對話方塊的樣式會根據手機系統版本的不同而變化。不能達到統一的樣式。
  • 能實現的功能過於簡單。

在這裡先附上下面程式碼中出現文字的string.xml檔案。

<string name="dialog_normal_content">我是普通dialog</string>
<string name="dialog_normal_more_button_content">我是普通多按鈕dialog</string>
<string name="dialog_btn_confirm_text">確定</string>
<string name="dialog_btn_cancel_text">取消</string>
<string name="dialog_btn_neutral_text">忽略</string>
<string name="dialog_btn_confirm_hint_text">您點選了確定按鈕</string>
<string name="dialog_btn_cancel_hint_text">您點選了取消按鈕</string>
<string name="dialog_btn_neutral_hint_text">您點選了忽略按鈕</string>
複製程式碼

1、普通對話方塊

在實際專案開發中,此型別對話方塊中用到的地方要比其他型別的對話方塊多一些。但是考慮UI統一問題,也會很少用。

執行截圖:

Android——最全的系統對話方塊(AlertDialog)詳解

程式碼:

  private void showNormalDialog(){
    //建立dialog構造器
    AlertDialog.Builder normalDialog = new AlertDialog.Builder(this);
    //設定title
    normalDialog.setTitle(getString(R.string.dialog_normal_text));
    //設定icon
    normalDialog.setIcon(R.mipmap.ic_launcher_round);
    //設定內容
    normalDialog.setMessage(getString(R.string.dialog_normal_content));
    //設定按鈕
    normalDialog.setPositiveButton(getString(R.string.dialog_btn_confirm_text)
            , new DialogInterface.OnClickListener() {
        @Override
        public void onClick(DialogInterface dialog, int which) {
            Toast.makeText(DialogActivity.this,getString(R.string.dialog_btn_confirm_hint_text)
                    ,Toast.LENGTH_SHORT).show();
            dialog.dismiss();
        }
    });
    //建立並顯示
    normalDialog.create().show();
  }
複製程式碼

系統對話方塊都是支援鏈式呼叫的,舉例:

    new AlertDialog.Builder(this)
            .setTitle(getString(R.string.dialog_normal_text))
            .setIcon(R.mipmap.ic_launcher_round)
            .setMessage(getString(R.string.dialog_normal_content))
            .setPositiveButton(getString(R.string.dialog_btn_confirm_text)
                    , new DialogInterface.OnClickListener() {
                @Override
                public void onClick(DialogInterface dialog, int which) {
                    Toast.makeText(DialogActivity.this,getString(R.string.dialog_btn_confirm_hint_text)
                            ,Toast.LENGTH_SHORT).show();
                    dialog.dismiss();
                }
            })
            .create()
            .show();
複製程式碼

下面的程式碼都是可以用鏈式呼叫的,這裡就不展示了。

2、普通對話方塊(多按鈕)

在系統對話方塊中最多出現三個按鈕,即PositiveButton(確定)、NegativeButton(取消)、NeutralButton(忽略)。

執行截圖:

Android——最全的系統對話方塊(AlertDialog)詳解

程式碼:

  private void showNormalMoreButtonDialog(){
    AlertDialog.Builder normalMoreButtonDialog = new AlertDialog.Builder(this);
    normalMoreButtonDialog.setTitle(getString(R.string.dialog_normal_more_button_text));
    normalMoreButtonDialog.setIcon(R.mipmap.ic_launcher_round);
    normalMoreButtonDialog.setMessage(getString(R.string.dialog_normal_more_button_content));

    //設定按鈕
    normalMoreButtonDialog.setPositiveButton(getString(R.string.dialog_btn_confirm_text)
            , new DialogInterface.OnClickListener() {
                @Override
                public void onClick(DialogInterface dialog, int which) {
                    Toast.makeText(DialogActivity.this
                            ,getString(R.string.dialog_btn_confirm_hint_text),Toast.LENGTH_SHORT).show();
                    dialog.dismiss();
                }
            });
    normalMoreButtonDialog.setNegativeButton(getString(R.string.dialog_btn_cancel_text)
            , new DialogInterface.OnClickListener() {
                @Override
                public void onClick(DialogInterface dialog, int which) {
                    Toast.makeText(DialogActivity.this,
                            getString(R.string.dialog_btn_cancel_hint_text),Toast.LENGTH_SHORT).show();
                    dialog.dismiss();
                }
            });
    normalMoreButtonDialog.setNeutralButton(getString(R.string.dialog_btn_neutral_text)
            , new DialogInterface.OnClickListener() {
                @Override
                public void onClick(DialogInterface dialog, int which) {
                    Toast.makeText(DialogActivity.this,
                            getString(R.string.dialog_btn_neutral_hint_text),Toast.LENGTH_SHORT).show();
                    dialog.dismiss();
                }
            });

    normalMoreButtonDialog.create().show();
  }
複製程式碼

也可以用下面的實現方式,和上面的程式碼效果是一樣的。

  private void showNormalMoreButtonDialog(){
    DialogInterface.OnClickListener setListener = null;

    AlertDialog.Builder normalMoreButtonDialog = new AlertDialog.Builder(this);
    normalMoreButtonDialog.setTitle(getString(R.string.dialog_normal_more_button_text));
    normalMoreButtonDialog.setIcon(R.mipmap.ic_launcher_round);
    normalMoreButtonDialog.setMessage(getString(R.string.dialog_normal_more_button_content));
   
    setListener = new DialogInterface.OnClickListener() {
        @Override
        public void onClick(DialogInterface dialog, int which) {
            switch (which){
                case DialogInterface.BUTTON_POSITIVE:
                    Toast.makeText(DialogActivity.this,
                            getString(R.string.dialog_btn_confirm_hint_text),Toast.LENGTH_SHORT).show();
                    dialog.dismiss();
                    break;
                case DialogInterface.BUTTON_NEUTRAL:
                    Toast.makeText(DialogActivity.this
                            ,getString(R.string.dialog_btn_neutral_hint_text),Toast.LENGTH_SHORT).show();
                    dialog.dismiss();
                    break;
                case DialogInterface.BUTTON_NEGATIVE:
                    Toast.makeText(DialogActivity.this
                            ,getString(R.string.dialog_btn_cancel_hint_text),Toast.LENGTH_SHORT).show();
                    dialog.dismiss();
                    break;
            }
        }
    };
    normalMoreButtonDialog.setPositiveButton(getString(R.string.dialog_btn_confirm_text),setListener);
    normalMoreButtonDialog.setNegativeButton(getString(R.string.dialog_btn_cancel_text),setListener);
    normalMoreButtonDialog.setNeutralButton(getString(R.string.dialog_btn_neutral_text),setListener);

    normalMoreButtonDialog.create().show();
  }
複製程式碼

3、普通列表對話方塊

此種型別的對話方塊能實現簡單的列表。

執行截圖:

Android——最全的系統對話方塊(AlertDialog)詳解

程式碼:

  /**
   * 普通列表dialog
   */
  private void showListDialog(){
    final String listItems[] = new String[]{"listItems1","listItems2","listItems3",
            "listItems4","listItems5","listItems6"};

    AlertDialog.Builder listDialog = new AlertDialog.Builder(this);
    listDialog.setTitle(getString(R.string.dialog_list_text));
    listDialog.setIcon(R.mipmap.ic_launcher_round);

    /*
        設定item 不能用setMessage()
        用setItems
        items : listItems[] -> 列表項陣列
        listener -> 回撥介面
    */
    listDialog.setItems(listItems,new DialogInterface.OnClickListener() {
        @Override
        public void onClick(DialogInterface dialog, int which) {
            Toast.makeText(DialogActivity.this,listItems[which],Toast.LENGTH_SHORT).show();
        }
    });

    //設定按鈕
    listDialog.setPositiveButton(getString(R.string.dialog_btn_confirm_text)
            , new DialogInterface.OnClickListener() {
                @Override
                public void onClick(DialogInterface dialog, int which) {
                    dialog.dismiss();
                }
            });

    listDialog.create().show();
  }
複製程式碼

4、單選對話方塊

執行截圖:

Android——最全的系統對話方塊(AlertDialog)詳解

程式碼:

  private void showRadioDialog(){
    final String radioItems[] = new String[]{"radioItem1","radioItem1","radioItem1","radioItem1"};

    AlertDialog.Builder radioDialog = new AlertDialog.Builder(this);
    radioDialog.setTitle(getString(R.string.dialog_radio_text));
    radioDialog.setIcon(R.mipmap.ic_launcher_round);

    /*
        設定item 不能用setMessage()
        用setSingleChoiceItems
        items : radioItems[] -> 單選選項陣列
        checkItem : 0 -> 預設選中的item
        listener -> 回撥介面
    */
    radioDialog.setSingleChoiceItems(radioItems, 0, new DialogInterface.OnClickListener() {
        @Override
        public void onClick(DialogInterface dialog, int which) {
            Toast.makeText(DialogActivity.this,radioItems[which],Toast.LENGTH_SHORT).show();
        }
    });

    //設定按鈕
    radioDialog.setPositiveButton(getString(R.string.dialog_btn_confirm_text)
            , new DialogInterface.OnClickListener() {
                @Override
                public void onClick(DialogInterface dialog, int which) {
                    dialog.dismiss();
                }
            });

    radioDialog.create().show();
  }
複製程式碼

5、多選對話方塊

執行截圖:

Android——最全的系統對話方塊(AlertDialog)詳解

程式碼: private void showCheckBoxDialog(){

    final String checkBoxItems[] = new String[]{"checkBoxItems1","checkBoxItems2",
            "checkBoxItems3","checkBoxItems4"};
    final boolean isCheck[] = new boolean[]{false,true,true,false};

    AlertDialog.Builder checkBoxDialog = new AlertDialog.Builder(this);
    checkBoxDialog.setTitle(getString(R.string.dialog_check_box_text));
    checkBoxDialog.setIcon(R.mipmap.ic_launcher_round);

    /*
        設定item 不能用setMessage()
        用setMultiChoiceItems
        items : radioItems[] -> 多選選項陣列
        checkItems : isCheck[] -> 是否選中陣列
        listener -> 回撥介面
    */
    checkBoxDialog.setMultiChoiceItems(checkBoxItems, isCheck
            , new DialogInterface.OnMultiChoiceClickListener() {
        @Override
        public void onClick(DialogInterface dialog, int which, boolean isChecked) {
            if (isChecked){
                Toast.makeText(DialogActivity.this,
                        checkBoxItems[which] + "   選中",Toast.LENGTH_SHORT).show();
            }else {
                Toast.makeText(DialogActivity.this,
                        checkBoxItems[which] + "   未選中",Toast.LENGTH_SHORT).show();
            }
        }
    });

    //設定按鈕
    checkBoxDialog.setPositiveButton(getString(R.string.dialog_btn_confirm_text)
            , new DialogInterface.OnClickListener() {
                @Override
                public void onClick(DialogInterface dialog, int which) {
                    dialog.dismiss();
                }
            });

    checkBoxDialog.create().show();
  }
複製程式碼

6、帶輸入框的彈窗

執行截圖:

edit_dialog.png

程式碼: private void showEditDialog(){

    final EditText edit = new EditText(this);

    AlertDialog.Builder editDialog = new AlertDialog.Builder(this);
    editDialog.setTitle(getString(R.string.dialog_edit_text));
    editDialog.setIcon(R.mipmap.ic_launcher_round);

    //設定dialog佈局
    editDialog.setView(edit);

    //設定按鈕
    editDialog.setPositiveButton(getString(R.string.dialog_btn_confirm_text)
            , new DialogInterface.OnClickListener() {
                @Override
                public void onClick(DialogInterface dialog, int which) {
                    Toast.makeText(DialogActivity.this,
                            edit.getText().toString().trim(),Toast.LENGTH_SHORT).show();
                    dialog.dismiss();
                }
            });

    editDialog.create().show();
  }
複製程式碼

7、自定義佈局的對話方塊

此型別的對話方塊在實際專案開發中用到的地方比提示對話方塊用到的地方要多一些,不過在專案幾乎上都是自定義的對話方塊...

執行截圖:

layout_dialog.png

佈局檔案:custom_dialog_layout.xml

      <TextView
           android:id="@+id/dialog_text"
           android:layout_width="match_parent"
           android:layout_height="wrap_content"
           android:textSize="15sp"
           android:textColor="@color/colorPrimary"
           android:gravity="center"
           android:padding="12dp"/>

      <RelativeLayout
           android:layout_width="match_parent"
           android:layout_height="wrap_content">

           <ImageView
               android:layout_width="wrap_content"
               android:layout_height="wrap_content"
               android:src="@mipmap/ic_launcher"/>

          <Button
              android:id="@+id/dialog_btn_confirm"
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:textColor="@color/colorAccent"
              android:textSize="15sp"
              android:text="@string/dialog_btn_confirm_text"
              android:layout_centerHorizontal="true"/>

          <Button
              android:id="@+id/dialog_btn_cancel"
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:textColor="@color/colorAccent"
              android:textSize="15sp"
              android:text="@string/dialog_btn_cancel_text"
              android:layout_centerHorizontal="true"
              android:layout_alignParentRight="true"/>

      </RelativeLayout>

  </LinearLayout>
複製程式碼

程式碼:

  private void showLayoutDialog() {
    //載入佈局並初始化元件
    View dialogView = LayoutInflater.from(this).inflate(R.layout.custom_dialog_layout,null);
    TextView dialogText = (TextView) dialogView.findViewById(R.id.dialog_text);
    Button dialogBtnConfirm = (Button) dialogView.findViewById(R.id.dialog_btn_confirm);
    Button dialogBtnCancel = (Button) dialogView.findViewById(R.id.dialog_btn_cancel);

    final AlertDialog.Builder layoutDialog = new AlertDialog.Builder(this);
    layoutDialog.setTitle(getString(R.string.dialog_custom_layout_text));
    layoutDialog.setIcon(R.mipmap.ic_launcher_round);

    layoutDialog.setView(dialogView);

    //設定元件
    dialogText.setText("我是自定義layout的彈窗!!");
    dialogBtnConfirm .setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            Toast.makeText(DialogActivity.this,"我是自定義layout的彈窗!!",Toast.LENGTH_SHORT).show();
        }
    });
    dialogBtnConfirm .setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            layoutDialog.setOnDismissListener(new DialogInterface.OnDismissListener() {
                @Override
                public void onDismiss(DialogInterface dialog) {
                    dialog.dismiss();
                }
            });
        }
    });

    layoutDialog.create().show();
  }
複製程式碼

以上就是Android系統彈窗的幾種實現方式,幾乎涵蓋了能解決各種簡單需求。其中自定義佈局的方式奠定了自定義彈窗的基本實現。

尾語

可以看出上面的幾種實現方式都是通過AlertDialog類實現的。有興趣的可以看Android原始碼中的AlertDialog類實現。

相關文章