AlertDialogをレイアウトXMLでカスタマイズ

AlertDialogを使うと手軽にダイアログが作れる。
AlertDialogを最小の手間で最大限カスタマイズするには、どうやるのが最適なんだろうか。

最大限簡便に、最大限の自由度を得る

AlertDialogのカスタマイズにはいろいろな方法がある。メッセージやボタンの文言、アイコンなんかを変更するだけであればAlertDialogに用意されているメソッドが使える。

たとえば、図のようなログインダイアログを作ろうと思ったらどうすればよいか？

1. ダイアログの内容をレイアウトXMLで定義
2. AlertDialog.Builderでダイアログを構成

色々なやり方があるが、これが一番ミニマムな方法ではないかと思う。

レイアウトファイル

ボタンやタイトルバーなどの「ガワ」はダイアログボックス側で面倒を見てくれるので、中身だけ定義すればよい。

こんな感じ。

レイアウトファイルはこうだ。

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

    
        
    
            
    
            

                
            
        
        
    
            
    
            
        
    

ダイアログの構成

AlertDialog.Builderクラスのスタティックメソッドを使ってダイアログを構成する。

BuilderクラスのメソッドはすべてBuilderを返すようになっている。

ということは、ドットでどんどんつなげていくメソッドチェインの記法で書けるわけだ。

メソッドチェイン記法を嫌がる人もいるが、思いついた順にダラダラと追記していけばよいので、「ドット・スペース、えーと・・・」といった具合に、思いつきとEclipseのコード補完機能のみでコーディングしている僕のような人であれば、慣れると大変便利である。

クラスにまとめるとこうなる。

import android.app.Activity;
import android.app.AlertDialog;
import android.app.Dialog;
import android.content.DialogInterface;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.widget.EditText;

public class SandboxForAndroidActivity extends Activity {
    /**
     * onCreate
     */
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        showDialog( 0 );
    }

    /**
     * onCreateDialog
     */
    @Override
    protected Dialog onCreateDialog(int id) {
        if( id == 0 ){
            return new AlertDialog.Builder( this )
                // レイアウトファイル
                .setView( LayoutInflater.from( this ).inflate( R.layout.login, null) )
                // アイコン設定
                .setIcon(android.R.drawable.ic_dialog_email)
                // タイトル文字列
                .setTitle(R.string.message_title_login)
                // ログインボタン
                .setPositiveButton( R.string.message_button_login, new DialogInterface.OnClickListener() {
                    public void onClick(DialogInterface dialog, int whichButton) {
                        AlertDialog dlg = (AlertDialog)dialog;
                        EditText editUser = (EditText) dlg.findViewById( R.id.editUserId );
                        EditText editPassword = (EditText) dlg.findViewById(R.id.editPassword );
                        
                        String user = editUser.getText().toString();
                        String password = editPassword.getText().toString();
                        
                        //
                        // 実際の認証処理など
                        // 
                    }
                })
                // キャンセルボタン
                .setNegativeButton( R.string.message_button_cancel, new DialogInterface.OnClickListener() {
                    public void onClick(DialogInterface dialog, int whichButton) {
                    }
                })
                // 作成
                .create();
        }
        
        return super.onCreateDialog(id);
    }
}

文字列リソース

コードとレイアウトで使っている文字列リソースも置いておこう。どうしてここまで至れり尽くせりになっているかというと、自分であとから使うときオールコピペで済ませたいからなのである。こういうのをマウス＆クリック記法という（ウソ）。

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

    ログイン
    ログイン
    ログアウト
    キャンセル
    ユーザID
    ユーザID
    パスワード
    パスワード