【Android】DatePickerとTimePickerの変更リスナーを実装する方法を徹底解説

この記事では、AndroidアプリにおいてDatePicker（日付選択）とTimePicker（時刻選択）の変更リスナー（ChangeListener）を実装する方法を、実際のサンプルコードとともにステップ形式で解説します。ユーザーが日付や時刻を変更したタイミングを検知し、Toastで結果を表示するシンプルなデモアプリを作成していきましょう。

ステップ1：新規プロジェクトを作成する

まず、Android Studioを起動し、メニューから「File」→「New Project」を選択して新しいプロジェクトを作成します。必要な項目（プロジェクト名、パッケージ名、保存先など）を入力してプロジェクトの雛形を生成してください。

ステップ2：メイン画面のレイアウトを作成する

次に、res/layout/activity_main.xmlに以下のコードを追加します。画面中央にはDatePickerを配置し、その下にはTimePicker画面へ遷移するためのボタンを設置しています。

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="https://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <DatePicker
        android:id="@+id/datePicker"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"/>
    <Button
        android:id="@+id/btnTime"
        android:layout_below="@id/datePicker"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="時刻選択画面を表示する"
        android:textStyle="bold"
        android:layout_centerInParent="true"
        android:layout_marginTop="36dp"/>
</RelativeLayout>

ステップ3：MainActivityに日付変更リスナーを実装する

src/MainActivity.javaに以下のコードを記述します。setOnDateChangedListener()を使うことで、ユーザーがDatePickerの日付を変更した瞬間を検知できます。変更された年・月・日はコールバックの引数として受け取れるので、それらをToastで表示しています。

import android.annotation.TargetApi;
import android.content.Intent;
import android.os.Build;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.Button;
import android.widget.DatePicker;
import android.widget.Toast;
public class MainActivity extends AppCompatActivity {
    Button btnTime;
    @TargetApi(Build.VERSION_CODES.O)
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        btnTime = findViewById(R.id.btnTime);
        DatePicker datePicker = findViewById(R.id.datePicker);
        datePicker.setOnDateChangedListener(new DatePicker.OnDateChangedListener() {
            @Override
            public void onDateChanged(DatePicker view, int year, int monthOfYear, int dayOfMonth) {
                Toast.makeText(MainActivity.this,
                    "変更された日付： " + year + "年 " + (monthOfYear + 1) + "月 " + dayOfMonth + "日",
                    Toast.LENGTH_LONG).show();
            }
        });
        btnTime.setOnClickListener(new View.OnClickListener(){
            @Override
            public void onClick(View v) {
                Intent intent = new Intent(MainActivity.this, TimePicker.class);
                startActivity(intent);
            }
        });
    }
}

ポイント： onDateChanged()のmonthOfYearは0始まり（1月=0）で渡されるため、表示する際は「+1」することを忘れないようにしましょう。

ステップ4：TimePicker画面のレイアウトを作成する

新しいアクティビティ用のレイアウトファイルactivity_time_picker.xmlを作成し、以下のコードを追加します。ここでは画面中央にTimePickerを配置するだけのシンプルな構成です。

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="https://schemas.android.com/apk/res/android"
    xmlns:tools="https://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".TimePicker">
    <TimePicker
        android:id="@+id/timePicker"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"/>
</RelativeLayout>

ステップ5：TimePickerに時刻変更リスナーを実装する

TimePicker.javaに以下のコードを追加します。setOnTimeChangedListener()を設定することで、ユーザーが時刻のホイールを操作するたびにonTimeChanged()が呼び出され、変更後の時・分を取得できます。

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.Toast;
public class TimePicker extends AppCompatActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_time_picker);
        android.widget.TimePicker timePicker = findViewById(R.id.timePicker);
        timePicker.setOnTimeChangedListener(new android.widget.TimePicker.OnTimeChangedListener() {
            @Override
            public void onTimeChanged(android.widget.TimePicker view, int hourOfDay, int minute) {
                Toast.makeText(TimePicker.this,
                    "変更された時刻： " + hourOfDay + "時 " + minute + "分",
                    Toast.LENGTH_SHORT).show();
            }
        });
    }
}

ステップ6：AndroidManifest.xmlにアクティビティを登録する

最後に、androidManifest.xmlに作成したTimePickerアクティビティを登録します。これを忘れると画面遷移時にアプリがクラッシュするので注意してください。

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="https://schemas.android.com/apk/res/android" package="app.com.sample">
    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">
        <activity android:name=".TimePicker"></activity>
        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>
</manifest>

アプリを実行して動作を確認しよう

それでは、実際にアプリを起動して動作を確認してみましょう。Android端末をPCにUSB接続していることを前提に説明します。Android Studioのツールバーにある「Run（実行）」アイコンをクリックし、接続した実機を選択してアプリをインストールしてください。

アプリが起動すると、まずメイン画面にDatePickerが表示されます。日付を変更すると、変更後の日付がToastで表示されます。さらにボタンをタップするとTimePicker画面へ遷移し、時刻を操作するたびに変更後の時刻がリアルタイムにToastで通知されます。

まとめ

本記事では、AndroidのDatePickerとTimePickerに対して変更リスナーを設定し、ユーザーの操作を検知する方法を紹介しました。日付変更にはsetOnDateChangedListener()、時刻変更にはsetOnTimeChangedListener()を使用するのが基本です。フォーム入力や予約機能など、日時を扱うUIを実装する際の参考にぜひ活用してください。