4

In xamarin forms we can create images like this:

Image i = new Image { Source = "http://www.foo.com/foo.jpg };

After adding this to layout if url returns an image it will display it. What I want to now is is there a way to know if ths Url is an actual image. Otherwise I am going to show an default image.

Regards.

Edit

I have created a function:

public string GetImageSourceOrDefault(string orgUrl)
        {
            var req = (HttpWebRequest)WebRequest.Create(orgUrl);
            req.Method = "HEAD";
            try
            {
                using (var resp = req.GetResponse())
                {
                    bool res = resp.ContentType.ToLower(CultureInfo.InvariantCulture)
                        .StartsWith("image/");
                    if (res)
                        return orgUrl;
                    else
                        return "defualt_logo.jpg";
                }
            }
            catch
            {
                return "default_logo.jpg";
            }

        }

This function does the trick. However, for every image it does a request. I have a listview which shows like 220 entries. Using this method messed up the time that listview gets loaded.

Note: this function is natively called using dependency injection.

Maybe further improvements will do. Any ideas?

Ege Aydın
  • 1,041
  • 1
  • 13
  • 27

2 Answers2

7

FFImageLoading CachedImage supports Loading and Error Placeholders (and much more). It's basically a API compatible replacement for Image with additional properties. You could try that.

    var cachedImage = new CachedImage() {
        LoadingPlaceholder = "Loading.png",
        ErrorPlaceholder = "Error.png"
    };

https://github.com/molinch/FFImageLoading

Daniel Luberda
  • 7,374
  • 1
  • 32
  • 40
2

With Xamarin.Forms UriImageSource you can specify different caching length, and whether caching is used by using the properties CacheValidity and CachingEnabled.

By default it will automatically cache results for 1 day on the local storage of the device.

In your function, as you mention, you are downloading the image every single time.

You have no current functionality that is storing and caching the result for later re-use.

By implementing something like this on the platform specific layer would get around your current solution of re-downloading the image every single time.

Alternatively as a workaround, if you didn't want to implement the above, you could try putting two Image controls stacked upon each other, maybe in a Grid, with the bottom image showing a default placeholder image, and on-top another Image control that would show the intended image, if successfully downloaded, using the UriImageSource.

You could also possibly hook hook into the PropertyChange notification of the Image.Source and detect it being set, with the image then being displayed. Upon detection you could then release the image from the temporary place holder Image control perhaps?

Pete
  • 4,746
  • 2
  • 15
  • 21