MAUI中CollectionView绑定LinearGradientBrush背景异常及卡顿求助

问题现象 #

• 选中CollectionView内某一Product项时，其他项的背景色会同步发生变化
• CollectionView操作过程中存在严重卡顿

相关代码 #

CommonObject类 #

public partial class CommonObject:ObservableObject
{
    [ObservableProperty]
    bool showSubmenu = false;
}

Product类 #

public partial class Product :CommonObject
{
    ResourceDictionary rd = App.Current.Resources.MergedDictionaries.First();

    [ObservableProperty]
    string id = "";
    [ObservableProperty]
    string name = "";
    [ObservableProperty]
    string description = "";
    [ObservableProperty]
    string categoryId = "";
    [ObservableProperty]
    string barcode = "";
    [ObservableProperty]
    decimal salePriceExclVat = 0.00m;
    [ObservableProperty] 
    decimal salePrice = 0.00m;
    [ObservableProperty]
    string saleTaxRateId = "";
    [ObservableProperty]
    decimal eatOutPriceExclVat = 0.00m;
    [ObservableProperty]
    decimal eatOutPrice = 0.00m;
    [ObservableProperty]
    string eatOutTaxRateId = "";
    [ObservableProperty]
    decimal costPriceExclVat = 0.00m;
    [ObservableProperty]
    decimal costPrice = 0.00m;
    [ObservableProperty]
    string costTaxRateId = "";
    [ObservableProperty]
    string brandId = "";
    [ObservableProperty]
    string supplierId = "";
    [ObservableProperty]
    string popUpInfoId = "";
    [ObservableProperty]
    string mainUnitOfMeasureId = "";
    [ObservableProperty]
    bool trackStock = false;
    [ObservableProperty]
    int posOrder = 0;
    [ObservableProperty]
    bool isSellOnPos = false;
    [ObservableProperty]
    bool isFavorite = false;
    [ObservableProperty]
    bool isSellOnSelfService = false;
    [ObservableProperty]
    bool isSellOnAllLocations = false;
    [ObservableProperty]
    bool isVariablePrice = false;
    [ObservableProperty]
    bool isSoldByWeight = false;
    [ObservableProperty]
    bool isComposite = false;
    [ObservableProperty]
    [NotifyPropertyChangedFor(nameof(IsNotSelected))]
    bool isSelected = false;
    [ObservableProperty]
    [NotifyPropertyChangedFor(nameof(IsSelected))]
    bool isNotSelected = true;
    [ObservableProperty]
    double opacity = 150;
    [ObservableProperty]
    decimal quantity = 0;
    [ObservableProperty]
    Discount discount = null;
    [ObservableProperty]
    bool hasDiscount = false;
    [ObservableProperty]
    bool val = false;
    [ObservableProperty]
    bool proc = false;
    [ObservableProperty]
    LinearGradientBrush bgColor = new LinearGradientBrush();
    [ObservableProperty]
    Color textColor = Color.FromRgb(0, 0, 0);
    [ObservableProperty]
    Color pTextColor = Color.FromRgb(241, 100, 63);

    partial void OnIsSelectedChanged(bool value)
    {
        try
        {
            IsNotSelected = !value;
            Opacity = value == true ? 0 : 150;
            if (value)
            {
                if (BgColor != (LinearGradientBrush)rd["SelectedItemGradient"])
                    BgColor = rd["SelectedItemGradient"] as LinearGradientBrush;

                if (TextColor != Color.FromRgb(255, 255, 255))
                    TextColor = Color.FromRgb(255, 255, 255);

                if (PTextColor != Color.FromRgb(255, 255, 255))
                    PTextColor = Color.FromRgb(255, 255, 255);
            }
            if (!value)
            {
                if (BgColor != (LinearGradientBrush)rd["NotSelectedItemGradient"])
                    BgColor = rd["NotSelectedItemGradient"] as LinearGradientBrush;

                if (TextColor != Color.FromRgb(0, 0, 0))
                    TextColor = Color.FromRgb(0, 0, 0);

                if (PTextColor != Color.FromRgb(241, 100, 63))
                    PTextColor = Color.FromRgb(241, 100, 63);
            }
        }
        catch (Exception ex)
        {
            ;
        }
    }
}

ProductView自定义视图 #

<?xml version="1.0" encoding="utf-8" ?>
<Grid xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
      xmlns:ObjectModel="clr-namespace:MicroPos.Models.ObjectModels"
      x:DataType="ObjectModel:Product"
      xmlns:ViewModel="clr-namespace:MicroPos.ViewModels"
      xmlns:Converter="clr-namespace:MicroPos.Converters"  
      Margin="0" Padding="0"  BackgroundColor="Transparent"  InputTransparent="False"
      xmlns:xct="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"
      xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
      x:Class="MicroPos.Views.Custom.ProductView">

    <Grid.GestureRecognizers>
        <TapGestureRecognizer Command="{Binding Source={RelativeSource AncestorType={x:Type ViewModel:PosPageViewModel }},Path=AddProductCommand}" CommandParameter="{Binding .}"/>
    </Grid.GestureRecognizers>

    <Grid RowDefinitions="*,30" Margin="0,10,15,0" InputTransparent="True" CascadeInputTransparent="True" IsClippedToBounds="False" HeightRequest="115" WidthRequest="106">
        <Border  Background="{Binding BgColor}" Stroke="Transparent" IsVisible="true" StrokeThickness="0" InputTransparent="True" Grid.Row="0" Grid.RowSpan="2" 
                 Margin="0" Padding="0" HorizontalOptions="Fill" VerticalOptions="Fill">
            <Border.GestureRecognizers>
                <TapGestureRecognizer Command="{Binding Source={RelativeSource AncestorType={x:Type ViewModel:PosPageViewModel }},Path=AddProductCommand}" CommandParameter="{Binding .}"/>
            </Border.GestureRecognizers>
            <Border.StrokeShape>
                <RoundRectangle CornerRadius="8,8,8,8" />
            </Border.StrokeShape>
        </Border>

        <Label Text="{Binding Name}" Margin="2,5,2,0" Grid.Row="0" InputTransparent="True"
               TextColor="{Binding TextColor}"
               FontSize="15" FontFamily="RobotoMedium" HorizontalOptions="Fill" VerticalOptions="Fill" HorizontalTextAlignment="Center"/>
        <Label Grid.Row="1" InputTransparent="True"
               Margin="0,0,0,5" HorizontalTextAlignment="Center"
               FontSize="18" FontFamily="RobotoMedium" HorizontalOptions="Center" VerticalOptions="End">
            <Label.FormattedText>
                <FormattedString>
                    <Span Text="{Binding SalePrice}"   FontSize="15" FontFamily="RobotoMedium" TextColor="{Binding PTextColor}"/>
                    <Span Text=" RON"   FontSize="13" FontFamily="RobotoMedium" TextColor="{Binding PTextColor}"/>
                </FormattedString>
            </Label.FormattedText>
        </Label>
    </Grid>

    <Border BackgroundColor="{StaticResource Main}" InputTransparent="True"
            AbsoluteLayout.LayoutFlags="PositionProportional" AbsoluteLayout.LayoutBounds="1,0" 
            WidthRequest="25" HeightRequest="25" 
            HorizontalOptions="End" Margin="0,0,2,0" Padding="0" IsVisible="{Binding IsSelected}"
            VerticalOptions="Start"   Grid.Row="0">
        <Border.StrokeShape>
            <RoundRectangle CornerRadius="25,25,25,25" />
        </Border.StrokeShape>
        <Label Text="{Binding Quantity}" Margin="0" Grid.Row="0" InputTransparent="True"
               TextColor="White"
               FontSize="12" FontFamily="RobotoRegular" HorizontalOptions="Fill" VerticalOptions="Fill" VerticalTextAlignment="Center" HorizontalTextAlignment="Center"/>
    </Border>
</Grid>

CollectionView代码 #

<CollectionView x:Name="collection" ItemsSource="{Binding Products}" ItemTemplate="{Binding ViewType}" HorizontalScrollBarVisibility="Never" 
                ItemsUpdatingScrollMode="KeepScrollOffset"  Margin="10,0,0,0" ItemSizingStrategy="MeasureFirstItem" 
                Grid.Row="2" ItemsLayout="{Binding Layout}" HorizontalOptions="FillAndExpand" BackgroundColor="Transparent" />

内容的提问来源于stack exchange，提问作者Domokos Levente