2017年1月14日土曜日

Android の GridLayout概要

目次へ



GridLayoutでは、列数、行数を指定しておき、その中に部品を置くと左上から順にWidgetが配置されていきます。 swingのGridLayoutと似た使い方です。
また、行と列を指定して、Widgetを好きな位置に配置することもできます。

■■■■GridLayout例(順番に配置)

レイアウトファイル
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:columnCount="3"        列数
    android:rowCount="3"          行数
    android:layout_gravity="center_horizontal">中央揃え
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="1"
        android:onClick="click" このボタンをクリックしたときのメソッド名
        />
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="2"
        android:onClick="click"
        />
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="3"
        android:onClick="click"
        />
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="4"
        android:onClick="click"

    以下同様に9のボタンまで作成します。

</GridLayout>


ボタンをクリックしたときのメソッド名をclickとしたので、Activityのクラスの中に
public void click(View v) {・・・}を作成します。
public class GridLayoutTest extends Activity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.third);
    }

    public void click(View v) {
        Button b = (Button)v;
        String s = b.getText()+"がクリックされました";
        Toast toast = Toast.makeText(this, s, Toast.LENGTH_SHORT);
        toast.show();
    }
}


上のような指定をした場合、次のような画面が表示されます。


■■■■GridLayout例(行と列を指定して配置)

レイアウトファイル
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:columnCount="2"
    android:rowCount="3" >
         <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="1" /> 行と列を指定していないので先頭

         <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_row="1"
            android:layout_column="0"
            android:text="2" />

         <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="3" />

         <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_row="2"
            android:layout_column="1"
            android:text="4" />
</GridLayout>


上のような指定をした場合、次のような画面が表示されます。



にほんブログ村 IT技術ブログ IT技術メモへ
にほんブログ村

Android の FrameLayout概要

目次へ



FrameLayoutでは、その中に部品を置くとその上に重なって表示されていきます。下の例は、それを使って画像の上にボタンともうひとつのが像を重ねています。

■■■■FrameLayout例

レイアウトファイル
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:src="@drawable/img1"/ />
    <ImageView
        android:id="@+id/imageView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_vertical|center_horizontal"
        android:src="@mipmap/ic_launcher" />
  <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:text="ボタン"/>


</FrameLayout>


上のような指定をした場合、次のような画面が表示されます。


にほんブログ村 IT技術ブログ IT技術メモへ
にほんブログ村

2017年1月11日水曜日

Android ダイアログの使い方

目次へ



Androidでダイアログを作成する方法をまとめておきます。
ここで使うダイアログはすべてAlertDialogクラスを使い次のようなものを表示します。

  • メッセージを表示するだけのダイアログ
  • ボタンがあり、ユーザがボタンをタップし答えることのできるダイアログ
  • 複数の項目から選択をするダイアログ
  • ラジオボタンとボタンを表示するするダイアログ
  • チェックボックスとボタンを表示するするダイアログ




■■■■ダイアログを表示するためのボタンを作っておく



最初に5種類のダイアログを表示するためのボタンを作り、btn1~btn5の名前で使えるようにしておきます。
ボタンの作り方はこちら、あるいは、こちらなどで検索してください。

    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        Button btn1 = (Button)this.findViewById(R.id.button1);
        Button btn2 = (Button)this.findViewById(R.id.button2);
        Button btn3 = (Button)this.findViewById(R.id.button3);
        Button btn4 = (Button)this.findViewById(R.id.button4);
        Button btn5 = (Button)this.findViewById(R.id.button5);
    この下に、次から示すボタンのリスナを書く




■■■■メッセージを表示するだけのダイアログ



btn1をタップされた時の処理としてメッセージを表示するだけのダイアログを出すのが下のコードです。
この中の①のMainActivity.thisはActivityのインスタンスです。
OnClickListenerの中で使っているために、thisではなく、自分のクラス名.thisとしています。

if (btn1 != null) {
    btn1.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            AlertDialog.Builder builder = new AlertDialog.Builder(MainActivity.this);①
            builder.setTitle("タイトル");
            builder.setMessage("AlertDialogです");
            builder.show();
        }
    });
}



■■■■ボタンで答えるダイアログ



btn2をタップされた時の処理として上のようなダイアログを出すのが下のコードです。

ダイアログの中のボタンは、必要なものだけ、作成すればよいので、OKだけならbuilder.setPositiveButtonメソッドだけを呼び出せばよいことになります。

if (btn2 != null) {
    btn2.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            AlertDialog.Builder builder = new AlertDialog.Builder(MainActivity.this);
            builder.setTitle("タイトル");
            builder.setMessage("ボタンのあるAlertDialogです");
            //3つのボタンのうち必要なボタンだけ作成すればよい
            builder.setPositiveButton("はい", new DialogInterface.OnClickListener() {
                @Override
                public void onClick(DialogInterface dialog, int which) {
                    Toast toast = Toast.makeText(MainActivity.this, "OK", Toast.LENGTH_SHORT);
                    toast.show();
                }
            });
            builder.setNegativeButton("いいえ", new DialogInterface.OnClickListener() {
                @Override
                public void onClick(DialogInterface dialog, int which) {
                    Toast toast = Toast.makeText(MainActivity.this, "NO", Toast.LENGTH_SHORT);
                    toast.show();
                }
            });
            builder.setNeutralButton("またね", new DialogInterface.OnClickListener() {
                @Override
                public void onClick(DialogInterface dialog, int which) {
                    Toast toast=Toast.makeText(MainActivity.this,"またね",Toast.LENGTH_SHORT);
                    toast.show();
                }
            });
            builder.show();
        }
    });
}




■■■■複数の項目から選択をするダイアログ



btn3をタップされた時の処理として上のような複数の項目から選択をするダイアログを出すのが下のコードです。

このとき、選択肢の文字列はフィールドで定義しておきます。

   String[] ss = {"選択1", "選択2", "選択3"};
    int selectedItem = 0;
    boolean[] selectedItems = {false, false, false};

if (btn3 != null) {
    btn3.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            AlertDialog.Builder builder = new AlertDialog.Builder(MainActivity.this);
            builder.setTitle("選択してください");
            builder.setItems((CharSequence[]) ss, new DialogInterface.OnClickListener() {
                @Override
                public void onClick(DialogInterface dialog, int k) {
                    Toast toast=Toast.makeText(MainActivity.this,ss[k],Toast.LENGTH_SHORT);
                    toast.show();
                }
            });
            builder.show();
        }
    });
}




■■■■ラジオボタンとボタンを表示するするダイアログ



btn4をタップされた時の処理として上のようなダイアログを出すのが下のコードです。
このとき、複数の項目から選択をするダイアログの時と同じようにフィールドで選択肢の文字列を定義しておきます。また、ラジオボタンを押したときにその番号を入れておくためのselectedItemもフィールドで定義しておきます。

   String[] ss = {"選択1", "選択2", "選択3"};
    int selectedItem = 0;


if (btn4 != null) {
    btn4.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            AlertDialog.Builder builder = new AlertDialog.Builder(MainActivity.this);
            builder.setTitle("選択してからOKボタンを押してください");
            builder.setSingleChoiceItems((CharSequence[]) ss, 0, new DialogInterface.OnClickListener() {
                @Override
                public void onClick(DialogInterface dialog, int which) {
                    selectedItem = which;
                    Toast toast = Toast.makeText(MainActivity.this, ss[which], Toast.LENGTH_SHORT);
                    toast.show();
                }
            });
            builder.setPositiveButton("OK", new DialogInterface.OnClickListener() {
                @Override
                public void onClick(DialogInterface dialog, int which) {
                    Toast toast = Toast.makeText(MainActivity.this, ss[selectedItem], Toast.LENGTH_SHORT);
                    toast.show();
                }
            });
            builder.show();
        }
    });
}



■■■■チェックボックスとボタンを表示するするダイアログ



btn5をタップされた時の処理として上のようなダイアログを出すのが下のコードです。
このとき、フィールドで選択肢の文字列と、どこにチェックが入っているかを示すbooleanの配列が必要です。
   String[] ss = {"選択1", "選択2", "選択3"};
   boolean[] selectedItems = {false, false, false};


    btn5.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            AlertDialog.Builder builder = new AlertDialog.Builder(MainActivity.this);
            builder.setTitle("選択してからOKボタンを押してください");
            builder.setMultiChoiceItems((CharSequence [])ss, selectedItems, 
                                 new DialogInterface.OnMultiChoiceClickListener() {
                @Override
                public void onClick(DialogInterface dialog, int k, boolean isChecked) {
                    selectedItems[which] = isChecked;
                    Toast toast = Toast.makeText(MainActivity.this, ss[k], Toast.LENGTH_SHORT);
                    toast.show();
                }
            });
            builder.setPositiveButton("OK", new DialogInterface.OnClickListener() {
                @Override
                public void onClick(DialogInterface dialog, int which) {
                    String s = "選択されているのは";
                    for(int i=0; i<3; i++) {
                        if(selectedItems[i]) {
                            s += ss[i]+" ";
                        }
                    }
                    Toast toast = Toast.makeText(MainActivity.this, s, Toast.LENGTH_SHORT);
                    toast.show();
                }
            });
            builder.show();
        }
    });
}



にほんブログ村 IT技術ブログ IT技術メモへ
にほんブログ村

2017年1月8日日曜日

Android メニューの使い方

目次へ



基本的なことですが、Androidでメニューを作成し、メニューが選択された時の処理を作成する方法をまとめておきます。
  • onCreateOptionsMenu(Menu menu) がメニュー生成のためのメソッド
  • MenuInflater クラスがメニューを作成するためのクラス
  • onOptionsItemSelected(MenuItem item) がメニューが選択された時に呼ばれるメソッド


■■■■メニュー生成のためのメソッド

Android端末のメニューボタンを押すと画面にポップアップして現れるメニューをオプションメニューと言います。
オプションメニューは、ActivityクラスのonCreateOptionsMenuというメソッドをオーバーライドして作成します。
これは、AndroidStudioでBlank Activityなどを指定してプロジェクトを作成すると、MainActivityクラスに、作成されているものです。
Activityが作成され、オプションメニューを作成する段階になると、自動的にこのメソッドが実行され、メニューの組み込みが行われます。


■■■■MenuInflater

実際にメニュー項目を登録するには、MenuInflaterクラスを使います。
・Activityが持つgetMenuInflater()を使ってMenuInflaterオブジェクトの取得
MenuInflater menuInflater = getMenuInflater();
・メニューの生成
menuInflater.inflate(メニューのリソース,Menuのインスタンス);
・メニュー項目を追加するなら
Menuのインスタンス.add("aaa");


onCreateOptionsMenuメソッドの中で書くなら次のようになります。
@Override
public boolean onCreateOptionsMenu(Menu menu) {
    getMenuInflater().inflate(R.menu.menu_main, menu);
    menu.add("aaa");
    return true;
}



res/menu/menu_main.xmlは以下のようになっています。
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    tools:context="com.example.yoko.myapplication.MainActivity">
    <item
        android:id="@+id/action_settings"
        android:orderInCategory="100"       ※
        android:title="@string/action_settings"
        app:showAsAction="never" />       ※
</menu>


これで、メニューボタンを押すと下のように表示されます。
※menu_main.xmlのandroid:orderInCategoryはメニューの並びに関する値で、設定された値に従って、表示されます。
この値が小さければ最小の方に、大きければ最後の方に並べられます。

※menu_main.xmlのapp:showAsActionはアクションバーでのメニューの表示に関するものです。
アクションバーは画面の幅が広い時には重要なメニューをボタンとして表示します。
app:showAsActionはボタンとして表示するかどうかを指定するもので以下のような値が設定できますが、上では、neverとして、ボタンとして表示しないようにしています。
never 表示しない
ifRoom 表示できるならする
withText テキストも一緒に表示する
always 常に表示する
collapseActionView ActionViewを表示するときに使う


もし、alwaysとすると、次のようにSettingsというボタンがメニューボタンの横に表示されます。



■■■■メニューが選択された時に呼ばれるメソッド

表示されたメニューをユーザが選ぶとonOptionsItemSelectedというメソッドが呼び出されます。
引数選択されたMenuItemのインスタンスが渡されますので、それによって必要な処理を書きます。
下の例では、aaaというMenuItemが選択された時にトーストを表示しています。
@Override
public boolean onOptionsItemSelected(MenuItem item) {
    if("aaa".equals(item.getTitle())) {
        Toast toast = Toast.makeText(this,"aaaが選択されました",Toast.LENGTH_SHORT);
        toast.show();
    }
    return super.onOptionsItemSelected(item);
}



にほんブログ村 IT技術ブログ IT技術メモへ
にほんブログ村