xamarin.forms DataBinding and ImageSourceProperty

Question

I have a problem with a Xamarin forms app crashing in Android after getting images from the web. Everything works fine if I use this code:

Image myImage = new Image
{
   Source = ImageSource.FromUri(new Uri(myObj.ImagePath1)),
};

When I get the images for a listview using a custom renderer for an image cell is crashes pretty quickly.

This is my code for the listview with databindings

listView.ItemTemplate = new DataTemplate
  (typeof(MyImageCell))
    Bindings = {
        {TextCell.TextProperty,
            new Binding("MyTitle")},
        {TextCell.DetailProperty,
            new Binding("MyAddress")},
      {ImageCell.ImageSourceProperty,
         new Binding("MyURL")},
  }
};

I am new to C# and all things Xamarin and I have no idea how I declare it like the first example and still use it in the binding code. I have tried many different ways but nothing seems to work. Hopefully it something simple that I am missing.

Cheers

Answer 1

You are creating complex rows, right. In that case you won't use primitive cells but instead ViewCell with complex layout (i.e. StackLayout). Here is a sample that creates a StackLayout with a bound Image and an unbound Label (you could bind that as well). My ItemsSource is an array of Src instances (that'd be your MyImageCell probably) where Src.Source is a string containing an URL to an image.

        ListView lv = new ListView();
        lv.ItemTemplate = new DataTemplate(() =>
            {
                Image image = new Image();
                image.SetBinding(Image.SourceProperty, "Source");

                return new ViewCell
                {
                    View = new StackLayout
                    {
                        Children = {
                            image, new Label{ Text = "Tubo"}
                        }
                    }
                };
            });
        lv.ItemsSource = new Src[] { new Src(), new Src() };
        ...

public class Src
{
    public string Source { get; set; }

    public Src()
    {
        Source = "http://blog.rthand.com//images/Logo_vNext.png";
    }
}