日時の扱い方（DatePickerDialog, TimePickerDialog, DialogFragment）

Android

（ブログ記事の一覧は「こちら」）

日付や時間を入力するためのコンポーネントとして、DatePicker, TimePicker が用意されています。また、それぞれを入力するためのダイアログとして DatePickerDialog, TimePickerDialog が用意されています。
それぞれのダイアログは、新たに作成する DialogFragment クラスから呼び出す必要があります。

ここで学ぶこと

  • DatePickerDialog（日付を入力するためのダイアログ）
  • TimePickerDialog（時間を入力するためのダイアログ）
  • DialogFragment（Pickerを呼び出すのに使用することが推奨されている）

例題

作成するもの

DatePickerDialog, TimePickerDialog を表示するサンプルプログラムを作成します。Pickerを呼び出すには、DialogFragmentクラスを使用することが推奨されています。
やや構成が複雑なので、まずはサンプルプログラムを実行してみましょう。

レイアウト

activity_main.xml に以下のコントロールを配置します。

  • Button（R.id.button_date）
  • TextView（R.id.textView_date）
  • Button（R.id.button_time）
  • TextView（R.id.textView_time）
  • Button（R.id.button_calc）（課題2で使用）
  • TextView（R.id.textView_calc）（課題2で使用）

DatePickerDialogFragment, TimePickerDialogFragment は、レイアウトファイルは不要です。

プログラム

新規に「DatePickerDialogFragment.java」をテキストエディタで作成して、「MainActivity.java」と同じ場所に置いてください。

package xxxxxxxx;

import android.app.DatePickerDialog;
import android.app.Dialog;
import android.os.Bundle;
import android.support.v4.app.DialogFragment;
import android.widget.DatePicker;
import java.util.Calendar;

public class DatePickerDialogFragment extends DialogFragment implements DatePickerDialog.OnDateSetListener {

    @Override
    public Dialog onCreateDialog(Bundle savedInstanceState) {
        Calendar calendar = Calendar.getInstance();
        int iYear = calendar.get(Calendar.YEAR);
        int iMonth = calendar.get(Calendar.MONTH);
        int iDayOfMonth = calendar.get(Calendar.DAY_OF_MONTH);

        return new DatePickerDialog(getActivity(), (MainActivity)getActivity(), iYear, iMonth, iDayOfMonth);
    }

    @Override
    public void onDateSet(DatePicker datePicker, int year, int month, int day) {
        // 日付が選択されたときの処理
    }
}


新規に「TimePickerDialogFragment.java」をテキストエディタで作成して、「MainActivity.java」と同じ場所に置いてください。

package xxxxxxxx;

import android.app.Dialog;
import android.app.TimePickerDialog;
import android.os.Bundle;
import android.support.v4.app.DialogFragment;
import android.widget.TimePicker;
import java.util.Calendar;

public class TimePickerDialogFragment extends DialogFragment implements TimePickerDialog.OnTimeSetListener {

    @Override
    public Dialog onCreateDialog(@Nullable Bundle savedInstanceState) {
        final Calendar c = Calendar.getInstance();
        int hour = c.get(Calendar.HOUR_OF_DAY);
        int minute = c.get(Calendar.MINUTE);

        return new TimePickerDialog(getActivity(), (Sample12MainActivity)getActivity(), hour, minute, true);
    }

    @Override
    public void onTimeSet(TimePicker timePicker, int hourOfDay, int minute) {
        // 時刻が選択されたときの処理
    }
}


MainActivityは、それぞれのダイアログのリスナー（DatePickerDialog.OnDateSetListener, TimePickerDialog.OnTimeSetListener）を登録しています。

public class MainActivity extends AppCompatActivity implements DatePickerDialog.OnDateSetListener, TimePickerDialog.OnTimeSetListener {

    public static final String TAG_DatePicker = "DatePicker";
    public static final String TAG_TimePicker = "TimePicker";

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        Button buttonDate = findViewById(R.id.button_date);
        buttonDate.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                DatePickerDialogFragment dialog = new DatePickerDialogFragment();
                dialog.show(getSupportFragmentManager(), TAG_DatePicker);
            }
        });

        Button buttonTime = findViewById(R.id.button_time);
        buttonTime.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                TimePickerDialogFragment dialog = new TimePickerDialogFragment();
                dialog.show(getSupportFragmentManager(), TAG_TimePicker);
            }
        });

    }

    // DatePickerDialogFragment からの受け取り
    @Override
    public void onDateSet(DatePicker datePicker, int year, int month, int dayOfMonth) {
        // month: 0-11
        int iMonth = month + 1;

        TextView textViewDate = findViewById(R.id.textView_date);
        textViewDate.setText("" + year + "/" + iMonth + "/" + dayOfMonth);
    }

    // TimePickerDialogFragment からの受け取り
    @Override
    public void onTimeSet(TimePicker timePicker, int hourOfDay, int minute) {
        TextView textViewTime = findViewById(R.id.textView_time);
        textViewTime.setText("" + hourOfDay + ":" + minute);
    }
}

実行、確認

Buttonをクリックすると、DatePickerDialog, TimePickerDialog が表示され、OKを選択すると、選択した日付／時間がTextViewに表示されます。

課題1

プリファレンス（SharedPreferences）を使用して、以下の動作になるように、例題のサンプルプログラムを修正してください。

  • DatePickerDialog, TimePickerDialog で設定した日付／時間の保存
  • それぞれのTextViewに、設定した日付／時間を表示
  • それぞれのダイアログを呼び出したとき、保存した日付／時間が選択されるようにする

課題2

レイアウトに Button（R.id.button_calc）と TextView（R.id.textView_calc）を追加して、Buttonをクリックすると、「現在の日付／時間」から「それぞれのダイアログで設定した日付／時間」の引き算を行い、計算結果をTextViewに表示するようにプログラムを修正してください。