Changes To Application Theme At Runtime Not Handled Very Well

[Paul Parkins]

Hi. I was using Syncfusion for Xamarin.Forms 21.2.3 but I have now upgraded to the latest 22.1.38, and I can confirm the problem also exists in this version too.

My Xamarin.Form 5 shell application allows the user to configure if they prefer light or dark themes, and will switch at runtime by setting the application property Application.Current.UserAppTheme

It has been reported to me that after having switched themes, SfNumericalTextBox ui controls no longer look editable, unless the application is restarted. I have confirm this report is accurate, and have also observed an anomaly with regards to the BorderColor property.....

Although my application makes use of application wide styles in App.xaml and sometimes also local styles defined within the .xaml for pages, I actually had not assigned any default value for SfNumericTextBox.BoarderColor in any style. This means that the "border" (actually the underlining of the editable area) is the default pink colour, the same as the flashing cursor. Here are 3 such controls, in first "Light" then "Dark" themes

 

which look like then when I have switched theme to "Dark" and "Light" respectively

 

As you can see the "border" (underlining) is no longer visible. Whilst not capture in the last 2 images above, the pink cursor was still flashing. Once the app is restarted, it looks ok again

So I tried adding a default color for both Light and Dark themes in my SfNumericTextBox style, rather than relying on any other default

    <Setter Property="BorderColor" Value="{AppThemeBinding Dark=Red, Light=Lime}" />

And now I find that whilst it does take note of the new defaults, when I change the theme, it causes the background of the whole of the SfNumericTextBox to go that colour.  One the app is restarted, it looks ok again.

These images show the same as above, but when my style provides a BorderColor property

 

when switched to dark and light repectively

 

So to conclude, I believe this control is making correct use of the property as defined by the theme, except where the theme changes at runtime.  

[AhamedAliNishad JahirHussain]

 

Hi Paul,

 

We have reviewed your query and have created a sample based on the provided information. But we were not able to reproduce the reported problem at our end. We have attached tested sample for your reference. In the sample, we have changed the Dark theme and LightTheme using the  App.Current.UserAppTheme in Button Clicked event. We have also set the BorderColor and TextColor of the NumericTexbox based on the AppThemeBinding as shown in the code snippet below .

 

Code Snippet :

 

<Style TargetType="syncfusion:SfNumericTextBox">

               <Setter Property="BorderColor" Value="{AppThemeBinding Dark={StaticResource BorderDarkColor},Light={StaticResource BorderLightColor}}"/>

               <Setter Property="TextColor" Value="{AppThemeBinding Dark={StaticResource NumericDarkTextColor},Light={StaticResource NumericLightTextColor}}"/>

           </Style>

 

To better understand the root cause and assist with resolving the issue, it would be helpful if you could provide more detailed information about the scenario in which our control was used, including a sample demonstrating the issue with replication steps. Additionally, we would like to know in which platform do you face this issue.

 

Kindly review the attached example and apply any required modifications to reproduce the problem. Afterward, kindly forward the sample to us, as it would enable us to conduct a more thorough investigation of the issue.

 

Regards,
Ahamed Ali Nishad.

Attachment: NumericTheme_7c0f87de.zip

[Paul Parkins]

Hi,

Thanks for your reply. As requested I have attached an updated version of your sample project, that now demonstrates the problem.

The major difference between your project and my project is that

• I have an application wide style called NumericTextBoxStyle which is defined in App.xaml. 
• I have a style local to my Numeric.xaml view which is based on NumericTextBoxStyle and is called EditableCountsStyle
• I have a number of SfNumericTextBox component using the style EditableCountStyle

When running this project, in the "Numeric" page, when you switch between Light and Dark themes, the 3 numerics that I added go Green and Red respectively.  In my style I configure only the BoardColor to change to these colors, but in fact it appears to change BackgroundColor.  

I hope this helps

Paul 

Attachment: NumericThemeDemonstratingProblem_91fc2069.zip

[AhamedAliNishad JahirHussain]

Hi Paul,

 

Currently we are checking the reported query based on your provided sample and will let you know the details on July 24,2023. We appreciate your patience until then.

 

Regards,

Ahamed Ali Nishad

[Brundha Velusamy]

Hi Paul,

 

Currently, we are validating the reported query based on provided sample and will let you know the details on July 26, 2023. We appreciate your patience until then.

 

Regards,

Brundha V.

[AhamedAliNishad JahirHussain]

Hi Paul,

 

We have reviewed your query and checked the source code for the reported issue in the Android platform. On further analysis, we would like to inform you that, the numeric textbox input field class inherits from Native EditText and there is an issue with dynamic changes of theme in the Native EditText. We have prepared a workaround to resolve the issue in sample . In the modified sample, we have added the SfNumericTextBox in the Grid and set the backgroundColor property to the grid through styles based on the Dark Theme and Light Theme. We have attached the modified sample for your reference. Please get the attached sample and let us know if you need any other details.

 

Regards,

Ahamed Ali Nishad.

Attachment: NumericTheme_5a953f30.zip

[Paul Parkins]

Hi,

Thanks for your reply and workaround, and apologies for my late response as I was on holiday.

I can confirm that your sample project with the workaround did work, though it did not have the same effect on my actual application when I tried the same as your reply implied was the workaround.  So I identified the actual differences between the last 2 projects, and then manually reverted them until the problem re-occured.

The change made in your fixed project appeared to be:

1. SfNumericTextBox upgraded from 22.1.38 to 22.1.39
   
2. SfNumericTextBox control added within a grid, rather than left to be in the container StackLayout
3. Grid containing SfNumericTextBox control has a style assigned, providing a default BackgroundColor.
4. Style being used for the SfNumerTextBox control's, had the default BackgroundColour setter removed.

I have proven to myself that changes 1 to 3 inclusive, had no effect on the problem.

Only change 4 affected the problem.

So other interested readers of this thread may be interested to know that I conclude the problem I was experiencing, only occurs when you have provided a default BackgroundColour property.  Remove this property setting and the problem disappears.

Thanks for your help in this. You may now close this ticket.

regards

Paul

[Preethi Rajakandham]

Hi Paul,

You're Welcome. Please let us know if you have any further queries on this. We are happy to help.

Regards,

Preethi R