Unable to play GIF image in Xamarin.Forms (Portable)

问题

I am trying to play the GIF images with the Xamarin.Forms (Portable) project. I have implemented with the following code but unable to Play GIF, I don't event see the static image.

There is no error or crash in this code, but I am not able to see the GIF image.

Is there anything wrong in the code?

Interface:

public interface IGif
{
   string Get();
}

iOS Implementation:

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

Android Implementation:

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

GIF Image class:

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);
    }
  }
}

And Finally, I have added to the StackLayout.

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

I have not tested this code in iPhone, maybe it is working in iPhone.

Thank You in advance.

回答1:

This was the silly mistake, I have to give the size of Image inside web view and to GIF class also.

Here is the updated code.

My GIF Class:

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);
        }
    }
}

and Initialization in 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);

Note: I am still working on the Background Part, as it is looking like attached image, I want the transparent background in web view.

Image:

回答2:

By default StackLayout occupies the whole available space but WebView doesn't. Instead just

Gif gifimage = new Gif();

use

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;
        }

Transparency of WebView is different problem. You should use custom renderers https://forums.xamarin.com/discussion/34957/creating-a-webview-with-a-transparent-background

来源：https://stackoverflow.com/questions/42069908/unable-to-play-gif-image-in-xamarin-forms-portable

标签

android

Xamarin

xamarin.ios

xamarin.forms

animated-gif