トグルボタン(コンポーネント)を使う

アンドロイドではコンポーネントとして、いくつかボタンが用意されています。

今回はその中でトグルボタンの使い方について説明をさせていただきます。

 

はじめに、トグルボタンとはどういうボタンの事かというと、

「ボタンを押す毎にONとOFFが交互に切り替わるボタン」

の事をトグルボタンと呼びます。

 

adroidの中にはToggleButtonとしてコンポーネントが用意されています。

togglebutton

 

アンドロイドでは、

1、マウスクリックで切り替わる。

2、現在のトグルがどちらに切り替わっているかの取得。

の2点をトグルボタンが自動で行ってくれます。

 

作り方も簡単にできるようになっていますので、

この機会にトグルボタンの特性と組み込み方を覚えてしまいましょう。

 

作り方

 

最初にtButtonというプロジェクトを作成します。

作成が完了したら、main.xmlのファイルを開きます。

※main.xmlでは【graphical layout】で作業を行うと簡単にレイアウトの変更ができます。

TextViewクラスがデフォルトで中に配置されていると思いますが、削除をします。

 

次に、項目の中からToggleButtonをドラッグして、main.xmlの中にいれます。

今回のトグルボタンの確認の為にTextFiedクラスを新たに作成をして追加して、LinerLayoutの中にいれます。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 android:orientation="vertical"
 android:layout_width="fill_parent"
 android:layout_height="fill_parent"
 >
 <ToggleButton android:text="ToggleButton" 
 android:id="@+id/toggleButton1" 
 android:layout_width="wrap_content" 
 android:layout_height="wrap_content"></ToggleButton>
 <TextView 
 android:text="TextView" 
 android:id="@+id/textView1" 
 android:layout_width="wrap_content" 
 android:layout_height="wrap_content"></TextView>
</LinearLayout>

上記のようなmain.xmlになっているかと思います。もしidなどがなければ必要になりますので、追加をしておいてください。

 

ここで一度パブリッシュをしてみてください。

togglebutton

 

パブリッシュされたアプリでボタンをクリックをすると、ONとOFFが切り替わるのが分かると思います。自動でトグル式のボタンが作成されました。

 

次にこの切り替えをスクリプトで利用してみましょう。

まず、最初に行うのは配置したオブジェクトを読み込む為の変数を用意します。

 

private ToggleButton _toggleButton;
private TextView _textView;

 

次にコンストラクタで、この変数にオブジェクトを読み込みます。

_toggleButton = (ToggleButton)findViewById(R.id.toggleButton1);
_textView = (TextView)findViewById(R.id.textView1);

 

クリックイベントを取得する為には、CheckBox.OnCheckedChangeListenerをimplementsする必要があり、イベントをtoggleButtonに結びつける必要があります。

イベントが取得された際にonCheckedChangedが実行されますが、引数の値として、1つ目がそのクリックされたオブジェクト、2つ目が現在のトグルスイッチのbooleanでの値になります。

package in.andante.android.tbutton;

import android.app.Activity;
import android.os.Bundle;
import android.widget.TextView;
import android.widget.ToggleButton;
import android.widget.CheckBox;
import android.widget.CompoundButton;;

public class tButton extends Activity implements CheckBox.OnCheckedChangeListener{
 /** Called when the activity is first created. */
 
 private ToggleButton _toggleButton;
 private TextView _textView;
 
 @Override
 public void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.main);
 _toggleButton = (ToggleButton)findViewById(R.id.toggleButton1);
 _textView = (TextView)findViewById(R.id.textView1);
 _toggleButton.setOnCheckedChangeListener(this);
 }
 
 public void onCheckedChanged(CompoundButton _tbutton,boolean _checked){
 if(_checked){
 _textView.setText("これはON");
 }else{
 _textView.setText("これはOFF");
 }
 }
}

上記をパブリッシュすると、トグルスイッチの外部にある、TextViewの中の値も現在のオフの値かどうかによって、変化するはずです。

 

またボタンには下記の処理が含まれている。

 

値をセットする。

_btn.setChecked(true);

スイッチを切り替える。

_btn.toggle();

オンオフの取得

_btn.isChecked()

 

 

前後の記事

前の記事:

次の記事:

関連の記事

コメント

:D 通りすがり

わかりやすい。。。
初心者とは到底思えないわかりやすさ。。。

:D taiyou

次にコンストラクタで、この変数にオブジェクトを読み込みます。

_toggleButton = (ToggleButton)findViewById(R.id.toggleButton1);
_textView = (TextView)findViewById(R.id.textView1);

細かいことを指摘しますが、実際のコードでは上記処理はonCreate関数内で行なっています。
コンストラクタではないですね。

:D admin

>taiyouさま

おお、そうですね。コンストラクタではないですね。ご指摘ありがとうございます!

コメントの投稿

  • サイト内検索

新作アプリの紹介

関連サイトの紹介

アンドロイドアプリ開発TIPS
きぐるみカメラ
ふらいぱん
アンドロイドのデザイン集
Page top↑