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