CODEWITHSUNDEEP
android.netxamarin.androidmauiandroid-datepicker
testsonic_T
testsonic_T

Reputation: 1

Android styles.xml in Dark Mode overrides .Net Maui Splash Theme styles

I created a .Net MAUI application that has a native Android DatePicker. In the directory Platforms/Android/Resources I have two folders, values and values-night for the styles.xml of the Android DatePicker on light mode and on dark mode respectively which are very similar except for the colors they set. However, when I include the styles.xml in values-night, it seems that it is overriding other styles of the Maui.SplashTheme, causing the UI outside of the datepicker to have unwanted changes when the android device is set to dark mode. This is the code I currently have:

values/styles.xml

<?xml version="1.0" encoding="UTF-8" ?>
<resources> 
    <style name="Maui.MainTheme" parent="Theme.MaterialComponents.DayNight">  
        <item name="android:datePickerDialogTheme">@style/CustomDatePickerDialog</item>  
    </style> 

    <style name="CustomDatePickerDialog" parent="Theme.AppCompat.Light">  
         <item name="android:windowIsFloating">true</item>  
         <item name="colorAccent">#ff0000</item>  
         <item name="android:colorBackground">#0000ff</item>  
    </style> 
</resources>

values-night/styles.xml

<?xml version="1.0" encoding="UTF-8" ?>
<resources> 
    <style name="Maui.MainTheme" parent="Theme.MaterialComponents.DayNight">  
        <item name="android:datePickerDialogTheme">@style/CustomDatePickerDialog</item>  
    </style> 

    <style name="CustomDatePickerDialog" parent="Theme.AppCompat.Light">  
         <item name="android:windowIsFloating">true</item>  
         <item name="colorAccent">#000000</item>  
         <item name="android:colorBackground">#00ffff</item>  
    </style> 
</resources>

and including it in my MainActivity like this

[Activity(Theme = "@style/Maui.SplashTheme", MainLauncher = true, ConfigurationChanges = ConfigChanges.ScreenSize | ConfigChanges.Orientation | ConfigChanges.UiMode | ConfigChanges.ScreenLayout | ConfigChanges.SmallestScreenSize)]

The DatePicker is created on a .xaml page (for example) as:

<DatePicker MinimumDate="01/01/2022"
            MaximumDate="12/31/2022"
            Date="06/21/2022" />

I have implemented solutions such as the ones provided in this post but none seem to fix the unwanted changes on dark mode. Any suggestions would be appreciated.

Additionally, is there a way to switch between light and dark mode for android in .Net MAUI, rather than just obtaining it from the system settings?

Upvotes: 1

Views: 589

Answers (1)

Leon Lu
Leon Lu

Reputation: 9224

You need to change the Maui.SplashTheme to Maui.MainTheme in [Activity]

[Activity(Theme = "@style/Maui.MainTheme", MainLauncher = true, LaunchMode = LaunchMode.SingleTop, ConfigurationChanges = ConfigChanges.ScreenSize | ConfigChanges.Orientation | ConfigChanges.UiMode | ConfigChanges.ScreenLayout | ConfigChanges.SmallestScreenSize | ConfigChanges.Density)]

And please make sure the buildaction of values-night/styles.xml and values/styles.xml are Android resources.

I tested it, it is working in my side.

Upvotes: 0

Related Questions