2013年5月2日木曜日

アラートダイアログにレイアウトを読み込ませる(AlertDialog, inflate)

今回はレイアウトをxmlで作成して、そのxmlをダイアログに適用させる方法について記述します。

dialog.xmlのサンプルソースはlayoutフォルダに格納してください。
dialog_bg_layout.xmlのサンプルソースはdrawableフォルダに格納してください。

■サンプルソース
●MainActivity
package com.example.rgrgre;

import android.os.Bundle;
import android.app.Activity;
import android.app.AlertDialog;
import android.app.Dialog;
import android.content.DialogInterface;
import android.view.LayoutInflater;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup;
import android.widget.Button;
import android.widget.LinearLayout;
import android.widget.RadioButton;
import android.widget.RadioGroup;
import android.widget.Toast;

public class MainActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        //レイアウトの作成
        LinearLayout oLayout = new LinearLayout(getApplicationContext());
        //作成したレイアウトを画面に設定
       setContentView(oLayout);

        //ボタンを生成
        Button oBtn = new Button(getApplicationContext());
        oBtn.setText("ダイアログを出現させるボタンです。");
        //ボタンを押したら、ダイアログを出現させる
        oBtn.setOnClickListener(new OnClickListener() {
            public void onClick(View v) {
               showDialog(0);
            }
        });
        //ボタンをレイアウトに追加
        oLayout.addView(oBtn);
    }
 
    @Override
    protected Dialog onCreateDialog(int id) {
        //アラートダイアログの生成
        AlertDialog.Builder dialog = new AlertDialog.Builder(this);
        //カスタムビューを設定
        LayoutInflater inflater = (LayoutInflater)this.getSystemService(LAYOUT_INFLATER_SERVICE);
        //レイアウトのインフレーター
        final View layout = inflater.inflate(R.layout.dialog, (ViewGroup)findViewById(R.id.dialog_root));
        //パーツの作成
        dialog.setIcon(R.drawable.ic_launcher);
        dialog.setTitle("サンプル");
        //ダイアログのレイアウトを適用
        dialog.setView(layout);
        //ラジオグループの取得
        final RadioGroup oRGLEVEL = (RadioGroup)layout.findViewById(R.id.RG_LEVEL);
        final RadioGroup oRGBMG = (RadioGroup)layout.findViewById(R.id.RG_BGM);
        //起動時のチェックを付ける
        oRGLEVEL.check(R.id.RB_NORMAL);
        oRGBMG.check(R.id.RB_ON);

        //OKボタン押下後の処理を記述
        dialog.setPositiveButton("OK", new DialogInterface.OnClickListener() {
            @Override
            public void onClick(DialogInterface dialog, int which) {

            //チェックされているラジオボタンを取得
            RadioButton checkedLEVEL = (RadioButton)oRGLEVEL.findViewById(oRGLEVEL.getCheckedRadioButtonId());
            RadioButton checkedBGM =(RadioButton)oRGBMG.findViewById(oRGBMG.getCheckedRadioButtonId());

           //チェックされているラジオボタンのテキストを取得
            String sText = "難易度:" + checkedLEVEL.getText() + " BGM:" +checkedBGM.getText();
            //出力
            Toast.makeText(getApplicationContext(), sText , Toast.LENGTH_SHORT).show();
            //ダイアログを消す
            removeDialog(0);}
        });
        return dialog.create();
    }
}

●layout
dialog.xml



  
  
  
    
    
    
  
    
  

  
    
    
  


●drawable
dialog_bg_layout.xml


  
    
      
    
  
  
    
      
    
  
  
    
      
      
    
  



■実行結果





//レイアウトのインフレーター
final View layout = inflater.inflate(R.layout.dialog, (ViewGroup)findViewById(R.id.dialog_root));
ダイアログのビューとして利用できるようレイアウトを1度インフレートします。
また、定義することで、外部から関数からも参照できるように設定します。

//ダイアログのレイアウトを適用
dialog.setView(layout);
ビューに先ほどのレイアウトを適用させます。
これで、ダイアログの画面の設定は完了です。

//ラジオグループの取得
final RadioGroup oRGLEVEL = (RadioGroup)layout.findViewById(R.id.RG_LEVEL);
final RadioGroup oRGBMG = (RadioGroup)layout.findViewById(R.id.RG_BGM);
ラジオグループも定義して、外部参照できるようにして、ダイアログのOKボタンがクリックされたときに

//チェックされているラジオボタンを取得
RadioButton checkedLEVEL =(RadioButton)oRGLEVEL.findViewById(oRGLEVEL.getCheckedRadioButtonId());
RadioButton checkedBGM = (RadioButton)oRGBMG.findViewById(oRGBMG.getCheckedRadioButtonId());
クリック時の処理を取得できるようにしています。



アラートダイアログはAndroidで用意されている部品で作っているダイアログです。
なので、簡単に作成できます。
しかし、用意されている物なので、いかんせん自由度は低いです。

自由度が低い中で、今回は少しだけ頑張ってみました。。。


1 件のコメント:

  1. >また、定義することで、外部から関数からも参照できるよう>に設定します。

    この情報たすかりました。

    返信削除