Category / Section
How to change the height of Xamarin.Forms listview based on size of an items?
1 min read
ListView allows you to change its height based on the size of an item added at runtime by setting the AutoFitMode property to DynamicHeight.
Xaml
<ContentPage xmlns:syncfusion="clr-namespace:Syncfusion.ListView.XForms;assembly=Syncfusion.SfListView.XForms" > <ContentPage.Content> <Grid> <Grid.RowDefinitions> <RowDefinition Height="50"/> <RowDefinition Height="*"/> </Grid.RowDefinitions> <Button Text="Add item" Clicked="Button_Clicked"/> <syncfusion:SfListView x:Name="listView" BackgroundColor="Azure" AutoFitMode="DynamicHeight" ItemSpacing="3" ItemSize="70" ItemsSource="{Binding contactsinfo}" Grid.Row="1"> <syncfusion:SfListView.ItemTemplate> <DataTemplate> <ViewCell> <ViewCell.View> <Grid> <Image Source="{Binding ContactImage}"/> <Label Text="{Binding ContactName}"/> <Label Text="{Binding ContactNumber}" /> </Grid> </ViewCell.View> </ViewCell> </DataTemplate> </syncfusion:SfListView.ItemTemplate> </syncfusion:SfListView> </Grid> </ContentPage.Content> </ContentPage>
C#
using Syncfusion.ListView.XForms.Control.Helpers; private void Button_Clicked(object sender, EventArgs e) { Random r=new Random(); var contact = new Contacts(); contact.ContactName = "Irene"; contact.ContactNumber = "123-456"; contact.ContactImage = ImageSource.FromResource("SfListViewSample.Images.Image" + r.Next(0, 28) + ".png"); viewModel.contactsinfo.Add(contact); }
Sample Link : ListviewSample