如何在MAUI Toolkit弹窗中显示字节数组格式的产品图片？

方案1：将转换器定义在应用全局资源中 #

把ByteArrayToImageSourceConverter放到App.xaml的全局资源里，让所有页面（包括弹窗）都能直接访问：

<!-- App.xaml -->
<Application.Resources>
    <ResourceDictionary>
        <toolkit:ByteArrayToImageSourceConverter x:Key="ByteArrayToImageSourceConverter" />
    </ResourceDictionary>
</Application.Resources>

之后弹窗的XAML就可以和产品页面一样使用绑定：

<Image Aspect="Center" 
       WidthRequest="240" 
       HeightRequest="250"
       Source="{Binding Image, Converter={StaticResource ByteArrayToImageSourceConverter}}" />

方案2：在弹窗XAML中直接实例化转换器 #

不需要全局资源，直接在Image的绑定表达式里创建转换器实例：

<Image Aspect="Center" 
       WidthRequest="240" 
       HeightRequest="250"
       Source="{Binding Image, Converter={toolkit:ByteArrayToImageSourceConverter}}" />

或者通过后台代码手动绑定：
在QuantityPopupPage的构造函数中，实例化转换器并设置绑定关系：

public QuantityPopupPage(Products prod)
{
    InitializeComponent();
    BindingContext = prod;
    
    // 假设弹窗内Image控件的x:Name为productImage
    var converter = new ByteArrayToImageSourceConverter();
    productImage.SetBinding(Image.SourceProperty, 
        new Binding(nameof(Products.Image), Converter = converter));
}

方案3：在数据模型中直接转换为ImageSource #

修改Products类，新增一个返回ImageSource的属性，提前完成字节数组到图片源的转换，弹窗XAML无需再使用转换器：

public class Products : INotifyPropertyChanged
{
    private byte[] _image;
    public byte[] Image
    {
        get => _image;
        set
        {
            _image = value;
            OnPropertyChanged(nameof(Image));
            OnPropertyChanged(nameof(ProductImageSource));
        }
    }

    public ImageSource ProductImageSource
    {
        get
        {
            if (Image == null || Image.Length == 0)
                return null;
            return ImageSource.FromStream(() => new MemoryStream(Image));
        }
    }

    // 实现INotifyPropertyChanged接口的代码
    public event PropertyChangedEventHandler PropertyChanged;
    protected void OnPropertyChanged(string propertyName)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}

之后弹窗的XAML直接绑定新属性：

<Image Aspect="Center" 
       WidthRequest="240" 
       HeightRequest="250"
       Source="{Binding ProductImageSource}" />

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