CollectionView VisualStateManager 无法更改选择颜色

Question

我正在尝试自定义 CollectionView 中单元格的 selection 颜色，但无论我如何尝试，它始终是难看的灰色。

我希望我的项目模板有圆角，但是当我 select 一个项目时，我看到它后面有丑陋的方形灰色角，如下图所示：

这是我当前的XAML：

<?xml version="1.0" encoding="UTF-8"?>
<ContentView
xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="Tests.CollectionViewTest">
<ContentView.Content>
    <CollectionView
        x:Name="collectionView"
        Margin="15,0"
        ItemSizingStrategy="MeasureFirstItem"
        Grid.Row="1"
        Grid.RowSpan="2"
        VerticalScrollBarVisibility="Never"
        BackgroundColor="Transparent"
        SelectionMode="Multiple"
        HorizontalOptions="Center"
        VerticalOptions="Center"
        >

        <CollectionView.ItemsLayout>
            <GridItemsLayout
                Orientation="Vertical"
                HorizontalItemSpacing="1"
                VerticalItemSpacing="1"
                Span="3" />
        </CollectionView.ItemsLayout>
        <CollectionView.ItemTemplate>
            <DataTemplate>
                <Frame
                    x:Name="selectionFrame"
                    CornerRadius="18"
                    BackgroundColor="Transparent"
                    Padding="0"
                    HasShadow="False"
                    IsClippedToBounds="True"
                    BorderColor="Transparent">
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup
                            Name="CommonStates">
                            <VisualState
                                Name="Normal" />
                            <VisualState
                                Name="Focused">
                                <VisualState.Setters>
                                    <Setter
                                        Property="BackgroundColor"
                                        Value="Transparent" />
                                </VisualState.Setters>
                            </VisualState>
                            <VisualState
                                Name="Selected">
                                <VisualState.Setters>
                                    <Setter
                                        Property="BackgroundColor"
                                        Value="#e25fc4" />
                                </VisualState.Setters>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <StackLayout
                        BackgroundColor="#f7f0f6"
                        HorizontalOptions="FillAndExpand"
                        VerticalOptions="FillAndExpand"
                        Orientation="Vertical"
                        Padding="8,0,8,10"
                        Margin="10"
                        Spacing="0"
                        HeightRequest="100">
                        <Label
                            Padding="10"
                            x:Name="ServiceName"
                            BackgroundColor="Transparent"
                            Text="Some Text"
                            HorizontalTextAlignment="Center"
                            TextColor="HotPink"
                            FontSize="Micro"
                            FontAttributes="Bold"
                            HorizontalOptions="Center"
                            VerticalOptions="End" />
                        <Label
                            BackgroundColor="Transparent"
                            Text="Some More Text"
                            HorizontalTextAlignment="Center"
                            TextColor="HotPink"
                            FontSize="Micro"
                            HorizontalOptions="Center"
                            VerticalOptions="Start" />
                    </StackLayout>
                </Frame>
            </DataTemplate>
        </CollectionView.ItemTemplate>
    </CollectionView>
</ContentView.Content>
</ContentView>

我的代码隐藏：

using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using Xamarin.Forms;

namespace Tests
{
    public partial class CollectionViewTest : ContentView
    {
        public CollectionViewTest()
        {
            InitializeComponent();
            collectionView.ItemsSource = new ObservableCollection<string>()
            {
                "", "", "", "", "", "", "", "", "", "", "", "", "", ""
            };
        }
    }
}

我也尝试过其他方法，但没有任何效果。

有没有办法做到这一点，或者这只是 CollectionView 的一个错误？

Answer 1

我重新开始尝试让它工作，现在我在 StackLayout 中有一个框架。而不是相反。但是没有看到运气，现在所选的周围没有角落 item.Sorry 但我无法让它工作。

Answer 2

我找到了一个笨拙的解决方案，如果没有一个以正确的方式工作，那将是必须的。

将 CollectionView 中的 selection 行为设置为 none。
将 tapGestureRecognizer 放入 itemTemplate
要模拟 selection 状态，在 tapGestureRecognizer 的事件处理程序中，将 sender 转换为 Frame（或您将手势识别器附加到的任何元素）并转动打开或关闭框架边框（或为您自己的自定义 selected-state 外观做任何您需要的事情）。
手动处理通常由 CollectionView 响应 selections 触发的任何内容。换句话说，如果您可以 select 多个项目，您可能会在单独的列表中跟踪 selected 项目，现在您必须从 tapGestureRecognizer 内部执行此操作。

这是错误的，但它有效，有时这就是你必须做的。

CollectionView VisualStateManager 无法更改选择颜色

CollectionView VisualStateManager can't change selection color

datatemplate

visualstatemanager

xamarin.forms

xamarin.forms.collectionview