2012年05月17日

カウントダウンタイマーを作成する


AndroidではCountDownTimerを用いて簡単にタイマー機能を実装することが可能です
手順としては
(1)CountDownTimerを継承したクラスの作成
(2)カウントダウンの開始と中止メソッドの実装
の2つです

CountDownTimerを継承したクラスの作成
CountDownTimerクラスを利用するには、CountDownTimerクラスを継承したクラス
(今回はMyCountDownTimer)を作成します

MyCountDownTimerクラスには2つのメソッドを実装します
onTick():指定したインターバル毎に呼ばれる
onFinish():カウントダウン終了後に呼ばれる
public class MyCountDownTimer extends CountDownTimer{
 
    public MyCountDownTimer(long millisInFuture, long countDownInterval) {
        super(millisInFuture, countDownInterval);
     }
 
    @Override
    public void onFinish() {
        // カウントダウン完了後に呼ばれる
    }
 
    @Override
    public void onTick(long millisUntilFinished) {
        // インターバル(countDownInterval)毎に呼ばれる
            }
}
MyCountDownTimerの第一引数(millisInFuture)はカウントダウンの開始値
第2引数(countDownInterval)は何秒毎にカウントダウンを行うかのインターバルをそれぞれ指定します

onTIck()の引数にはミリ秒単位で数値が渡されてくるので秒への変換は1000をかけます

カウントダウンとの開始と中止
MyCountDownTimerが実装できたらカウントダウンの開始と停止です
カウントダウンの開始には、start()
カウントダウンの中止を行うにはcancel()を利用します
また初期値インスタンス生成の引数にはカウントダウンの開始値とインターバルを
それぞれミリ秒単位で設定します

CountDownTimerサンプルプログラム
今回は2つのボタンを配置しstartボタンを押すと3分間のカウントダウンを開始
stopボタンでストップさせるプログラムを作成しました
まずはレイアウトからです
残り時間を表すTextViewとstartとstopボタンの配置です
main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
	android:layout_width="fill_parent"
	android:layout_height="fill_parent"
	android:orientation="vertical" >

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="0:00" />

    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="start" />

    <Button
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="stop" />
    
</LinearLayout>

次にMainActivity.javaを変更します
package blog.test;
 
import android.app.Activity;
import android.os.Bundle;
import android.os.CountDownTimer;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.TextView;
import android.widget.Toast;
 
public class MainActivity extends Activity {
	TextView timer;
	Button start,stop;
	@Override
	  protected void onCreate(Bundle savedInstanceState) {
	    super.onCreate(savedInstanceState);
	    setContentView(R.layout.main); 
	    timer = (TextView)findViewById(R.id.textView1);
	    start =(Button)findViewById(R.id.button1);
	    stop =(Button)findViewById(R.id.button2);
	
	    //CountDownの初期値
	    final MyCountDownTimer cdt = new MyCountDownTimer(180000, 1000);
	     
	    start.setOnClickListener(new View.OnClickListener() {
	    	
	        public void onClick(View v) {
	            // カウントダウン開始
	            cdt.start();
	        }
	    });
	    
	    stop.setOnClickListener(new OnClickListener(){
	        public void onClick(View v) {
	            // カウントダウン中止
	            cdt.cancel();
	        }
	    });
	}	
	
	
	
	public class MyCountDownTimer extends CountDownTimer{

	    public MyCountDownTimer(long millisInFuture, long countDownInterval) {
	        super(millisInFuture, countDownInterval);
	 
	    }
	 
	    @Override
	    public void onFinish() {
	        // カウントダウン完了後に呼ばれる
	        timer.setText("0");
	        Toast.makeText(getApplicationContext(), "終了", Toast.LENGTH_LONG).show();
	    }
	 
	    @Override
	    public void onTick(long millisUntilFinished) {
	        // インターバル(countDownInterval)毎に呼ばれる
	        timer.setText(Long.toString(millisUntilFinished/1000/60) + ":" + Long.toString(millisUntilFinished/1000%60));
	    }
	}
}

MyCountDownTimer cdt = new MyCountDownTimer(180000, 1000)により
初期値は180000ミリ秒(=180秒)、1000ミリ秒毎にonTickが呼ばれる設定です
onTickでは残りの分(millisUntilFinished/1000/60)と
秒(millisUntilFinished/1000%60)に分けて表示させています

これを実行すると
device105.png

startボタンを押すとカウントダウンがスタートします
device106.png

タイマーが0になると終了です
device107.png
スポンサードリンク

posted by kenken at 10:39 | Comment(0) | TrackBack(0) | タイマー カウントダウン | このブログの読者になる | 更新情報をチェックする
この記事へのコメント
コメントを書く
お名前:

メールアドレス:

ホームページアドレス:

コメント:

認証コード: [必須入力]


※画像の中の文字を半角で入力してください。
※ブログオーナーが承認したコメントのみ表示されます。

この記事へのトラックバック
×

この広告は1年以上新しい記事の投稿がないブログに表示されております。