Question

我想在listView中绑定Image。图像保存在Resources Dir中，拾取将基于从json Array获取的Status参数。我＆＃39;我们发现在处理时，甚至在创建UI时都没有触及ImageConverter类。因此，我得到listview，其中包含空白的图像空间和填充（如预期）标签。问题是：如何使它工作？和是否有更简单的方法来执行此类操作

XAML文件：

            <ListView x:Name="contentList"
                      RowHeight="125"
                      VerticalOptions="FillAndExpand"
                      SeparatorVisibility="Default"
                      SeparatorColor="Black"
                      BackgroundColor="White"                         
                      ItemSelected="onOrderSelected"
                      >         
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <ViewCell>
                            <StackLayout VerticalOptions="FillAndExpand"
                                             Orientation="Horizontal"
                                             BackgroundColor="White"
                                             >
                                <Image Source="{Binding Status,Converter={StaticResource ImageConverter }}"
                                       WidthRequest="100"
                                       HeightRequest="100                                             
                                       />
                                <StackLayout Orientation="Vertical">
                                    <Label Text="{Binding Title}"
                                             FontSize="Default"
                                             VerticalOptions="Center"
                                             Margin="20,0,0,0"
                                             TextColor="Black"/>
                                    .
                                    .
                                    .
                                    .
                                </StackLayout>
                            </StackLayout>
                        </ViewCell>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>

转换器：

class ImageConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        string filename = value as string;
        return ImageSource.FromStream(() => new MemoryStream(DependencyService.Get<IWRDependencyService>().GetImageBytes(filename)));
    }
}

Android界面实施

class ImageLoader : IWRDependencyService
{
    public byte[] GetImageBytes(string fileName)
    {
        fileName = fileName.Replace(".jpg", "").Replace(".png", "");
        var resId = Forms.Context.Resources.GetIdentifier(
          fileName.ToLower(), "drawable", Forms.Context.PackageName);
        var icon = BitmapFactory.DecodeResource(Forms.Context.Resources, resId);
        var ms = new MemoryStream();

        icon.Compress(Bitmap.CompressFormat.Png, 0, ms);
        byte[] bitmapData = ms.ToArray();
        return bitmapData;
    }
}

Answer 1

因此，我得到listview，其中包含空白图像和填充（如预期）标签。问题是：如何使它工作？是否有更简单的方法来执行此类操作

要使转换器在Xamarin.Forms中工作，您需要在Xaml中声明转换器，如下所示：

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
         xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
         xmlns:local="clr-namespace:ImageListViewDemo"
         x:Class="ImageListViewDemo.MainPage">
    <ContentPage.Resources>
        <ResourceDictionary>
            <local:MyImageConverter x:Key="ImageConverter"/>
        </ResourceDictionary>
    </ContentPage.Resources>
    ...
</ContentPage>

然后转换器将被正确触发。这是我使用您的代码制作的基本演示：ImageListViewDemo。

Answer 2

如果您的转换器从JSON传递了最终结果状态值，您只需要根据状态值返回ImageSource，因为您的图像已经在资源目录中。

 public override object Convert(object value, Type targetType, object parameter, CultureInfo culture)
 {
     var status = value as WhateverType;
     if (status == someValue1)
     {
         return ImageSource.FromFile("status1Image.png");
     }
     else if(status == someValue2)
     {
         return ImageSource.FromFile("status2Image.png");
     }
     ......
 }

此外，如果它根本不进入您的转换器，您可能需要确保您的Converter在App.xaml或其所在的Xaml文件的资源中定义。

<ListView.Resources>
  <ResourceDictionary>
    <ImageConverter x:Key="imageConverter" />
  </ResourceDictionary>
</ListView.Resources>

将图像从资源加载到ListView

2 个答案: