从列表视图中的字节绑定图像 (Windows phone 8.1)

Question

我正在开发我的第一个 windows phone 8.1 应用程序。我需要在列表视图中绑定图像。图片是 bytes[] 格式。我已经使用此函数

转换为 Bitmap 图像

public async Task<BitmapImage> GetImageFromByteArray(string s_FileName)
    {
        using (InMemoryRandomAccessStream raStream = new InMemoryRandomAccessStream())
        {
            using (DataWriter writer = new DataWriter(raStream))
            {
                byte[] data = await GetImageBytes(s_FileName);
                writer.WriteBytes(data);
                await writer.StoreAsync();
                await writer.FlushAsync();
                writer.DetachStream();
            }

            raStream.Seek(0);
            BitmapImage bitMapImage = new BitmapImage();
            bitMapImage.SetSource(raStream);
            return bitMapImage;
        }
    }

现在我需要将此图像绑定到列表视图项中的图像控件。

这是我的 XAML 代码。图像控件名称是 (img_test)

<Grid>
    <ListView x:Name="lst_Test" Background="White" Foreground="Black" SelectionChanged="lst_BestDrivers_SelectionChanged" Margin="10">
        <ListView.Resources>
            <DataTemplate x:Key="ItemsTest">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="15*" />
            <ColumnDefinition Width="15*" />
            <ColumnDefinition Width="15*" />
            <ColumnDefinition Width="30" />
            <ColumnDefinition Width="auto" />
            <ColumnDefinition Width="auto" />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="30" />
            <RowDefinition Height="30" />
            <RowDefinition Height="30" />
            <RowDefinition Height="30" />
        </Grid.RowDefinitions>
        <Grid Grid.Column="0" Grid.RowSpan="4" />
        <Grid Grid.Column="1" Grid.ColumnSpan="5" />

        <Image x:Name="img_test" Grid.Column="0" Grid.RowSpan="3" Margin="10,10,10,10" />
        <TextBlock Grid.Column="1" Grid.Row="0" Grid.ColumnSpan="5" Text="{Binding Name}"></TextBlock>
        <StackPanel Orientation="Horizontal" Grid.Column="2" Grid.Row="1">
            <TextBlock Text="{Binding ID}" HorizontalAlignment="Left" VerticalAlignment="Center"></TextBlock>
            <Image Source="ms-appx:///Assets/Icons/Icon1png" HorizontalAlignment="Right" VerticalAlignment="Center"></Image>
        </StackPanel>
    </Grid>
            </DataTemplate>
        </ListView.Resources>
        <ListView.ItemTemplate>
            <StaticResource ResourceKey="ItemsTest"/>
        </ListView.ItemTemplate>
    </ListView>
</Grid>

提前致谢

编辑： 以下是为澄清更多内容所做的工作：

1- 我使用图像文件名通过远程 Web 服务获取字节数组。

2- 我使用返回的 bytes[] 得到一个 bitmap 对象。

如何使用此数组或位图进行绑定？我尝试了 here 中的示例，但它对我不起作用，因为 Web 服务的调用需要一个 async 调用，这在实现 IValueConverter 接口后是不可能的

Answer 1

假设您的 BitmapImage 在属性中，准备绑定。您可以将图像源绑定到 BitmapImage

<Image x:Name="img_test" Source="{Binding MyBitmapImage}" Grid.Column="0" Grid.RowSpan="3" Margin="10,10,10,10" />

如果属性中没有 BitmapImage，那么您应该只设置对象的来源

img_test.Source = myBitmapImage

Answer 2

在 Whosebug 和其他站点中挖掘并看到许多示例后，我必须解决 async 问题。它使用 here 中的 TaskCompletionNotifier class 解决，它允许我在实现 ivalueconverter 时进行 async 调用界面。使用上述函数从 bytes 数组中获取位图图像。

我需要做的就是

    public class BytesToImageConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, string language)
    {
        using (InMemoryRandomAccessStream raStream = new InMemoryRandomAccessStream())
        {
            return new TaskCompletionNotifier<BitmapImage>(GetImageFromByteArray((String)value));
        }
    }
}

此外，我需要使用此添加静态资源

xmlns:Global="using:MYNAMESPACE"
<Page.Resources>
    <Global:BytesToImageConverter x:Key="LocalImageConverter" />
</Page.Resources>

class BytesToImageConverter 是实现 ivalueconverter 接口的那个。

现在，使用资源绑定图片

<Image DataContext="{Binding PhotoPath, Converter={StaticResource LocalImageConverter}}" 
               x:Name="img_test" 
               Source="{Binding Result}"
               Grid.Column="0" 
               Grid.RowSpan="3" 
               Margin="10,10,10,10" 
               Width="90"
               Height="90"
               Stretch="Fill"/>

源绑定到Result

这样就可以了。

感谢大家

从列表视图中的字节绑定图像 (Windows phone 8.1)

Binding Image from bytes in listview (Windows phone 8.1)

c#

listview

windows-phone-8.1