如何在没有自定义渲染器的情况下更改 Xamarin Forms Cross Platform 中列表视图所选项目的背景颜色

Question

如何在 Xamarin Forms Cross Platform 中更改列表视图选定项目的选定颜色？

我能够使用这个问题中的答案更改它如何更改 Xaml 中 ListView 的背景颜色？

但第一次出现时，所选项目使用默认背景颜色（橙色）。

有什么建议？

我想知道为什么在 2019 年（接近 2020 年）没有一种开箱即用的方法来轻松更改此基本和通用属性。

谢谢。

Answer 1

下面的代码非常适合我。 但是，它会迭代整个 ItemsSource 以重置先前选定项目的背景。 如果您想优化它，您可以存储它并重置它。 希望这可以帮助。

<ListView x:Name="contactList" ItemsSource="{Binding PlatformsList}" ItemTapped="contactList_ItemTapped"
             VerticalOptions="CenterAndExpand" HorizontalOptions="FillAndExpand">
    <ListView.ItemTemplate>
        <DataTemplate>
            <ViewCell>
                <Label TextColor="Black" Margin="10,0" Text="{Binding PlatformName}" BackgroundColor="{Binding Background}" VerticalOptions="Center" />
            </ViewCell>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

private void contactList_ItemTapped(object sender, ItemTappedEventArgs e)
{
    var selectedItem = e.Item as PlatformInfo;
    selectedItem.ItemBackground = Color.Aqua;

    foreach(var item in this.contactList.ItemsSource)
    {
        if (item != selectedItem)
            (item as PlatformInfo).ItemBackground = Color.Transparent;
    }
}

Answer 2

我选择避免使用 ListViews 的 ItemSelected 事件或自定义渲染器方法，并在代码隐藏文件中应用样式更改。 Tapped 手势事件和用于跟踪活动列表项中包含的视图的列表 (SelectedItems) 提供了简单的颜色样式更改。

.xaml 文件

<ListView ItemsSource="{Binding ViewModelList}" SelectionMode="None">
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <ViewCell>
                            <Grid Padding="10">
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="*" />
                                </Grid.RowDefinitions> 
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="Auto" />
                                    <ColumnDefinition Width="*" />
                                </Grid.ColumnDefinitions>                                   
                                <Label Grid.Row="0" Grid.Column="0" Text="{Binding CNumber'}">
                                    <Label.GestureRecognizers>
                                        <TapGestureRecognizer Tapped="Tapped_Command" CommandParameter="{Binding CNumber}" />
                                    </Label.GestureRecognizers>
                                </Label>
                                <Label Grid.Row="0" Grid.Column="1" Text="{Binding Brand}" TextColor="{StaticResource Blue}">
                                    <Label.GestureRecognizers>
                                        <TapGestureRecognizer Tapped="Tapped_Command" CommandParameter="{Binding CNumber}" />
                                    </Label.GestureRecognizers>
                                </Label>
                            </Grid>
                        </ViewCell>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>

.xaml.cs 文件背后的代码

 private List<View> SelectedItems { get; set; }

    public MYListPage()
    {
        InitializeComponent();           
        BindingContext = new MyViewModel();
        SelectedItems = new List<View>();
    }


       private async void Tapped_Command(object sender, EventArgs e)
    {
        var l = (Label)sender;
        var cNumber= (((TappedEventArgs)e).Parameter) as string;
        if (string.IsNullOrEmpty(contract))
            await DisplayAlert("Error", "Could not load the information", "close");
        else
        {
            if (SelectedItems.Count > 0)
            {
                foreach (var v in SelectedItems)  //reset the styling to the original 'unselected' colors
                {
                    if (v.GetType() == typeof(Grid))
                        ((Grid) v).BackgroundColor = Color.Transparent;
                    else if(v.GetType() == typeof(Label))
                        ((Label)v).TextColor = Color.Black;
                }
                SelectedItems.Clear();
            }
            var parent = (Grid)l.Parent;
            parent.BackgroundColor = Color.FromHex("#E0E0E0");   //set the background color
            SelectedItems.Add(parent);
            foreach (var c in parent.Children)   //option to set additional styling to the child elements
            {
                var child = (Label)c;
                child.TextColor = Color.FromRgb(0, 123, 255);
                SelectedItems.Add(child);
            }
            await Navigation.PushAsync(new MyDetailsPage(viewModel, cNumber));
        }
    }