CODEWITHSUNDEEP
androidandroid-layoutdatepicker
user3800670
user3800670

Reputation: 101

Android: How to change the selected date's color in a DatePicker element?

I am new to android programming and I want to use DatePicker element in my layout. I am able to use it successfully but I can't figure out how to change its selected date color. I have read many threads on this site and they talk about changing color in a DatePickerDialog. I have tried to follow similar approaches for the DatePicker element but could not do it. I can change the date's textColor using calendarTextColor attribute. My code for layout file is as follows:

<LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center">

            <DatePicker
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/datePicker"
                android:datePickerMode="calendar"
                android:spinnersShown="false"
                android:layout_gravity="center"

                android:layout_marginTop="-52dp"
                android:layout_marginBottom="-20dp"
                style="@style/MyDatePickerStyleTheme"
                />

</LinearLayout>

And here is the corresponding styles.xml code:

<style name="MyDatePickerStyleTheme" parent="@android:style/Theme.Holo.Light.Dialog">
    <item name="colorAccent"> #00ff00 </item>

    <item name="android:datePickerStyle">@style/MyDatePickerStyle</item>
    <item name="android:colorPrimary"> #00ff00 </item>
    <item name="android:colorPrimaryDark"> #00ff00 </item>
    <item name="android:colorAccent"> #00ff00 </item>
    <item name="android:backgroundTint"> #00ff00 </item>
    <!-- <item name="android:calendarTextColor"> #00ff00 </item> -->


</style>

<style name="MyDatePickerStyle">
    <item name="android:calendarTextColor"> #00ff00 </item>
</style>

Some extra points I like to add:

  1. android:calendarTextColor attribute is working if I put it inside MyDatePickerStyleTheme but not working when putting inside MydatePickerStyle.
    In other words the later theme style is not having any effect.
  2. On different android versions (Lollipop and Marshmallow), same code gives very different looking layouts.
  3. I just want to change selected date color for now, but how to change spacing between the dates and other styles in a good manner.

Any help would be highly appreciated.

Upvotes: 5

Views: 5355

Answers (3)

HurrJackal
HurrJackal

Reputation: 21

Add to your styles.xml

<style name="MyDatePickerDialogTheme" parent="android:Theme.Material.Light.Dialog">
    <item name="android:datePickerStyle">@style/MyDatePickerStyle</item>
    <item name="android:colorAccent">@color/beautiful_color</item>
</style>

<style name="MyDatePickerStyle" parent="@android:style/Widget.Material.Light.DatePicker">
    <item name="android:headerBackground">@color/beautiful_color</item>
    <item name="android:datePickerMode">calendar</item>
</style>

Then in the layout where is your view, add the android:theme attribute, instead of the style

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

Upvotes: 2

prakashgunasekaran
prakashgunasekaran

Reputation: 1

please go through the below link it working perfectly fine for me... [change date picker theme color]

https://github.com/wdullaer/MaterialDateTimePicker

Upvotes: 0

Harsh Bhavsar
Harsh Bhavsar

Reputation: 1671

<style name="MyDatePickerDialogTheme" parent="Theme.AppCompat.Light.Dialog">
<!-- this is new -->
<item name="colorAccent">@color/accent</item>

<item name="android:datePickerStyle">@style/MyDatePickerStyle</item>
<item name="android:colorAccent">@color/primDark</item>


<style name="MyDatePickerStyle" parent="@android:style/Widget.Material.Light.DatePicker">
<item name="android:headerBackground">@color/prim</item>
<item name="android:calendarTextColor">@color/primDark</item>
<item name="android:dayOfWeekBackground">@color/primDark</item>
<item name="android:yearListSelectorColor">@color/accent</item>
<item name="android:datePickerMode">calendar</item>
<item name="android:minDate">01/01/2000</item>

Upvotes: 1

Related Questions