Xamarin Forms Listview Rounded Corner Cell highlight grayout

Question

I'm finding a solution to customize on-tap listview cell grayout with rounded corners

This is what I'm having now But I need to make the greyout as the next image

**This is what I'm expecting!!!

<ListView ItemSelected="ItemSelected" ItemsSource="{Binding Patients}" SeparatorVisibility="None">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <ViewCell>
                        <custom:RoundedCornerView RoundedCornerRadius="12" Margin="11,5.5,11,5.5" VerticalOptions="FillAndExpand" >
                            <StackLayout Orientation="Vertical" BackgroundColor="White" Padding="11" >
                                <Label Text="{Binding WardName}".../>
                            </StackLayout>
                        </custom:RoundedCornerView>
                    </ViewCell>
                </DataTemplate>
            </ListView.ItemTemplate>

Answer 1

I believe you have a BackgroundColor property for the custom:RoundedCornerView. You can have a binding property assigned to the BackgroundColor.

eg: <custom:RoundedCornerView RoundedCornerRadius="12" BackgroundColor= {Binding CellColor} Margin="11,5.5,11,5.5" VerticalOptions="FillAndExpand" >

In your model class which is binded for this ListView, you can have this property (assume that you used INotifyPropertyChanged in the model class.

    private string cellColor = "#ffffff";
public string CellColor
{
get { return cellColor;}
set { cellColor = value; OnPropertyChanged("CellColor");}
}

In the ViewModel, you can have an ICommand for triggering the tap of the list item click. In the method associated with the ICommand, you have code to change the color of the CellColor property of that particular list item to grey color.