Question

我有一个Xamarin ListView与来自互联网的图像。我想显示一个默认图像（来自嵌入式资源），如果存在，则显示来自网址的图像。

我已尝试使用此代码但仅适用于UriImageSource，而不适用于嵌入式资源：

    <ListView ItemsSource="{Binding Data}">
        <ListView.ItemTemplate>
          <DataTemplate>
             <ViewCell>
                <Image>
                  <Image.Source>
                    <!-- does not works
                    <ImageSource>
       {utils:ImageResource Namespace.Assets.img-placeholder.png}
                    </ImageSource>
                    -->
                    <UriImageSource Uri="{Binding ImageUri}"></UriImageSource>
                  </Image.Source>
                </Image>
             </ViewCell>
         </DataTemplate>
      </ListView.ItemTemplate>
    </ListView>

如果我使用

<Image Source="{utils:ImageResource Namespace.Assets.img-placeholder.png}" />

这可以显示嵌入式资源默认图像

模特：

    public Uri ImageUri => Image != null ?
        new Uri($"http://www.example.com/{Image}")
        : null;

有任何帮助吗？感谢

Answer 1

您可以使用FFImageLoading库。

根据其文件：

<强> LoadingPlaceholder

ImageSource属性。如果设置，则显示加载占位符   加载。它支持UriImageSource，FileImageSource和   StreamImageSource。

<强> ErrorPlaceholder

ImageSource属性。如果设置，如果加载图像时发生错误，则   显示错误占位符。它支持UriImageSource，   FileImageSource和StreamImageSource。

Answer 2

你不必那么复杂。在您的viewmodel中，您只需提供string ImageUri并将其绑定到Image.Source

即可

<Image Source="{Binding ImageUri}" />

这适用于来自网络和资源的图像，但它们必须存在于您的平台项目中。对于Android，你必须将它们放到Resources\drawable（或其他解决方案的相应文件夹）并将构建操作设置为 AndroidResource ，对于iOS设置为Resources（在不同的具有@2x，@3x足够的大小，例如img-placeholder@2x.png），并将构建操作设置为捆绑资源。您现在可以从viewmodel设置占位符：

if(!HasRemoteImage(response))
{
    ImageUri = "img-placeholder.png";
}

Xamarin.Forms将自动为您创建ImageSource。

直接加载资源的一个主要优点是，您不必关心哪个图像是当前分辨率的正确图像。 Xamarin / Xamarin.Forms会自动为您完成。

Xamarin在url上表示图像绑定，默认情况下是嵌入式资源

2 个答案: