SfTextInputLayout alway has some space for hint text

[Thanh Hai Dang]

Hi,

I have a Grid with a Label, SfTextInputLayout and SfButton inside. I want to set the SfTextInputLayout height equal to button. I tried to set the padding to zero and negative, but it did not work. 

I presume this is space reserved for the input layout Hint (the space I marked by rex box in the screenshot).

That is my code:

                    <Grid ColumnSpacing="10" ColumnDefinitions="Auto,*,Auto">
                        <Label Grid.Column="0" Text="URL: "
                               VerticalOptions="Center"
                               VerticalTextAlignment="Center"
                               TextColor="{StaticResource Gray300}"/>


                        <syncfusion:SfTextInputLayout Grid.Column="1"
                                ContainerType="Outlined"
                                ReserveSpaceForAssistiveLabels="False"
                                ShowHint="False"
                                ShowHelperText="False"
                                Padding="11,0,11,0"
                                OutlineCornerRadius="5"
                               ContainerBackground="{StaticResource BackgroundWrite}"
                                >
                            <Entry Text="{Binding Url}"  />
                        </syncfusion:SfTextInputLayout>




                        <buttons:SfButton Grid.Column="2"
                                          VerticalOptions="Center"
                                          HorizontalOptions="Fill"
                                          HorizontalTextAlignment="Center"
                                          CornerRadius="8"
                            Text="Select Index File"
                                          TextColor="Black"
                                          Background="White"
                                          >


                        </buttons:SfButton>
                    </Grid>

[Brundha Velusamy]

Hi Thanh Hai Dang,

To utilize the .NET MAUI TextInputLayout control with a specific height lower than the default value, comment out the setter property of the MinimumHeightRequest for the Entry control located in the Styles.xaml file within the Styles folder in the Resources folder. And we recommend utilize the InputViewPadding property instead of setting a Padding property, to override the default padding value of the TextInputLayout. This approach allows for rendering the TextInputLayout control with a reduced height. We have also created a sample based on this and attached it for your reference. Please review the attached sample, and feel free to reach out if you have any further questions.

Additionally, for more detailed information, please refer to the following KB: 

KB Link : https://support.syncfusion.com/kb/article/13662/how-to-resolve-rendering-issues-when-specifying-a-smaller-heightrequest-in-net-maui-textinputlayout

Please refer the below code snippet for this,

//In MainPage.xaml

 

<Grid ColumnSpacing="10" RowDefinitions="Auto" ColumnDefinitions="Auto,*,Auto">

   …

    <syncfusion:SfTextInputLayout Grid.Column="1"

                            ContainerType="Outlined"

                            ReserveSpaceForAssistiveLabels="False"

                            ShowHint="False"

                            ShowHelperText="False"

                            InputViewPadding="11,0,11,0"

                            OutlineCornerRadius="5"

                           ContainerBackground="{StaticResource BackgroundWrite}"

                            >

        <Entry Text="{Binding Url}"  />

    </syncfusion:SfTextInputLayout>

…

</Grid>

 

//In Style.xaml

<Style TargetType="Entry">

    …

    <!--<Setter Property="MinimumHeightRequest" Value="44"/>-->

    …

</Style>

Regards,

Brundha V

Attachment: InputLayoutSample_fb6cbe14.zip

[Thanh Hai Dang]

Hi Brundha Velusamy,

Thanks for your support.

According to your suggestion, my code works properly. 

Regards,

TH

[Preethi Rajakandham]

Hi Thanh Hai Dang,

You're welcome. We are glad to know that the reported problem has been resolved. Please let us know if you require any further assistance on this, we will be happy to assist you. 

Regards,

Preethi R