在 .NET Maui 中为 svg 图像着色

Question

当我从 Xamarin.Forms 转换时，我正在尝试对 .NET Maui 中的 svg 图像进行动态着色。我设置了以下代码以使用字符串格式的颜色绑定，但抛出以下错误。关于如何在 .NET Maui 中实现这一目标有什么想法吗？

错误 XLS0503 类型“IconTintColorBehavior”的值无法添加到类型“IList`1”的集合或字典中

XAML代码

<Grid>
    <Image
    x:Name="NeedleSVG"
    WidthRequest="200"
    HeightRequest="200"
    Source="resource://XamarinAttributeProgrammer.Resources.Images.Needle.svg">
        <Image.Effects>
            <mct:IconTintColorBehavior TintColor="{Binding NeedleColorInHex}" />
        </Image.Effects>
    </Image>

    <Image
    WidthRequest="200"
    HeightRequest="200"
    Source="resource://XamarinAttributeProgrammer.Resources.Images.Backlight.svg">
        <Image.Effects>
            <mct:IconTintColorBehavior TintColor="{Binding BackColorInHex}" />
        </Image.Effects>
    </Image>

    <Image
    WidthRequest="200"
    HeightRequest="200"
    Source="resource://XamarinAttributeProgrammer.Resources.Images.Housing.svg">
        <Image.Effects>
            <mct:IconTintColorBehavior TintColor="{Binding BackColorInHex}" />
        </Image.Effects>
    </Image>
    <Button ClassId="BackLight" 
            BackgroundColor="Transparent" 
            WidthRequest="250" 
            HorizontalOptions="Center" 
            Clicked="OnPreviewTapped"/>
    <Button ClassId="Needle" 
            BackgroundColor="Transparent" 
            HeightRequest="80" 
            WidthRequest="80" 
            VerticalOptions="Center" 
            HorizontalOptions="Center" 
            Margin="0,20,0,0" 
            Clicked="OnPreviewTapped"/>
</Grid>

查看模型

public string SelectedColorInHex
{
    get
    {
        NotifyGaugeOfChangeAsync();
        Task.Delay(50).Wait(); // wait 50ms so that we dont flood the gauge
        if (FocusColorOn == BACKLIGHT)
            return BackColorInHex;
        else
            return NeedleColorInHex;
    }
    set
    {
        if (FocusColorOn == BACKLIGHT)
            _colorBack.Hex = value;
        else
            _colorNeedle.Hex = value;
    }
}

Answer 1

您正在尝试将行为添加到效果集合中

<Image.Effects>
    <mct:IconTintColorBehavior TintColor="{Binding NeedleColorInHex}" />
</Image.Effects>

应该

<Image.Behaviors>
    <mct:IconTintColorBehavior TintColor="{Binding NeedleColorInHex}" />
</Image.Behaviors>