How to achieve rounded corner for items in SfListView?

1 min read

The Xamarin.Forms SfListView allows you to customize the item appearance such as rounded corners by using the Frame layout in the ItemTemplate property.

XAML

Define the CornerRadius for frame for rounded corners and set the HasShadow as False to disable the shadow around the ListViewItem.

<StackLayout Spacing="0" Padding="0,5,0,0" BackgroundColor="LightGray">
    <sync:SfListView x:Name="listView"
                    AutoFitMode="Height"
                    ItemSpacing="5,0,5,10" 
                    IsScrollBarVisible="False"
                    ItemsSource="{Binding BookInfo}">
        <sync:SfListView.ItemTemplate>
            <DataTemplate>
                <Frame Padding="5,5,5,5" CornerRadius="7" HasShadow="False"  BackgroundColor="White">
                    <Grid>
                        ...
                    </Grid>
                </Frame>
            </DataTemplate>
        </sync:SfListView.ItemTemplate>
    </sync:SfListView>
</StackLayout>

View sample in GitHub

Round corner Xamarin.Forms SfListView

Did you find this information helpful?

Yes

Comments (0)

How to achieve rounded corner for items in SfListView?

Access denied