如何将字节数组从 web API 转换为图像？

Question

我的 API 将许多图像转换为字节数组并返回字节，但我无法再次转换为图像。 我打算在一些列表视图中显示来自我的 API 的所有图像。

我试过这个，但我无法获得任何图像，我试图至少获得一个。

        var url = "https://appmaragogi.com.br/api/Files/Upload?Id=ChurrascariaEstreladoMar";

        Byte[] imageAsBytes = client.GetByteArrayAsync(url).Result;

        MemoryStream stream1 = new MemoryStream(imageAsBytes);
        teste.Source = ImageSource.FromStream(() => { return stream1; });

我想在列表视图中显示所有图像，或者一种获取所有图像的方法

我在 Xaml 中使用图像来显示图像

Answer 1

我认为您只需要将其保存在本地文件中，您唯一需要检查的是字节数组中图像的格式是否正确

File.WriteAllBytes(nameLocalFile, imageAsBytes);

Answer 2

您可以尝试使用从IValueConverter派生的转换器，它可以根据字节数组创建图像。

你可以参考我的这个帖子：

主要代码如下：

ByteArrayToImageSourceConverter.cs

 public class ByteArrayToImageSourceConverter : IValueConverter
 {
public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
    ImageSource retSource = null;
    if (value != null)
    {
        byte[] imageAsBytes = (byte[])value;
        var stream = new MemoryStream(imageAsBytes);
        retSource = ImageSource.FromStream(() => stream);
    }
    return retSource;
}
public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
    throw new NotImplementedException();
  }
}

图像模型.cs

public class ImagesModel
{
   // other fields

   public byte[] PlayerImage { get; set; }
 }

xaml（使用示例）：

<ContentPage.Resources>
<ResourceDictionary>
    <myformapp1:ByteArrayToImageSourceConverter x:Key="ByteArrayToImage" />
</ResourceDictionary>
</ContentPage.Resources>
<StackLayout Margin="5">
<CollectionView x:Name="collectionView"
                ItemsSource="{Binding YoudataList}"> <!--changd to your dataList-->
    <CollectionView.ItemTemplate>
        <DataTemplate>
            <Grid Padding="10">
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto" />
                    <RowDefinition Height="Auto" />
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                </Grid.ColumnDefinitions>
                <Image Grid.RowSpan="2"  
                       x:Name="PlayerPic"
                       Source="{Binding PlayerImage, Converter={StaticResource ByteArrayToImage}}"
                       Aspect="AspectFill"
                       HeightRequest="60" 
                       WidthRequest="60" />
                <Label Grid.Column="1" 
                       Text="test1" 
                       FontAttributes="Bold" />
                <Label Grid.Row="1"
                       Grid.Column="1" 
                       Text="test2"
                       FontAttributes="Italic" 
                       VerticalOptions="End" />
            </Grid>
        </DataTemplate>
    </CollectionView.ItemTemplate>
</CollectionView>
</StackLayout>