Fixed Hint Position in .NET MAUI Text Input Layout (SfTextInputLayout)

28 Jul 20263 minutes to read

By default, the hint label in Text Input Layout floats to the top of the input line only when the input view is focused or contains a value. When the input is empty and unfocused, the hint sits in the input line as a placeholder. Set the IsHintAlwaysFloated property to true to keep the hint label permanently at the top, regardless of focus or value state.

NOTE

The default value of IsHintAlwaysFloated is false.

Prerequisites

Before using the SfTextInputLayout, ensure the following NuGet package is installed in your .NET MAUI project:

  • Syncfusion.Maui.Core

For a step-by-step setup, refer to the Getting Started documentation.

Always-floated hint with Filled container

The hint label position of the input view will be set always at the top for the Filled container type.

<inputLayout:SfTextInputLayout Hint="Name"
                               IsHintAlwaysFloated="True"
                               ContainerType="Filled">
    <Entry />
</inputLayout:SfTextInputLayout>
SfTextInputLayout inputLayout = new SfTextInputLayout
{
    Hint = "Name",
    IsHintAlwaysFloated = true,
    ContainerType = ContainerType.Filled,
    Content = new Entry()
};
Content = inputLayout;

Filled SfTextInputLayout with the hint label always floated at the top

Always-floated hint with Outlined container

The hint label position of the input view will be set always at the top for the Outlined container type.

<inputLayout:SfTextInputLayout Hint="Name"
                               IsHintAlwaysFloated="True"
                               ContainerType="Outlined">
    <Entry />
</inputLayout:SfTextInputLayout>
SfTextInputLayout inputLayout = new SfTextInputLayout
{
    Hint = "Name",
    IsHintAlwaysFloated = true,
    ContainerType = ContainerType.Outlined,
    Content = new Entry()
};
Content = inputLayout;

Outlined SfTextInputLayout with the hint label always floated at the top

Always-floated hint with None container

<inputLayout:SfTextInputLayout Hint="Name"
                               IsHintAlwaysFloated="True"
                               ContainerType="None">
    <Entry />
</inputLayout:SfTextInputLayout>
SfTextInputLayout inputLayout = new SfTextInputLayout
{
    Hint = "Name",
    IsHintAlwaysFloated = true,
    ContainerType = ContainerType.None,
    Content = new Entry()
};
Content = inputLayout;

None-container SfTextInputLayout with the hint label always floated at the top

See Also