Setup Help text color

[Alexis]

Hi,

I try to setup the color of the helper text color.

I followed this link. https://www.syncfusion.com/kb/10466/how-to-customize-the-color-of-border-and-labels-in-sftextinputlayout

But visual studio show me an error:

Resources in ResourceDictionary require a x:Key attribute

If I had a x:key the style is not applied anymore.

How can I fix this?

[Sridevi Sivakumar]

Hi Alexis,

Greetings from Syncfusion. This is a general update to let you know that our support team has taken out your query and they are starting to work on it. We will share the possible solution with validated details on today EOD.

Regards,
Sridevi S.  

[Sridevi Sivakumar]

Hi Alexis,

As we stated in that KB document, you can customize the color of SfTextInputLayout through the Syncfusion custom theme. We have maintained the key values to customize the provided color with our control’s element.

We have prepared the sample with the same code which is worked fine at our end.

Sample Link for your reference:

https://www.syncfusion.com/downloads/support/forum/158002/ze/Textinput_Sample558064313

For more reference

https://help.syncfusion.com/xamarin/themes/keys#sftextinputlayout

https://help.syncfusion.com/xamarin/themes/themes#creating-your-own-theme

If your requirement is to apply that custom theme only to the specific SfTextInputLayout then, please use as per in below
  

<inputLayout:SfTextInputLayout.Resources>               

                  <syncTheme:SyncfusionThemeDictionary>                   

                                <syncTheme:SyncfusionThemeDictionary.MergedDictionaries>                       

                                                <ResourceDictionary>                           

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

                                                                <!--Hint Color for focused state-->                           

                                                                <Color x:Key="SyncPrimaryLightColor">Black</Color>                           

                                                                <!--Hint Color for default state-->                           

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

                                                                <!--Border Color for focused state-->                           

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

                                                                <!--Border Color for default state-->                           

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

                                                                <!--Helper text Color for default state-->                           

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

                                                                <!--Character count text Color for default state-->                           

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

                                                                <!--Error text Color for default state-->                           

                                                                <Color x:Key="SfTextInputLayoutErrorTextColor">Red</Color>                       

                                                </ResourceDictionary>                   

                                </syncTheme:SyncfusionThemeDictionary.MergedDictionaries>               

                  </syncTheme:SyncfusionThemeDictionary>           

                </inputLayout:SfTextInputLayout.Resources>  

  

If your problem still persists then, please share with code snippet where you have faced the problem. That will more helpful to analysis further and provide a possible solution earlier.

Regards,
Sridevi S.  

[Alexis]

Hi,

Thanks for your response.

I would like to use it in the global theme of my app.

But it's not working beacause it requires a key.

Thanks,

[Sridevi Sivakumar]

Hi Alexis

We have checked the reported query, set the theme globally., and it is working fine at our end. Please have a sample from the below link. 

Link: https://www.syncfusion.com/downloads/support/forum/158002/ze/Textinput_Sample-35039109

Code snippet:  

 <Application.Resources> 

        <syncTheme:SyncfusionThemeDictionary> 

            <syncTheme:SyncfusionThemeDictionary.MergedDictionaries> 

                <ResourceDictionary> 

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

                    <!--Hint Color for focused state--> 

                    <Color x:Key="SyncPrimaryLightColor">Black</Color> 

                    <!--Hint Color for default state--> 

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

                    <!--Border Color for focused state--> 

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

                    <!--Border Color for default state--> 

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

                    <!--Helper text Color for default state--> 

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

                    <!--Character count text Color for default state--> 

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

                    <!--Error text Color for default state--> 

                    <Color x:Key="SfTextInputLayoutErrorTextColor">Red</Color> 

                </ResourceDictionary> 

            </syncTheme:SyncfusionThemeDictionary.MergedDictionaries> 

        </syncTheme:SyncfusionThemeDictionary> 

    </Application.Resources> 

 

Screenshot: 

 

Please check with the sample and if the issue still persists please modify the same with the issue reproducing steps and also mention in which scenario you could reproduce the issue which will be helpful for us to analyse further and provide an appropriate solution.

Regards,
Sridevi S. 

 

[Javier Lopez Casanello]

Hi, I was able to customize the text input layout and remove the border, change the hint font style and colors.

This worked fine when using a Xamarin Forms "Entry" control inside the TextInputLayout like in the provided example.

However, if I use a SfComboBox control instead, these style customization seems to be ignored. The border is always displayed.

Could you provide another example of this, but using a SfComboBox instead?

 

[Ragul Subramani]

 Currently, our development team is validating the reported problem and will update you with further details on or before November 22, 2022.

[Ragul Subramani]

We have prepared the sample based on the provided details with the SfComboBox as input view of SfTextInputLayout by customizing styles. Please find the modified sample from the attachment. If your requirement is different from this, please revert with more details about your requirement. It will help us provide an appropriate solution at the earliest.

Attachment: TIl_Issue_1d5d5a9f.zip