Pick a date or time on Android in style

Min SDK   14
Latest Commit   2017-09-30 19:27:08
License   Apache-2.0

Github   https://github.com/wdullaer/MaterialDateTimePicker

         

标签

使用APP客户端扫描二维码运行Demo


         

类似的还有....
android-times-square Standalone Android widget for picking a single date from a calendar view.
Android-PickerView This is a picker view for android , support linkage effect, timepicker and optionspicker.(时间选择器、省市区三级联动)
android-calendar-card Android calendar view (like card)
README

README.md

Material DateTime Picker - Select a time/date in style

Join the chat at https://gitter.im/wdullaer/MaterialDateTimePicker Maven Central Build Status

Material DateTime Picker tries to offer you the date and time pickers as shown in the Material Design spec, with an easy themable API. The library uses the code from the Android frameworks as a base and tweaked it to be as close as possible to Material Design example.

Support for Android 4.0 and up.

Feel free to fork or issue pull requests on github. Issues can be reported on the github issue tracker.

Version 2 Layout

Date Picker Time Picker
Date Picker Time Picker

Version 1 Layout

Date Picker Time Picker
Date Picker Time Picker

Table of Contents

  1. Setup
  2. Using Material Date/Time Pickers
  3. Implement Listeners
  4. Create Pickers
  5. Theme the Pickers
  6. Additional Options
  7. FAQ
  8. Potential Improvements
  9. License

Setup

The easiest way to add the Material DateTime Picker library to your project is by adding it as a dependency to your build.gradle

dependencies {
  compile 'com.wdullaer:materialdatetimepicker:3.3.1'
}

You may also add the library as an Android Library to your project. All the library files live in library.

Using Material Date/Time Pickers

The library follows the same API as other pickers in the Android framework. For a basic implementation, you'll need to

  1. Implement an OnTimeSetListener/OnDateSetListener
  2. Create a TimePickerDialog/DatePickerDialog using the supplied factory
  3. Theme the pickers

Implement an OnTimeSetListener/OnDateSetListener

In order to receive the date or time set in the picker, you will need to implement the OnTimeSetListener or OnDateSetListener interfaces. Typically this will be the Activity or Fragment that creates the Pickers. The callbacks use the same API as the standard Android pickers.

@Override
public void onTimeSet(RadialPickerLayout view, int hourOfDay, int minute, int second) {
  String time = "You picked the following time: "+hourOfDay+"h"+minute+"m"+second;
  timeTextView.setText(time);
}

@Override
public void onDateSet(DatePickerDialog view, int year, int monthOfYear, int dayOfMonth) {
  String date = "You picked the following date: "+dayOfMonth+"/"+(monthOfYear+1)+"/"+year;
  dateTextView.setText(date);
}

Create a TimePickerDialog/DatePickerDialog using the supplied factory

You will need to create a new instance of TimePickerDialog or DatePickerDialog using the static newInstance() method, supplying proper default values and a callback. Once the dialogs are configured, you can call show().

Calendar now = Calendar.getInstance();
DatePickerDialog dpd = DatePickerDialog.newInstance(
  MainActivity.this,
  now.get(Calendar.YEAR),
  now.get(Calendar.MONTH),
  now.get(Calendar.DAY_OF_MONTH)
);
dpd.show(getFragmentManager(), "Datepickerdialog");

Theme the pickers

The library contains 2 layout versions for each picker.

  • Version 1: this is the original layout. It is based on the layout google used in the kitkat and early material design era
  • Version 2: this layout is based on the guidelines google posted when launching android marshmallow. This is the default and still the most current design.

You can set the layout version using the factory

dpd.setVersion(DatePickerDialog.Version.VERSION_2);

The pickers will be themed automatically based on the current theme where they are created, based on the current colorAccent. You can also theme the dialogs via the setAccentColor(int color) method. Alternatively, you can theme the pickers by overwriting the color resources mdtp_accent_color and mdtp_accent_color_dark in your project.

<color name="mdtp_accent_color">#009688</color>
<color name="mdtp_accent_color_dark">#00796b</color>

The exact order in which colors are selected is as follows:

  1. setAccentColor(int color) in java code
  2. android.R.attr.colorAccent (if android 5.0+)
  3. R.attr.colorAccent (eg. when using AppCompat)
  4. R.color.mdtp_accent_color and R.color.mdtp_accent_color_dark if none of the others are set in your project

The pickers also have a dark theme. This can be specified globablly using the mdtp_theme_dark attribute in your theme or the setThemeDark(boolean themeDark) functions. The function calls overwrite the XML setting.

<item name="mdtp_theme_dark">true</item>

Additional Options

  • TimePickerDialog dark theme
    The TimePickerDialog has a dark theme that can be set by calling
tpd.setThemeDark(true);
  • DatePickerDialog dark theme The DatePickerDialog has a dark theme that can be set by calling
dpd.setThemeDark(true);
  • setAccentColor(String color) and setAccentColor(int color) Set the accentColor to be used by the Dialog. The String version parses the color out using Color.parseColor(). The int version requires a ColorInt bytestring. It will explicitly set the color to fully opaque.

  • setOkColor() and setCancelColor() Set the text color for the OK or Cancel button. Behaves similar to setAccentColor()

  • TimePickerDialog setTitle(String title)
    Shows a title at the top of the TimePickerDialog

  • DatePickerDialog setTitle(String title) Shows a title at the top of the DatePickerDialog instead of the day of the week

  • setOkText() and setCancelText()
    Set a custom text for the dialog Ok and Cancel labels. Can take a resourceId of a String. Works in both the DatePickerDialog and TimePickerDialog

  • setMinTime(Timepoint time)
    Set the minimum valid time to be selected. Time values earlier in the day will be deactivated

  • setMaxTime(Timepoint time)
    Set the maximum valid time to be selected. Time values later in the day will be deactivated

  • setSelectableTimes(Timepoint[] times)
    You can pass in an array of Timepoints. These values are the only valid selections in the picker. setMinTime(Timepoint time), setMaxTime(Timepoint time) and setDisabledTimes(Timepoint[] times) will further trim this list down. Try to specify Timepoints only up to the resolution of your picker (i.e. do not add seconds if the resolution of the picker is minutes).

  • setDisabledTimes(Timepoint[] times)
    You can pass in an array of Timepoints. These values will not be available for selection. These take precedence over setSelectableTimes and setTimeInterval. Be careful when using this without selectableTimes: rounding to a valid Timepoint is a very expensive operation if a lot of consecutive Timepoi