How to Change the Datepicker style for Android

I'm currently making a registration form, and one of the fields is for the users Date of Birth. I want to use datepicker, however I don't want the calendar layout as shown below:

I want the layout to look something like this so that way its easier to choose the year and month without having to scroll through everything:

However I do not know how to go about this, or what to put inside the styles.xml file. Any help would be greatly appreciated.

5 Answers
5

Add this to style.xml

style.xml

<style name="date_picker_theme" parent="@android:style/Widget.DatePicker">


And then you should apply style for your date picker like this:

<DatePicker
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/datePicker"
style="@style/date_picker_theme" />


Create style with

<style name="DatePicker" parent="@android:style/Theme.Holo.Light">
<item name="android:datePickerStyle">@android:style/Widget.DatePicker</item>
</style>


Then in custom fragment dialog xml

<DatePicker
android:theme="@style/DatePicker"
android:id="@+id/fragment_date_picker_control"
android:datePickerMode="spinner"
android:spinnersShown="true"
android:calendarViewShown="false"
android:layout_marginLeft="@dimen/margin_normal"
android:layout_marginRight="@dimen/margin_normal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal" />


Link : http://yogeshkalwar.blogspot.in/2017/08/custom-spinner-datepicker-supporting-n70.html

To set the DatePicker style globally, add the following to style.xml, or adjust existing content:

style.xml

<resources>
<style name="AppTheme" parent="@style/Theme.AppCompat.Light">
<item name="android:datePickerStyle">@style/MyDatePicker</item>
</style>
...
</resources>


And define your customized DatePicker style, either in style.xml or a separate file, e.g.:

style.xml

<resources>
<style name="MyDatePicker" parent="@android:style/Widget.DatePicker">
<item name="android:calendarViewShown">false</item>
<item name="android:datePickerMode">spinner</item>
</style>
</resources>


Above properties are of XML, if you want to set it programmatically you can you the below code but I haven't checked this code whether its working or not.

datepickerDialog_object.getDatePicker().setSpinnersShown(true);
datepickerDialog_object.getDatePicker().setCalendarViewShown(false);


DatePickerDialog has a convenience method, where you set the desired layout.

public DatePickerDialog(@NonNull Context context, @StyleRes int themeResId,
@Nullable OnDateSetListener listener, int year, int monthOfYear, int dayOfMonth)
this(context, themeResId, listener, null, year, monthOfYear, dayOfMonth);



public static final int MODE_SPINNER = 1;
public static final int MODE_CALENDAR = 2;


Passing 1 or 2 in themesResId does the trick.

Thanks for contributing an answer to Stack Overflow!

But avoid …

To learn more, see our tips on writing great answers.

Required, but never shown

Required, but never shown

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.