Androidのダイアログライブラリ、material-dialogsを触ってみた。
フラグメント
フラグメントの登場でダイアログの実装が面倒くさい。もうライブラリでよいね。
android { ~ 省略 ~ buildTypes { release { minifyEnabled false proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro' } } repositories { maven { url "https://jitpack.io" } } } dependencies { ~ 省略 ~ compile('com.github.afollestad.material-dialogs:commons:0.8.5.0@aar') { transitive = true } }
ベーシック
@Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); new MaterialDialog.Builder(this) .title("タイトル") .content("内容") .positiveText("はい") .negativeText("いいえ") .show(); }
アイコンをつける
new MaterialDialog.Builder(this) .title("タイトル") .content("内容") .positiveText("はい") .iconRes(R.mipmap.ic_launcher) .limitIconToDefaultSize() // limits the displayed icon size to 48dp .show();
クリックイベント
new AlertDialogWrapper.Builder(this) .setTitle("タイトル") .setMessage("内容") .setNegativeButton("はい", new DialogInterface.OnClickListener() { @Override public void onClick(DialogInterface dialog, int which) { Toast.makeText(getApplication(), "クリックイベント", Toast.LENGTH_LONG).show(); dialog.dismiss(); } }).show();
はい、いいえの選択肢がが長文になると、縦並びで表示される
new MaterialDialog.Builder(this) .title("タイトル") .content("内容") .positiveText("はい、わかったけどね。ちょっと長いけど対応してるから大丈夫") .negativeText("いいえ、ちょっと長いけど対応してるから大丈夫") .show();
3択
new MaterialDialog.Builder(this) .title("タイトル") .content("内容") .positiveText("はい") .negativeText("いいえ") .neutralText("真ん中") .show();
リスト形式
String[] list = {"Apple", "Lemon", "Orange", "Strawberry"}; new MaterialDialog.Builder(this) .title("タイトル") .items(list) .itemsCallback(new MaterialDialog.ListCallback() { @Override public void onSelection(MaterialDialog dialog, View view, int which, CharSequence text) { Toast.makeText(getApplication(), text, Toast.LENGTH_SHORT).show(); } }) .show();
複数選択できるリスト
String[] list = {"Apple", "Lemon", "Orange", "Strawberry"}; new MaterialDialog.Builder(this) .title("タイトル") .items(list) .itemsCallbackMultiChoice(null, new MaterialDialog.ListCallbackMultiChoice() { @Override public boolean onSelection(MaterialDialog dialog, Integer[] which, CharSequence[] text) { Toast.makeText(MainActivity.this, String.valueOf(which.length) + "個も選択したの?" , Toast.LENGTH_SHORT).show(); for (int i = 0; i < which.length; i++) { Toast.makeText(MainActivity.this, text[i], Toast.LENGTH_SHORT).show(); } return true; } }) .positiveText("確定") .show();
指定回数を越えてチェックしたら、アラートを表示する
String[] list = {"Apple", "Lemon", "Orange", "Strawberry"}; //標準でアップルを選択 int apple = 0; new MaterialDialog.Builder(this) .title("2つまで選んでね") .items(list) .itemsCallbackMultiChoice(new Integer[]{apple}, new MaterialDialog.ListCallbackMultiChoice() { @Override public boolean onSelection(MaterialDialog dialog, Integer[] which, CharSequence[] text) { boolean allowSelection = which.length <= 2; // limit selection to 2, the new selection is included in the which array if (!allowSelection) { Toast.makeText(MainActivity.this, "だめじゃん", Toast.LENGTH_SHORT).show(); } return allowSelection; } }) .positiveText("キャンセル") .alwaysCallMultiChoiceCallback() // the callback will always be called, to check if selection is still allowed .show();
リストメニューに画像を追加するカスタマイズ
final MaterialSimpleListAdapter adapter = new MaterialSimpleListAdapter(this); adapter.add(new MaterialSimpleListItem.Builder(this) .content("username@gmail.com") .icon(R.mipmap.ic_launcher) .backgroundColor(Color.WHITE) .build()); adapter.add(new MaterialSimpleListItem.Builder(this) .content("user02@gmail.com") .icon(R.mipmap.ic_launcher) .backgroundColor(Color.WHITE) .build()); adapter.add(new MaterialSimpleListItem.Builder(this) .content("アカウント追加") .icon(R.mipmap.ic_launcher) .iconPaddingDp(8) .build()); new MaterialDialog.Builder(this) .title("バックアップ") .adapter(adapter, new MaterialDialog.ListCallback() { @Override public void onSelection(MaterialDialog dialog, View itemView, int which, CharSequence text) { MaterialSimpleListItem item = adapter.getItem(which); Toast.makeText(MainActivity.this, item.toString(), Toast.LENGTH_SHORT).show(); } }) .show();
パスワードの入力を表示
new MaterialDialog.Builder(this) .title("パスワードを入力") .content("内容") .inputType(InputType.TYPE_CLASS_TEXT | InputType.TYPE_TEXT_VARIATION_PASSWORD) .input("ヒント", "", new MaterialDialog.InputCallback() { @Override public void onInput(MaterialDialog dialog, CharSequence input) { // Do something Toast.makeText(MainActivity.this, input, Toast.LENGTH_SHORT).show(); } }).show();
入力文字数の制限つき
new MaterialDialog.Builder(this) .title("タイトル") .inputRangeRes(2, 20, R.color.md_divider_black) .input(null, null, new MaterialDialog.InputCallback() { @Override public void onInput(MaterialDialog dialog, CharSequence input) { Toast.makeText(MainActivity.this, input, Toast.LENGTH_SHORT).show(); } }).show();
テーマを変える
new MaterialDialog.Builder(this) .content("Hi") .title("タイトル") .positiveText("はい") .negativeText("いいえ") .theme(Theme.DARK) .show();
カスタムビュー
EditText passwordInput; CheckBox checkbox; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); MaterialDialog dialog = new MaterialDialog.Builder(this) .title("タイトル") .customView(R.layout.dialog_customview, true) .positiveText("はい") .negativeText("いいえ") .onPositive(new MaterialDialog.SingleButtonCallback() { @Override public void onClick(@NonNull MaterialDialog dialog, @NonNull DialogAction which) { Toast.makeText(MainActivity.this, passwordInput.getText() + ":" + checkbox.isChecked(), Toast.LENGTH_SHORT).show(); } }).build(); dialog.show(); passwordInput = (EditText) dialog.getCustomView().findViewById(R.id.password); passwordInput.addTextChangedListener(new TextWatcher() { @Override public void beforeTextChanged(CharSequence s, int start, int count, int after) { } @Override public void onTextChanged(CharSequence s, int start, int before, int count) { } @Override public void afterTextChanged(Editable s) { } }); checkbox = (CheckBox) dialog.getCustomView().findViewById(R.id.showPassword); checkbox.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() { @Override public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) { Toast.makeText(MainActivity.this, String.valueOf(isChecked), Toast.LENGTH_SHORT).show(); } }); }
dialog_customview.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:orientation="vertical"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="ぼけ" android:textColor="#80000000" android:textSize="16dp" /> <EditText android:id="@+id/password" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginTop="4dp" android:inputType="textPassword" android:textColor="#000000" android:textSize="16dp" /> <CheckBox android:id="@+id/showPassword" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginTop="18dp" android:text="パスワード" android:textColor="#000000" android:textSize="16dp" /> </LinearLayout>