ボタン

ボタンは、テキストまたはアイコン(またはその両方)で構成され、ユーザーがボタンにタッチしたときに実行されるアクションを表します。

ボタンをテキスト、アイコン、またはその両方のいずれで表すかに応じて、次の 3 つの方法でレイアウトにボタンを作成できます。

  • テキストの場合、Button クラスを使用します。
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/button_text"
        ... />
    
  • アイコンの場合、ImageButton クラスを使用します。
    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/button_icon"
        android:contentDescription="@string/button_icon_desc"
        ... />
    
  • テキストとアイコンの場合、android:drawableLeft 属性を持つ Button を使用します。
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/button_text"
        android:drawableLeft="@drawable/button_icon"
        ... />
    

キーとなるクラスは次のとおりです。

クリック イベントへの応答

ユーザーがボタンをクリックすると、Button オブジェクトは on-click イベントを受け取ります。

ボタンのクリック イベント ハンドラを定義するには、XML レイアウトの <Button> 要素に android:onClick 属性を追加します。この属性の値には、クリック イベントに応じて呼び出すメソッドの名前を指定する必要があります。次に、レイアウトをホストする Activity で、対応するメソッドを実装する必要があります。

たとえば、android:onClick を使用したボタンがあるレイアウトは次のようになります。

<?xml version="1.0" encoding="utf-8"?>
<Button xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/button_send"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/button_send"
    android:onClick="sendMessage" />

このレイアウトをホストする Activity 内で、次のメソッドはクリック イベントを処理します。

Kotlin

/** Called when the user touches the button */
fun sendMessage(view: View) {
    // Do something in response to button click
}

Java

/** Called when the user touches the button */
public void sendMessage(View view) {
    // Do something in response to button click
}

android:onClick 属性で宣言するメソッドには、上記のとおりの署名が必要です。具体的なメソッドの要件は以下のとおりです。

  • public である
  • void を返す
  • View を唯一のパラメータとして定義する(これがクリックされた View になります)

OnClickListener の使用

XML レイアウトを使用せずに、プログラムでクリック イベント ハンドラを宣言することもできます。これは、実行時に Button をインスタンス化する場合、または Fragment サブクラスでクリック動作を宣言しなければならない場合に必要になることがあります。

イベント ハンドラをプログラムで宣言するには、View.OnClickListener オブジェクトを作成し、setOnClickListener(View.OnClickListener) を呼び出してボタンに割り当てます。次に例を示します。

Kotlin

val button: Button = findViewById(R.id.button_send)
button.setOnClickListener {
    // Do something in response to button click
}

Java

Button button = (Button) findViewById(R.id.button_send);
button.setOnClickListener(new View.OnClickListener() {
    public void onClick(View v) {
        // Do something in response to button click
    }
});

ボタンのスタイル設定

ボタンの外観(背景画像とフォント)は、デバイスによって異なる場合があります。多くの場合、メーカーが異なれば、デバイスの入力コントロールのデフォルト スタイルも異なるためです。

アプリ全体に適用するテーマを使用すると、コントロールのスタイルを正確に制御できます。たとえば、Android 4.0 以降を搭載するすべてのデバイスでアプリの Holo テーマを使用するには、マニフェストの <application> 要素で android:theme="@android:style/Theme.Holo" を宣言します。また、古いデバイスをサポートしつつ Holo テーマを使用する方法については、ブログ記事 Holo Everywhere をご覧ください。

個々のボタンを別の背景でカスタマイズするには、ドローアブルまたはカラーリソースを使用して android:background 属性を指定します。または、ボタンにスタイルを適用する方法もあります。この方法は HTML スタイルと同様に機能し、背景、フォント、サイズなど、複数のスタイル プロパティを定義できます。スタイルの適用について詳しくは、スタイルとテーマをご覧ください。

枠線なしボタン

便利なデザインの 1 つに「枠線なし」のボタンがあります。枠線なしボタンは、境界線または背景がないことを除けば基本的なボタンと似ていますが、クリックされた状態など、さまざまな状態によって外観が変化します。

枠線なしボタンを作成するには、ボタンに borderlessButtonStyle スタイルを適用します。次に例を示します。

<Button
    android:id="@+id/button_send"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/button_send"
    android:onClick="sendMessage"
    style="?android:attr/borderlessButtonStyle" />

カスタムの背景

ボタンの外観を完全に再定義する場合は、カスタム背景を指定できます。ただし、単純なビットマップまたは色を指定するのではなく、背景を、ボタンの現在の状態に応じて外観を変更する状態リストリソースにする必要があります。

状態リストは XML ファイルで定義できます。ここでは、3 つの異なるボタン状態に使用する画像または色をそれぞれ定義します。

ボタンの背景用に状態リストのドローアブルを作成するには:

  1. ボタンの背景用に、3 つのボタン状態(デフォルト状態、押された状態、フォーカスされた状態)を表すビットマップをそれぞれ作成します。

    画像がさまざまなサイズのボタンに収まるようにするには、ビットマップを 9-patch ビットマップとして作成します。

  2. ビットマップをプロジェクトの res/drawable/ ディレクトリに配置します。各ビットマップに、それぞれが表すボタンの状態を反映する適切な名前を付けます(button_default.9.pngbutton_pressed.9.pngbutton_focused.9.png など)。
  3. res/drawable/ ディレクトリに新しい XML ファイルを(button_custom.xml などの名前を付けて)作成し、次の XML を挿入します。
    <?xml version="1.0" encoding="utf-8"?>
    <selector xmlns:android="http://schemas.android.com/apk/res/android">
        <item android:drawable="@drawable/button_pressed"
              android:state_pressed="true" />
        <item android:drawable="@drawable/button_focused"
              android:state_focused="true" />
        <item android:drawable="@drawable/button_default" />
    </selector>
    

    ここでは、ボタンの現在の状態に応じて画像を変更する単一のドローアブル リソースを定義しています。

    • 最初の <item> は、ボタンが押されたとき(アクティブ化されたとき)に使用するビットマップを定義しています。
    • 第 2 の <item> は、ボタンがフォーカスされているとき(カーソルボタンまたは十字キーを使用してボタンが強調表示されているとき)に使用するビットマップを定義しています。
    • 第 3 の <item> は、ボタンがデフォルト状態のとき(押された状態でもフォーカスされた状態でもないとき)に使用するビットマップを定義しています。

    注: <item> 要素の順序は重要です。このドローアブルが参照されるとき、<item> 要素は順序どおりに走査され、どれが現在のボタン状態に該当するかが判定されます。デフォルトのビットマップは順序が最後なので、条件 android:state_pressed および android:state_focused が両方とも false と評価された場合にのみ、適用されます。

    この XML ファイルは単一のドローアブル リソースを表し、背景の Button によって参照されると、上記の 3 つの状態に応じて、表示される画像が変化します。

  4. 次に、ボタンの背景としてドローアブル XML ファイルを適用します。
    <Button
        android:id="@+id/button_send"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/button_send"
        android:onClick="sendMessage"
        android:background="@drawable/button_custom"  />
    

他のボタン状態(無効化された状態やカーソルを合わせた状態など)を定義する方法を含め、この XML 構文について詳しくは、状態リスト ドローアブルをご覧ください。