Disable Darkmode of all syncfusion controls ? complete app.

Hello,

i dont want support darkmode in my app.
- So is there a way to disable it ?

- if not, how can i overwrite the theming of all sftextinputlayout ?

-is there a example of how use dark mode theme in a app ?

i have try with this way , but didnt work:



        <syncTheme:SyncfusionThemeDictionary x:Key="SyncfusionThemeDictionary">

            <syncTheme:SyncfusionThemeDictionary.MergedDictionaries>

                <ResourceDictionary>

                    <x:String x:Key="SfTextInputLayoutTheme">CustomTheme</x:String>

                    <Color x:Key="SyncPrimaryColor">LimeGreen</Color>

                    <Color x:Key="SyncPrimaryDarkColor">LimeGreen</Color>

                    <Color x:Key="SfCircularGaugeScaleRimColor">Green</Color>

                    <Color x:Key="SfTextInputLayoutFilledLineDisabledColor">Blue</Color>

                    <Color x:Key="SfTextInputLayoutOutlinedLineDisabledColor">Blue</Color>

                    <Color x:Key="SfTextInputLayoutDisabledHintColor">Blue</Color>

                    <Color x:Key="SfTextInputLayoutFloatedHintDisabledColor">Blue</Color>

                    <Color x:Key="SfTextInputLayoutHelperTextDisabledColor">Blue</Color>

                </ResourceDictionary>

            </syncTheme:SyncfusionThemeDictionary.MergedDictionaries>

        </syncTheme:SyncfusionThemeDictionary>






5 Replies

SS Sridevi Sivakumar Syncfusion Team June 21, 2021 09:28 AM UTC

Hi Johannes Meyer,

We have analysed your reported query and the dark theme will be applied to the control when you set the theme as DarkTheme as per the below UG links.

https://help.syncfusion.com/xamarin/themes/themes#merging-the-dictionaries
https://help.syncfusion.com/xamarin/themes/themes#control-style-resource-dictionaries
https://help.syncfusion.com/xamarin/themes/themes#overriding-the-default-theme

If you not add the DarkTheme in application resource dictionary, the dark theme won't be applied to the syncfusion control.

Please check whether you set the dark theme in code behind or  Xaml.

If you not set dark theme but dark theme applied in your application, please let us know with your application code files. This would be helpful for us to give better solution in this.

Regards,
Sridevi S.
 
 



JM Johannes Meyer June 21, 2021 07:44 PM UTC

thanks for your help.


i havent set a dark theme like descripe in the articles ,

but the control LSfTextInput with SfNumericText and DatePicker have with Darkmode in simulator enabled a white font,

Without darkmode they have a block text color.

im using the newest xamarin forms version 5.00 and syncfusion 19.1.0.69


this is an example of one wich has a white text color with dark mode.


            <Style x:Key="LSfTextInputDefaultStyleBlack" TargetType="textInputLayout:SfTextInputLayout">

                <Setter Property="FocusedColor" Value="Black" />

                <Setter Property="ErrorColor" Value="Red" />

                <Setter Property="UnfocusedColor" Value="Black" />

                <Setter Property="ContainerType" Value="None" />

            </Style>


            <Style x:Key="DatePickerDefaultStyle" TargetType="DatePicker">

                <Setter Property="FontSize" Value="20"></Setter>

                <Setter Property="TextColor" Value="Black"></Setter>

            </Style>


<textInputLayout:SfTextInputLayout

                    Grid.Row="4"

                        Hint="xxx"

                        ErrorText="xxx"

                        HasError="{Binding bind}"

                        Style="{StaticResource LSfTextInputDefaultStyleBlack}">

                    <DatePicker Style="{StaticResource DatePickerDefaultStyle}"

                                IsEnabled="False"

                                        Date="{Binding ZahlungsZiel, Mode=TwoWay}"/>

                </textInputLayout:SfTextInputLayout>



SS Sridevi Sivakumar Syncfusion Team June 23, 2021 10:58 AM UTC

Hi Johannes Meyer,

We would like to inform you that, you can disable the dark theme for your application and controls by setting the below code snippet in your application.

Code snippet:
 
iOS: 
Info.Plist: 
<key>UIUserInterfaceStyle</key> 
 <string>Light</string> 
 
Android:
protected override void OnCreate(Bundle savedInstanceState)
{
AppCompatDelegate.DefaultNightMode = AppCompatDelegate.ModeNightNo;
base.OnCreate(savedInstanceState);

}
 
 



JM Johannes Meyer June 23, 2021 05:42 PM UTC

thanks , but this is a bad solution because
" But it seems Apple requires us to implement the Dark Mode for iOS 13 and if you disable it using this key your app will be probably rejected when publishing. The doc says it is only used for temporarily: "

greets


can you please check if its a bug of LSfTextInput and darkmode ? i have no dark mode theme in my application.



SS Sridevi Sivakumar Syncfusion Team June 24, 2021 01:43 PM UTC

Hi Johannes Meyer,

We can override the default style of TextInputLayout property in sample level. Based on your requirement, we have prepared a sample. In that, we have customized the SfTextInputLayout style for control’s enabled and disabled state by using custom theme.

Below code will be applied properly in device Dark mode with application dark and light theme.

[MainPage.XAML]:
 
 
<ContentPage.Resources>
<syncTheme:SyncfusionThemeDictionary>

<syncTheme:SyncfusionThemeDictionary.MergedDictionaries>

<ResourceDictionary>
 
 
<x:String x:Key="SfTextInputLayoutTheme">CustomTheme</x:String>  
<--Below  color will apply while SfTextinputLayout in enabled state-->
<Color x:Key="SyncPrimaryLightColor"> orange </Color>

<Color x:Key="SfTextInputLayoutHintColor">gray</Color>

<Color x:Key="SyncPrimaryColor"> DarkCyan </Color>

<Color x:Key="SfTextInputLayoutLineColor">brown</Color>

<Color x:Key="SfTextInputLayoutHelperTextColor"> BlueViolet</Color>

<Color x:Key="SfTextInputLayoutCounterLabelColor"> DarkGoldenrod</Color>

<Color x:Key="SfTextInputLayoutErrorTextColor">Red</Color> 
 
<-- Below  color will apply while SfTextinputLayout in a disabled state-->
<Color x:Key="SfTextInputLayoutFilledLineDisabledColor">Blue</Color>
  
<Color x:Key="SfTextInputLayoutOutlinedLineDisabledColor">Blue</Color>  
<Color x:Key="SfTextInputLayoutDisabledHintColor">Blue</Color>  
<Color x:Key="SfTextInputLayoutFloatedHintDisabledColor">Blue</Color>  
<Color x:Key="SfTextInputLayoutHelperTextDisabledColor">Blue</Color>
</ResourceDictionary>

</syncTheme:SyncfusionThemeDictionary.MergedDictionaries>

</syncTheme:SyncfusionThemeDictionary>
 
 
</ContentPage.Resources>  
   
<textInputLayout:SfTextInputLayout  
   
Margin="0,50,0,0" IsEnabled="False"  
   
Hint="HintText"  
   
HelperText="HelperText">  
   
<DatePicker TextColor="Red"/>  
   
</textInputLayout:SfTextInputLayout>

</ContentPage>
 
 
 
Control enable state:


Control disable state:
  
  
 


Loader.
Up arrow icon