TexInputLayoutSettings Not Working per Documentation

[Joseph Cigno]

I have this code from FloatingLabel documentation copy pasted in my code.  My hint text is staying purple and not green like the documentation.

 

[Sri Radhesh Nag Subash Sankar]

Hi Joseph,

 

We have reviewed the information you provided and tested the SfDataform control by using the focused stroke in TextInputLayoutSettings.In our testing, the SfDataform appeared correctly with the hint color as given. We have prepared a simple sample based on the code snippets you shared. Please find the sample attached for your reference.

 

Please review this sample and verify whether the issue is reproducible on your end. If not, we kindly request you to either modify our sample to replicate the issue and share the modified sample with us
for further analysis or share your sample where the problem occurs. Additionally, to help us investigate further, could you please share the following details:

- The version of the `Microsoft.Maui.Controls` NuGet package you're using

- The .NET MAUI framework version you are working with (.NET 8 or .NET 9).

- The platform where you're encountering the issue (Android, iOS, Windows, or macOS)?

This will enable us to investigate the issue more effectively and provide a suitable solution.

 

Regards,

Sri Radhesh Nag S

Attachment: MauiApp1_(3)_4d14bba9.zip

[Joseph Cigno]

Thanks for response.  Your sample didn't help my situation.

I changed my code to match yours.  This is the result.   I tried it with and without  the ShowHelperText, same result.  I added the ShowHelperText to your sample and it still worked as expected.    I am using .net8, the DataForm is ver 28.2.12, (all of my SyncFusion nuget packages are that version.)   This is and issue on both iOS and Android.   I found a bit of a work around, but would prefer not to use it if I don't need to.  I use the remarked code, but that changes the text color inside the textbox too.

            <dataform:SfDataForm x:Name="loginForm"

                                 DataObject="{Binding LoginModel}"

                                 VerticalOptions="Start"

                                 LayoutType="TextInputLayout"

                                 ValidationMode="PropertyChanged"

                                 CommitMode="PropertyChanged"

                                 >

                <dataform:SfDataForm.TextInputLayoutSettings>

                    <dataform:TextInputLayoutSettings

                        FocusedStroke="Green"

                        ShowHelperText="True"

                        />

                </dataform:SfDataForm.TextInputLayoutSettings>

                <!--<dataform:SfDataForm.LabelTextStyle>

                    <dataform:DataFormTextStyle

                        TextColor="Green"

                        FontSize="16"

                        />

                </dataform:SfDataForm.LabelTextStyle>-->

            </dataform:SfDataForm>

[Joseph Cigno]

This has not become a more expanded issue.  Code works as expected on Android, emulators and device.   Code doesn't work on iOS simulators or device.

Using this work around below to get the Hint color in text border to match border broke the ability to edit the text boxes once we added a popupPage........     I did try updating to the latest Syncfusion controls, this didn't help.  Removing the work around or the popupPage allowed us to edit fields again, however we have purple back as the hint color in border when work around removed.

I think we need to know why my code is the same as your sample but is not producing the same results.  The purple shows up where ever I use DataForm.    I am going to attach all the files surrounding My LoginPage and the PopupPage.  I hope the code attached will give you a hint on why it doesn't work for me. 

This is the last thing we need to work out for Release Candidate 1 of my App.

                <dataform:SfDataForm.LabelTextStyle>

                    <dataform:DataFormTextStyle

                        TextColor="Green"

                        FontSize="16" />

                </dataform:SfDataForm.LabelTextStyle>

Attachment: LoginFiles_fac45e75.zip

[Joseph Cigno]

This includes the image file for the popup which may save you a headache.

Attachment: LoginFiles_d71b6bcb.zip

[Joseph Cigno]

I was wrong about removing dataform:SfDataForm.LabelTextStyle and the fields editable with the popupPage.    I removed <dataform:SfDataForm.TextInputLayoutSettings as well.  Still can't edit with popupPage 

I couldn't edit any field with just a straight simple DataForm and a PopUpPage

All of this works in Android.   Only and iOS issue.

[Joseph Cigno]

On further investigation, I used the XAML Live Preview

For Android, I couldn't find the popup anywhere.   The popup never showed on the Previewer for any page even though it is on the emulator when I was testing.

On iOS the popup almost takes up the entire screen.  I am assuming it is blocking the DataForm fields from use.

So the popup control is not behaving the same on both devices from what I can tell.  I

The screen shots were created with my mouse in the same spot for both.

Android

iOS

[Joseph Cigno]

We have resolved the issue.  We moved all of the popupPage code above the DataForm.  iOS then worked.

            <popuppage:PopupOKPage x:Name="popup"

                                 IsOpen="{Binding IsOpen}"

                                 >

            </popuppage:PopupOKPage>

<dataform:SfDataForm x:Name="resetPasswordForm"

[Sri Radhesh Nag Subash Sankar]

Hi Joseph,

We are glad that your issue regarding sfpopup has been resolved!.

Also we are currently analyzing the issue regarding the dataform in the source, and we will provide you with further details on or before May 22, 2025. We appreciate your patience until then.

Regards,

Sri Radhesh Nag S

[Sri Radhesh Nag Subash Sankar]

Hi Joseph,

Thank you for contacting us.

Regarding customizing the hint text (floating label) color in the SfDataForm.

You can achieve this customization by setting the resource key SfTextInputLayoutFocusedHintTextColor in your application’s resource dictionary when using themes. This key allows you to define the color of the hint text when the input is focused.

 

<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<syncTheme:SyncfusionThemeResourceDictionary VisualTheme="MaterialLight"/>
<ResourceDictionary>
<x:String x:Key="SfTextInputLayoutTheme">CommonTheme</x:String>
<Color x:Key="SfTextInputLayoutFocusedHintTextColor">Green</Color>
</ResourceDictionary>
<ResourceDictionary Source="Resources/Styles/Colors.xaml" />
<ResourceDictionary Source="Resources/Styles/Styles.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>

 

If you have any further questions, please don’t hesitate to reach out!

Regards,

Sri Radhesh Nag S