Category / Section
How to apply a style to the listview item in Xamarin.Forms?
2 mins read
Style can be applied to an element loaded in the item template of listview by defining in the resource of content page and applying to the element.
xaml
<ContentPage xmlns:syncfusion="clr-namespace:Syncfusion.ListView.XForms;assembly=Syncfusion.SfListView.XForms" xmlns:dataSource="clr-namespace:Syncfusion.DataSource;assembly=Syncfusion.DataSource.Portable"> <ContentPage.Resources> <ResourceDictionary> <Style x:Key="StackStyle" TargetType="StackLayout"> <Setter Property="BackgroundColor" Value="#4b69a0"/> </Style> <Style x:Key="LabelStyle" TargetType="Label"> <Setter Property="TextColor" Value="YellowGreen"/> <Setter Property="FontAttributes" Value="Italic" /> </Style> </ResourceDictionary> </ContentPage.Resources> <syncfusion:SfListView x:Name="listView" ItemsSource="{Binding ContactsInfo}" ItemSize="70" > <syncfusion:SfListView.DataSource> <dataSource:DataSource> <dataSource:DataSource.GroupDescriptors> <dataSource:GroupDescriptor PropertyName="DisplayString"/> </dataSource:DataSource.GroupDescriptors> </dataSource:DataSource> </syncfusion:SfListView.DataSource> <syncfusion:SfListView.GroupHeaderTemplate> <DataTemplate> <ViewCell> <ViewCell.View> <StackLayout Style="{StaticResource StackStyle}"> <Label Text="{Binding Key}" TextColor="White" /> </StackLayout> </ViewCell.View> </ViewCell> </DataTemplate> </syncfusion:SfListView.GroupHeaderTemplate> <syncfusion:SfListView.ItemTemplate> <DataTemplate> <ViewCell> <ViewCell.View> <Grid> <Label LineBreakMode="NoWrap" Style="{StaticResource LabelStyle}" Text="{Binding ContactName}"/> <Label LineBreakMode="NoWrap" Style="{StaticResource LabelStyle}" Text="{Binding ContactNumber}"/> </Grid> </ViewCell.View> </ViewCell> </DataTemplate> </syncfusion:SfListView.ItemTemplate> </syncfusion:SfListView> </ContentPage>
Output:
Click here to download the sample.