1

我正在尝试自定义 CollectionView 中单元格的选择颜色，但无论我如何尝试，它总是丑陋的灰色。

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

丑陋的灰色角落

这是我当前的 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 的一个错误？

4

2 回答 2

1

我找到了一个笨拙的解决方案，如果没有一个正确的方法，它就必须这样做。

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

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

于 2021-05-07T16:20:21.777 回答
0

我再次开始尝试使其工作，现在我在 StackLayout 中有一个框架。而不是相反。但是看不到运气，现在所选项目周围没有角落。对不起，我无法让它工作。

于 2021-04-30T21:15:14.520 回答