Xamarin.Forms CollectionView选定的项目是否具有怪异的灰色边框?

问题描述

我正在使用运行iOS 13.6的iPhone 8模拟器在Visual Studio Mac中进行编码。

这是我的收藏夹视图代码

       <CollectionView
            Margin="0"
            VerticalScrollBarVisibility="Never"
            BackgroundColor="Transparent"
            x:Name="selectableItemsList"
            SelectionMode="Multiple"
            HorizontalOptions="Center"
            VerticalOptions="Center"
            SelectionChanged="selectableItemsList_SelectionChanged"
            ItemsSource="{Binding Services}">
            <CollectionView.ItemTemplate>
                <DataTemplate>
                    <Image
                        Source="{Binding Image}"
                        BackgroundColor="Transparent"
                        HeightRequest="100"
                        WidthRequest="100"
                        Aspect="AspectFit"
                        HorizontalOptions="Center"
                        VerticalOptions="Start">
                        <visualstatemanager.VisualStateGroups>
                            <VisualStateGroup
                                Name="CommonStates">
                                <VisualState
                                    Name="normal" />
                                <VisualState
                                    Name="Focused" />
                                <VisualState
                                    Name="Selected">
                                    <VisualState.Setters>
                                        <Setter
                                            Property="BackgroundColor"
                                            Value="Yellow" />
                                    </VisualState.Setters>
                                </VisualState>
                            </VisualStateGroup>
                        </visualstatemanager.VisualStateGroups>
                    </Image> 
                </DataTemplate>
            </CollectionView.ItemTemplate>
        </CollectionView>

以下是未选中时的外观:

enter image description here

这是被选中时的样子:

enter image description here

看到每个图标顶部和左侧的灰线了吗?我该怎么摆脱呢?

是否有一种解决方法,可以在选择该项时使用数据触发器更改图像的背景色?

请注意:

visualstatemanager.VisualStateGroups部分移至ResourceDictionary中的样式并不能解决问题。

解决方法

尝试将图像放入网格中

<CollectionView.ItemTemplate>
    <DataTemplate>

        <Grid Padding="10">
            <Grid.RowDefinitions>
                <RowDefinition Height="100" />
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="100" />
            </Grid.ColumnDefinitions>

            <Image 
                Source="{Binding .}"
                BackgroundColor="Transparent"
                HeightRequest="100"
                WidthRequest="100"
                HorizontalOptions="Center"
                VerticalOptions="Start">
               
            </Image>

            <VisualStateManager.VisualStateGroups>
                <VisualStateGroup
                        Name="CommonStates">
                    <VisualState
                            Name="Normal" />
                    <VisualState
                            Name="Focused" />
                    <VisualState
                            Name="Selected">
                        <VisualState.Setters>
                            <Setter
                                    Property="BackgroundColor"
                                    Value="Yellow" />
                        </VisualState.Setters>
                    </VisualState>
                </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>

        </Grid>
    </DataTemplate>
</CollectionView.ItemTemplate>