今回はラジオボタン（RadioButton）の使い方について書いていきたいと思います。

ラジオボタンとは事前定義された選択肢のうち一つだけを選択するボタンです。


まずはプロジェクトの作成を行ってください。

[簡単Androidアプリ] プロジェクトの作成からHello Worldテキストの出力まで

Layout

レイアウトの作成を行っていきます。

レイアウトを設定するxmlファイルを開きましょう。（ここではactivity_sample_main.xml）

palette -> フォーム・ウィジェット ->RadioGroup をアプリケーション画面にドラッグします。

Coding

以下のプログラムをメインアクティビティクラスに記述します。（ここではSampleMain.java）

SampleMain.java

package com.sample.brogger;

import android.app.Activity;
import android.graphics.Color;
import android.os.Bundle;
import android.widget.RadioButton;
import android.widget.RadioGroup;

import com.sample.brogger.R.id;

public class SampleMain extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        // レイアウトの指定
        setContentView(R.layout.activity_sample_main);

        // オブジェクトの作成
        RadioGroup rg = (RadioGroup) findViewById(R.id.radioGroup1);
        final RadioButton rb0 = (RadioButton) findViewById(R.id.radio0);
        final RadioButton rb1 = (RadioButton) findViewById(R.id.radio1);
        final RadioButton rb2 = (RadioButton) findViewById(R.id.radio2);

        // ラジオボタンの状態を設定
        rg.check(id.radio0);

        // ラジオボタンがチェックされた時に呼び出されるリスナ
        rg.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {

            @Override
            public void onCheckedChanged(RadioGroup group, int checkedId) {
                // TODO 自動生成されたメソッド・スタブ
                // チェックされたラジオボタンの取得
                RadioButton ch_rb = (RadioButton) findViewById(checkedId);

                // ラジオボタンのテキストカラーをデフォルトに
                rb0.setTextColor(Color.BLACK);
                rb1.setTextColor(Color.BLACK);
                rb2.setTextColor(Color.BLACK);

                // チェックされたラジオボタンのテキストカラーの変更
                ch_rb.setTextColor(Color.RED);

            }
        });
    }
}

Execution

では実際に実行してみましょう。

ラジオボタンを押すと・・・

テキストの色が変わります。



前記事：[簡単Androidアプリ] チェックボックス（CheckBox）をつかってみよう！！
次投稿：[簡単Androidアプリ] エディットテキスト（EditText）を使ってみよう！！

今回はチェックボックス（CheckBox）の使い方について書いていきたいと思います。

チェックボックスとは、ある項目に対して「yes」または「no」の答えを出力するためのボタンです。


まずはプロジェクトの作成を行ってください。

[簡単Androidアプリ] プロジェクトの作成からHello Worldテキストの出力まで

Layout

レイアウトの作成を行います。

レイアウトを設定するxmlファイルを開きましょう（ここではactivity_sample_main.xml）

palette -> フォーム・ウィジェット -> CheckBox を二つアプリケーション画面にドラッグします。

Coding

以下のプログラムをメインアクティビティクラスに記述します。（ここではSampleMain）

SampleMain.java

package com.sample.brogger;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.CheckBox;
import android.widget.Toast;

public class SampleMain extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        // レイアウトの指定
        setContentView(R.layout.activity_sample_main);

        // オブジェクトの作成
        CheckBox ch1 = (CheckBox) findViewById(R.id.checkBox1);
        CheckBox ch2 = (CheckBox) findViewById(R.id.checkBox2);

        // チェックボックスの状態を設定
        ch1.setChecked(true);
        ch2.setChecked(false);

        // チェックボックス1のリスナ
        ch1.setOnClickListener(new View.OnClickListener() {

            @Override
            public void onClick(View v) {
                // TODO 自動生成されたメソッド・スタブ
                // チェックされたチェックボックスの取得
                CheckBox checkBox = (CheckBox) v;
                // チェック状態をトーストで表示
                boolean ch = checkBox.isChecked();
                // トーストでチェック状態を表示
                Toast.makeText(SampleMain.this,
                        "チェックボックス１：" + String.valueOf(ch), Toast.LENGTH_SHORT).show();
            }
        });

        // チェックボックス2のリスナ
        ch2.setOnClickListener(new View.OnClickListener() {

            @Override
            public void onClick(View v) {
                // TODO 自動生成されたメソッド・スタブ
                // チェックされたチェックボックスの取得
                CheckBox checkBox = (CheckBox) v;
                // チェック状態をトーストで表示
                boolean ch = checkBox.isChecked();
                // トーストでチェック状態を表示
                Toast.makeText(SampleMain.this,
                        "チェックボックス２：" + String.valueOf(ch), Toast.LENGTH_SHORT).show();
            }
        });
    }
}

Execution

では実際に実行してみましょう。

チェックボックスをクリックすると・・・

トーストが表示されます。

前記事：[簡単Androidアプリ] カウンターアプリケーションを作ってみよう！！
次記事：[簡単Androidアプリ] ラジオボタン（RadioButton）使ってみよう！！

これまで、[簡単Androidアプリ]というタイトルで６記事ほど投稿してきましたが今回はこれまでの総集編みたいなものです。

ここまでこのクソみたいなブログを読んでくれたプログラム初心者のあなた！！
あなたに朗報です。

といっても私もまだまだ初心者なのですが…

それはどうでもいいとして、

そう！たった６記事。
開発環境のページを抜けば、たった４記事の内容で簡単なカウンタアプリが作れちゃいます。

もしこれまでjavaやC言語の基礎本しか勉強したことのない人がいれば感動すると思います。私もはじめてGUIアプリケーションを自分で作成した際少し感動してしましました。

では早速コードを見て行きましょう。

Coding

SampleMain.java

メインアクティビティクラス

package com.sample.brogger;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.TextView;

public class SampleMain extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        // レイアウトの指定
        setContentView(R.layout.activity_sample_main);

        // オブジェクトの作成
        final TextView tv = (TextView) findViewById(R.id.pvText);
        final Button cnt_bt = (Button) findViewById(R.id.sampleButton);
        final Button clear_bt = (Button) findViewById(R.id.clearButton);

        // カウントボタンが押された場合のリスナ
        cnt_bt.setOnClickListener( new OnClickListener() {
         @Override
         public void onClick(View v) {
             // pvTextの値を取得
             int cnt = Integer.parseInt((String) tv.getText());

             // 取得した値 + 1
             cnt++;

             // ボタンが押された場合TextViewの文字を変更
             tv.setText(String.valueOf(cnt));
         }
        });

        // クリアボタンが押された場合のリスナ
        clear_bt.setOnClickListener( new OnClickListener() {
         @Override
         public void onClick(View v) {
             // ボタンが押された場合TextViewの文字を変更
             tv.setText("0");
         }
        });
    }
}

activity_sample_main.xml

レイアウトを設定するxml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:background="@drawable/gradientbackground"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.sample.brogger.SampleMain" >

    <TextView
        android:id="@+id/sampleText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:text="1031Taku-Programming Note"
        android:textSize="70sp" />

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_above="@+id/sampleButton"
        android:layout_alignLeft="@+id/sampleText"
        android:layout_marginBottom="99dp"
        android:layout_marginLeft="378dp"
        android:text="PV:"
        android:textSize="60sp" />

    <TextView
        android:id="@+id/pvText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBaseline="@+id/textView1"
        android:layout_alignBottom="@+id/textView1"
        android:layout_marginLeft="23dp"
        android:layout_toRightOf="@+id/textView1"
        android:text="0"
        android:textSize="60sp" />

    <TextView
        android:id="@+id/textView4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/textView3"
        android:layout_alignTop="@+id/textView3"
        android:layout_marginTop="44dp"
        android:text="皆さんの力でたくさん上げてあげてください" />

    <Button
        android:id="@+id/sampleButton"
        android:layout_width="match_parent"
        android:layout_height="100dp"
        android:layout_above="@+id/textView3"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="62dp"
        android:text="1031Taku"
        android:textSize="40sp" />

    <TextView
        android:id="@+id/textView3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/sampleText"
        android:layout_alignParentBottom="true"
        android:layout_marginBottom="164dp"
        android:text="ボタンをクリックするとPV数が上がります" />

    <Button
        android:id="@+id/clearButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@+id/textView4"
        android:layout_alignRight="@+id/sampleButton"
        android:layout_marginLeft="112dp"
        android:layout_toRightOf="@+id/pvText"
        android:text="Clear"
        android:textSize="30sp" />

</RelativeLayout>

gradientbackground.xml

背景をグラデーションするxml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<gradient
    android:startColor="#CCFF99"
    android:endColor="#CCFFFF"
    android:angle="270"/>
<corners android:radius="10dp"/>
</shape>

実行

では実際に実行してみます。

1031Takuボタンを押すと…

カウントされます。
更に「Clear」ボタンを押すとカウントがクリアされます。

解説

今回は総集編なので詳しい解説は以前投稿した記事内に書いてあります。
一応リンクだけ貼っておきますね。


[簡単Androidアプリ] プロジェクトの作成からHello Worldテキストの出力まで

[簡単Androidアプリ] ボタンの利用とリスナーの設定

[簡単Androidアプリ] 背景にグラデーションを与える方法

前回はTextViewクラスのオブジェクトを作成しそれを出力するだけのプログラムでした。

前回記事：[Androidアプリ]　TextViewを使ってのHello World

今回はTextViewともう一つ、Buttonを使ってボタンを押すとTextViewで表示する文字列を変更するプログラムを作りたいと思います。



まずは、プロジェクトの作成を行います。
プロジェクト作成については以前書いた記事を参照してください。

プロジェクト作成：[Androidアプリ] プロジェクトの作成からHello Worldまで

Layout

次にレイアウトの設定を行うxmlファイルを編集していきます。
前回の記事ではこのxmlファイルは使用しませんでしたが、通常アプリケーションのレイアウトを作成する際はこのxmlファイルを使用していきます。

レイアウトのxmlファイルはプロジェクトの「res -> layout」フォルダ内にあります。
このファイルを開いてください。

デフォルトでTextViewが設定されている場合はそのままで、もし設定されていない場合はButtonと一緒にTextViewも追加していきます。
「palette」欄の「フォーム・ウィジェット」にTextViewとButtonがあります。これをActivityにドラッグで追加してください。

次にこのTextViewとButtonのIdを設定します。まずTextViewをクリックし、Properties欄の一番上部にあるIdの「@+id/」以降の値を好きな値に変更してください。ここでは「@+id/sampleText」とします。変更する際何かポップアップが出た場合は全て「はい」を押してください。
同じようにボタンのIdも設定してきます。ここでは「@+id/sampleButton」とします。

このProperties欄ではビューの様々な値を変更することができます。自分のお好きなように設定してみてください。

参考までに、
TextViewの「Text」を"Taku-Programming Note"
TextViewの「Text Size」を"50sp"
Buttonの「Text」を"1031Taku"
Buttonの「Width」を"match_parent"
に設定してみました。

Coding

では実際にコードを入力していきましょう。

package com.sample.brogger;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.TextView;

public class SampleMain extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        // レイアウトの指定
        setContentView(R.layout.activity_sample_main);

        // オブジェクトの作成
        final TextView tv = (TextView) findViewById(R.id.sampleText);  // xmlファイルで設定したIdを
        final Button bt = (Button) findViewById(R.id.sampleButton);    // findViewByIdで指定

        // リボタンが押された場合のリスナ
        bt.setOnClickListener( new OnClickListener() {
         @Override
         public void onClick(View v) {
             // ボタンが押された場合TextViewの文字を変更
             tv.setText("ボタンが押されました");
         }
        });
    }
}

Execution

では実行してみましょう。

ボタンを押すと…

テキストが変更されます。

解説

今回のプログラムと前回とで大きく違うのは、リスナを利用している点です。前回ではただテキストを表示するだけで、なんのインタラクション性もないプラグラムでしたが、今回はリスナを利用することでユーザの操作によって変化をおこすプログラムになっています。

このような処理をイベント処理と言います。

今回の例では、「ボタンを押した」というイベントに対し、
「リスナ（OnClickListener）」がTextViewのテキストを変更するという処理行いました。

// リボタンが押された場合のリスナ
bt.setOnClickListener( new OnClickListener() {
    @Override
    public void onClick(View v) {
        // イベントが発生した際に行う処理を記述
    }
});  

前記事：[簡単Androidアプリ]　TextViewの利用

前回の記事では、プロジェクトを作成し何も手を加えず実行しただけのHello Worldでしたが、今回は「TextView」というものを使用して文字を出力したいと思います。

前記事：[Androidアプリ] プロジェクトの作成からHello Worldテキストの出力まで




「TextView」は文字列などの表示を行うコンポーネントタイプのビューです。

まずは、プロジェクトの作成を行います。
プロジェクト作成については前回の記事を参照してください。

プロジェクト作成：[Androidアプリ] プロジェクトの作成からHello Worldまで

Coding

では実際にプログラムを打っていきます。

メインクラス（ここでは「SampleMain」クラス）に以下のコードを入力します。

package com.sample.brogger;

import android.app.Activity;
import android.os.Bundle;
import android.widget.LinearLayout;
import android.widget.TextView;

public class SampleMain extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        LinearLayout ll = new LinearLayout(this);
        setContentView(ll);

        TextView tv = new TextView(this); //文字を表示するオブジェクトの作成
        tv.setText("ようこそAndroidへ！"); //文字を設定するメソッドの呼び出し

        ll.addView(tv);
    }
}

Execution

では実際に起動してみましょう。

この画像はタブレットでの実行なので文字が小さくなってしまいましたが、とりあえずちゃんと「ようこそAndroidへ！」が表示されていれば成功です。

解説

ここからは先ほどのコードを詳しく見ていきます。

Activity Class

今回作成した、SampleMain.javaはJava言語で記述されたコードです。

Java言語では、クラス（class）という概念を単位として構成されています。

今回のコードでは、「SampleMain」というクラスがあります。

このクラスはActivityクラス（アプリケーション画面）というAndroidパッケージに元々備え付けられているクラスを拡張（extends）しています。

簡単に言うと、「SampleMain」クラスは、アプリケーション画面を表すActivityクラスということです。

一つのActivityクラス = 一つのアプリケーション画面

とイメージすると分かりやすいでしょう。

public class SampleMain extends Activity
{
    ・・・
}

Package

Androidアプリケーションで使用されるクラスは、javaのパッケージ（package）で分類します。

今回はプロジェクトを作成する際「com.sample.brogger」というパッケージ名をしていしました。これはSampleMainのクラスはcom.sample.broggerというパッケージに含まれるということです。その為クラスを作成する際、下記のようにパッケージを指定する必要があります。

package com.sample.brogger;

Inport

Androidアプリケーションは、自分で記述したプログラムだけで動いている訳ではありません。Android SDKのライブラリにはアプリケーションを動かすための様々なプログラムが元々入っています。これらのプログラムもSampleMain同様、パッケージにまとめられています。

上記のプログラムを使用するときは、プログラムの先頭などでパッケージを指定する必要があります。これをインポート（inport）といいます。

import android.app.Activity;
import android.os.Bundle;
import android.widget.LinearLayout;
import android.widget.TextView;

今回は「Activityクラス」、「Bundleクラス」、「LinearLayoutクラス」、「TextViewクラス」を利用するため、これのインポートを行っています。

Object

Javaにおいて、クラスとはプログラムで扱われるモノの機能や状態をまとめたものです。

Objectはその物自体です。

例えば今回は、「画面上に文字を表示する」という機能をまとめたクラス（TextView）を利用し、このクラスから実際に文字を表示するオブジェクト（今回は tv）を作成しりようします。

TextView tv = new TextView(this); //文字を表示するオブジェクトの作成
tv.setText("ようこそAndroidへ！"); //文字を設定するメソッドの呼び出し

OnCreate-Method

ActivityクラスにはOnCreate()メソッドがあります。

このメソッドは、「アプリケーション画面が起動された時」に呼び出されるメソッドです。

Androidアプリケーションにはこのような、アプリケーションの状態によって呼び出されるメソッドがいくつかあります。これらのメソッドの説明については以前にも書いたので以下の記事を参照してください。

Android Activityクラスについて



前記事：[簡単Androidアプリ] プロジェクトの作成からHello Worldテキストの出力まで

次記事：[簡単Androidアプリ] ボタンの利用とリスナーの設定

ここではAndroidアプリケーションプロジェクトの作成から、Hello World文字列の出力までを解説していきます。

プロジェクトの作成

プロジェクトとはひとつのソフトウエアを動作せせるためのプログラムファイルや、画像などの色々なファイルをひとまとめにしたものです。

Androidのプロジェクトを作成するにはEclipseを使用します。まずはEclipseを起動しましょう。

Eclipseが起動したらメニュバーの「ファイル」->「新規」->「その他」を選択するとウィンドウが開くのでその中の「Android」->「Androidアプリケーションプロジェクト」を選択します。

次に新規プロジェクトを作成するウィンドウが開くのでこのウィンドウ内でプロジェクトの設定を行っていきます。

• アプリケーション名：　アプリケーションの名前
• プロジェクト名：　プロジェクト名（ワークスペース内にプロジェクトとして表示）
• パッケージ名： 　パッケージ名（最初に動作するプログラムのパッケージ）
• 最小必須SDK：　動作するのに必要な最低限のSDKバージョン
• ターゲットSDK：　対象のSDKバージョン
• 次でコンパイル：　コンパイルするSDKバージョン
• テーマ：　画面のアクションバーの設定

「アプリケーション名」に適当な名前を入力します。

ここでは「SampleBrogger」という名前で登録します。

「パッケージ名」に適当な名前を入力します。

ここでは「com.sample.brogger」とします。

「最小必須SDK」この値を低くすれば昔のバージョンの端末でも正常に起動出来る様になります。

ここでは、「API11:Android3.0」とします。

「ターゲットSDK」お好きなバージョンを選択してください。

ここでは、「API14:Android4.0」とします。

「次でコンパイル」

ここでは、「API14:Android4.0」とします。

ここまで設定できたら「次へ」を押しましょう。

開いた画面での設定はデフォルトのままでいいですが、一応各項目について簡単に説明していきます。

• カスタム・ランチャー・アイコンを作成する
  起動用アイコン画像を設定するか否か（チェックを入れるとアイコン画像設定画面がが次に表示）
• アクティビティの作成
  アクティビティクラスを作成するか否か
• このプロジェクトをライブラリーとしてマークする
  プロジェクトをライブラリとするか否か
• ワークスペース内にプロジェクトを作成
  ワークスペース内にプロジェクトを作成するか否か

色々説明しましたが、この画面はデフォルトのままで「次へ」ボタンを押し「完了」ボタンがアクティブになるまで、「次へ」ボタンを押し続けます。

「完了」ボタンがアクティブになったところで、そのボタンを押しプロジェクトが作成されます。

完了したら、そのまま何もせずに実機又はエミュレータなどで実行してみましょう。

実行はeclipseのツールバーにある緑の再生ボタン（①）を押すと実行されますが、初めて実行する際は、実行ボタン横の三角をクリックし「実行の構成を」選択しましょう。出てきたウィンドウでAndroidアプリケーション（②）をダブルクリックし、参照ボタン（③）を押し先ほど作ったプロジェクトを選択しましょう。最後に実行ボタン（④）を押すと実行されます。

「Hello World」が表示されたら成功です。

Eclipseのインストール

Android SDKのインストール

次記事：[簡単Androidアプリ]　TextViewの利用