在 AvaloniaUI 中，如何显示来自 Web URL 的图像？

如何解决在 AvaloniaUI 中，如何显示来自 Web URL 的图像？

我正在使用 ReactiveUI 和 MVVM 开发 Avalonia 应用程序。 我想显示来自 Web URL 的图像，实现这一目标的最佳行动方案是什么？ 我已经设置了以下绑定：

                this.OneWayBind(
                    viewmodel,vm => vm.UserProfileImageUrl,v => v.ProfileImage.source,ImageConverter
                ).disposeWith(disposables);

和绑定适配器：

        private IImage ImageConverter(string arg)
        {
        
        }

但是我不知道如何实现 Binding 适配器以在不阻塞 UI 的情况下下载图像。 Android 上有类似 Glide 的工具吗？

先谢谢你，

解决方法

您可以异步下载图像并将其存储在您的 ViewModel 中，或者使用下载完成事件，例如：

public class MainWindowViewModel : ViewModelBase
    {
        private string chessboardUrl = "https://upload.wikimedia.org/wikipedia/commons/thumb/d/d5/Chess_Board.svg/2000px-Chess_Board.svg.png";
        public string ChessboardUrl
        {
            get => chessboardUrl;
            set {
                this.RaiseAndSetIfChanged(ref chessboardUrl,value);
                DownloadImage(ChessboardUrl);
                System.Diagnostics.Debug.WriteLine(ChessboardUrl);
            }
        }

        private Avalonia.Media.Imaging.Bitmap chessboard = null;
        public Avalonia.Media.Imaging.Bitmap Chessboard
        {
            get => chessboard;
            set => this.RaiseAndSetIfChanged(ref chessboard,value);
        }

        public MainWindowViewModel()
        {
            DownloadImage(ChessboardUrl);
        }

        public void DownloadImage(string url)
        {
            using (WebClient client = new WebClient())
            {
                client.DownloadDataAsync(new Uri(url));
                client.DownloadDataCompleted += DownloadComplete;
            }
        }

        private void DownloadComplete(object sender,DownloadDataCompletedEventArgs e)
        {
            try
            {
                byte[] bytes = e.Result;

                Stream stream = new MemoryStream(bytes);

                var image = new Avalonia.Media.Imaging.Bitmap(stream);
                Chessboard = image;
            }
            catch (Exception ex)
            {
                System.Diagnostics.Debug.WriteLine(ex);
                Chessboard = null; // Could not download...
            }
            
        }
    }

然后您可以轻松绑定到 Url 和关联的图像。例如像这样来自 XAML（带有适当的 DataContext）：

<StackPanel>
    <Image Source="{Binding Chessboard}"
           Width="200"
           Height="200"
           Name="MyImage"></Image>
    <TextBox Text="{Binding ChessboardUrl}"></TextBox>
    
</StackPanel>