maui
maui copied to clipboard
Fix Text entry border disappear when changing to/from dark mode in Android
Root cause
The issue occurs because the border color of the Entry, Editor, Picker, TimePicker and DatePicker control in Android does not automatically update when switching between light and dark modes. The underlying problem is that the border color is not being re-applied or refreshed when the theme changes, leading to the border disappearing or not reflecting the correct color.
Description of Change
In the overridden method of OnConfigurationChanged in MauiAppCompatActivity.Lifecycle, we invoked a ThemeChanged event, subscribed to it from the handlers, and called the UpdateBackground method.
Issues Fixed
Fixes #15524
Tested the behaviour in the following platforms
- [x] Android
- [ ] Windows
- [x] iOS
- [x] Mac
Windows bug report #24923
Output
Before
https://github.com/user-attachments/assets/e1903921-44ab-4f2b-be44-76012ba366aa
After
https://github.com/user-attachments/assets/e472f578-f903-4cb1-bded-769096a52b28
/azp run
Azure Pipelines successfully started running 3 pipeline(s).
All Android Views have a method
OnConfigurationChangedthat you can override which will fire when the theme changes. I think instead of having to wire this up inside controls you can instead overrideOnConfigurationChangedand then I think you'd need to just add an event we can subscribe to from the handler.Then the Handler could call UpdateBackground
Regarding the override of OnConfigurationChanged in Android Views, initially, I override OnConfigurationChanged in the MauiAppCompatEditText for the Entry control, invoked the event in the method, and subscribed to it from the EntryHandler.
After deploying the sample with this change, I observed that OnConfigurationChanged in MauiAppCompatEditText does not get triggered when changing the theme via a button click, so the theme does not change. However, when I changed the theme through the device's system settings (Android mobile), OnConfigurationChanged was triggered. Please refer to the attached video showing the difference between the button click and device theme change in terms of how OnConfigurationChanged behaves in Android Views.
As a result, we have used the event in the already overridden OnConfigurationChanged method within MauiAppCompatActivity.Lifecycle. In this implementation, both theme changes via button click and mobile system theme changes work correctly.
Please share your suggestions on this change.
https://github.com/user-attachments/assets/799bdcdb-719b-4c32-a354-411da1e6f007
https://github.com/user-attachments/assets/21124ab4-819b-461a-a0fd-bd83bb243a0d
/azp run
Azure Pipelines successfully started running 3 pipeline(s).
/azp run
Azure Pipelines successfully started running 3 pipeline(s).
/rebase
Mnn, probably happens the same on the SearchBar, could you validate it? If happens, could you update the test to include the SearchBar?
@jsuarezruiz, I've tested the search bar issue and found that the colors of the underline and search icon do not change based on the theme. Additionally, the background implementation of the search bar differs from that of other fixed controls.
@Ahamed-Ali created a separate bug report for the theme issue with the search bar. We'll check this report https://github.com/dotnet/maui/issues/25153
/azp run
Azure Pipelines successfully started running 3 pipeline(s).
@devanathan-vaithiyanathan Could you rebase to fix the conflicts?
@devanathan-vaithiyanathan Could you rebase to fix the conflicts?
I have rebased the branch and resolved the conflicts
/rebase
/azp run
Azure Pipelines successfully started running 3 pipeline(s).
/azp run
Azure Pipelines successfully started running 3 pipeline(s).
Could you rebase to fix the conflicts? Thanks in advance.
https://github.com/dotnet/maui/pull/24433/files#r1794298751