无法在 Xamarin.Forms（便携式）中播放 GIF 图像答案

【问题标题】：Unable to play GIF image in Xamarin.Forms (Portable)无法在 Xamarin.Forms（便携式）中播放 GIF 图像
【发布时间】：2017-06-23 12:28:59
【问题描述】：

我正在尝试使用 Xamarin.Forms（便携式）项目播放 GIF 图像。我已使用以下代码实现但无法播放 GIF，我没有看到静态图像。

这段代码没有错误或崩溃，但我看不到 GIF 图片。

代码有问题吗？

界面：

public interface IGif
{
   string Get();
}

iOS 实现：

[assembly: Dependency(typeof(GifView_iOS))]
namespace Project.iOS
{
 public class GifView_iOS : IGif
 {
   public string Get()
   {
     return NSBundle.MainBundle.BundlePath;
   }
 }
}

Android 实现：

[assembly: Dependency(typeof(GifView_Droid))]
namespace Project.Droid
{
 public class GifView_Droid : IGif
 {
   public string Get()
   {
     return "file:///android_asset/";
   }
 }
}

GIF 图片类：

public class Gif: WebView
{
    public string GifSource
    {
    set
    {
        string imgSource = DependencyService.Get<IGif>.Get() + value; 
        var html = new HtmlWebViewSource();
        html.Html = String.Format
            (@"<html><body style='background: #000000;'><img src='{0}' /></body></html>",
             imgSource);
        SetValue(SourceProperty, html);
    }
  }
}

最后，我已添加到 StackLayout。

Gif gifimage = new Gif();
gifimage.GifSource = "loading.gif";
StackGif.Children.Add(gifimage);

我没有在 iPhone 上测试过这段代码，也许它在 iPhone 上可以工作。

提前谢谢你。

【问题讨论】：

发生了什么？它会崩溃吗？它不显示任何东西吗？您收到错误消息吗？堆栈跟踪？请阅读here，了解如何在 StackOverflow 上提出一个好问题。
其实没有问题或者崩溃，但是我看不到GIF的图片。

标签： android xamarin xamarin.ios xamarin.forms animated-gif

【解决方案1】：

这是个愚蠢的错误，我必须在 web 视图中给出 Image 的大小，并且还要给 GIF 类。

这是更新后的代码。

我的 GIF 课：

public class Gif: WebView
{
    public string GifSource
    {
        set
        {
            string imgSource = DependencyService.Get<Dependency.IGif>().Get() + value;
            var html = new HtmlWebViewSource();
            html.Html = String.Format(@"<html><body><img src='{0}'  style='width: 100px; height: 100px;' /></body></html>", imgSource);
            SetValue(SourceProperty, html);
        }
    }
}

在 ContentPage 中初始化：

Helpers.Controls.Gif gifImage = new Helpers.Controls.Gif();
gifImage.GifSource = "loading.gif";
gifImage.HorizontalOptions = LayoutOptions.Center;
gifImage.VerticalOptions = LayoutOptions.FillAndExpand;
gifImage.HeightRequest = 120;
gifImage.BackgroundColor = Color.Transparent;
GridLoad.Children.Add(gifImage);

注意：我仍在处理背景部分，因为它看起来像附加图片，我想要网页视图中的透明背景。

图片：

【讨论】：

如果没有自定义渲染器，您无法使 WebView 背景透明
给大小要求就够了。您不必在 html 中设置图像大小

【解决方案2】：

默认情况下，StackLayout 会占用整个可用空间，但 WebView 不会。而只是

Gif gifimage = new Gif();

使用

public WebViewProgrammaticallyPage()
        {
            var StackGif = new StackLayout()
            {
                BackgroundColor=Color.Red,
            };
            Gif gifimage = new Gif()
            {
                WidthRequest = 120,
                HorizontalOptions = LayoutOptions.CenterAndExpand,
                HeightRequest = 80,
                VerticalOptions = LayoutOptions.CenterAndExpand,
            };
            gifimage.GifSource = "icon1.png";
            StackGif.Children.Add(gifimage);

            Content = StackGif;
        }

WebView 的透明度是不同的问题。您应该使用自定义渲染器 https://forums.xamarin.com/discussion/34957/creating-a-webview-with-a-transparent-background

【讨论】：

让我试一试，然后回复你。
没有。它不起作用。我试图在 HTML 中添加一个测试，但仍然对我不起作用。 <html><body style='background: #000000;'>hello<img src='{0}' /></body></html>
实际上，我已经尝试过这段代码，但它也不适合我，我缺少一些东西。 https://developer.xamarin.com/guides/xamarin-forms/user-interface/webview/#HTML_Strings
究竟是什么不起作用？确保您的文件在资产文件夹中并且构建操作是 AndroidAsset