Articles in this section
Category / Section

How to adjust the SfListView when display the Keyboard in Xamarin Forms iOS?

1 min read

In iOS platform, while focusing the Entry element loaded in the footer of SfListView, the keyboard overlaps and hides the entry element. So you can overcome this behavior by loading the SfListView inside a ScrollView as like below.

XAML

<ContentPage.Content> 
        <ScrollView VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand" > 
            <Grid> 
                <sync:SfListView x:Name="ListView"  
            ItemTemplate="{StaticResource MessageTemplateSelector}"  
            ItemsSource="{Binding Messages}" AutoFitMode="Height" IsStickyFooter="True"> 
                    <sync:SfListView.FooterTemplate> 
                        <DataTemplate> 
                            <Grid 
                  BackgroundColor="#EFEFF4" 
                  VerticalOptions="FillAndExpand" 
                  HorizontalOptions="FillAndExpand"> 
                                <Grid.RowDefinitions> 
                                    <RowDefinition Height="Auto"></RowDefinition> 
                                </Grid.RowDefinitions> 
                                <Grid.ColumnDefinitions> 
                                    <ColumnDefinition Width="*"></ColumnDefinition> 
                                    <ColumnDefinition Width="Auto"></ColumnDefinition> 
                                </Grid.ColumnDefinitions> 
                                <Entry Grid.Column="0" Placeholder="Type Your Message" 
                     FontSize="14" Text="{Binding NewText}"></Entry> 
                                <Grid Grid.Column="1"> 
                                    <Label Text="Send" VerticalTextAlignment="Center"HorizontalTextAlignment="Center" BackgroundColor="Black" TextColor="White"> 
                                        <Label.GestureRecognizers> 
                                            <TapGestureRecognizer Command="{Binding SendCommand}"/> 
                                        </Label.GestureRecognizers> 
                                    </Label> 
                                </Grid> 
                            </Grid> 
                        </DataTemplate> 
                    </sync:SfListView.FooterTemplate> 
                </sync:SfListView> 
            </Grid> 
        </ScrollView> 
    </ContentPage.Content> 

 

Click here to download the sample.

Did you find this information helpful?
Yes
No
Help us improve this page
Please provide feedback or comments
Comments
Please sign in to leave a comment
Access denied
Access denied