Images with databinding via XAML

MicahHooverMicahHoover USMember ✭✭
edited December 2015 in Xamarin.Forms

I am able to display images successfully, but it fails when I try to do it with data binding in a XAML ListView.

I have tried it a couple ways.

1

Image Source="{Binding ImageResourcePath}"

I know the object is getting pulled correctly because I have a label immediately near that pulls another property ("{Binding Street}") successfully.

2

ImageCell Text="{Binding Street}" ImageSource="{Binding ImageResourcePath}"

Both of these approaches show text information just fine, but the image is gone.

I can see the image resources have loaded from a assembly.GetManifestResourceNames check I do. I copied the paths directly from that output to the ImageResourcePath.

I have even put static paths that I can see working (not in the ListView) into the ImageResourcePath, but this shows as blank also.

I have tried switching out the images that work with the databinding images as well. Still blank.

Edit:

These are embedded assembly images

Best Answer

  • PhilipOGormanPhilipOGorman US ✭✭✭
    Accepted Answer

    There is a bug - image source binding doesn't work. You'll have to use code behind

Answers

  • PhilipOGormanPhilipOGorman USMember ✭✭✭
    Accepted Answer

    There is a bug - image source binding doesn't work. You'll have to use code behind

  • MicahHooverMicahHoover USMember ✭✭

    Moved the image to a local (platform specific) resource fixed it.

  • For anyone coming here, like I am, trying to find a solution in 2018 or later, and hoping that in the meantime the bug has been fixed, don't get your hopes up: it's not a bug.

    Image source binding doesn't work in a cross-platform way by design, and Microsoft says as much in the Files section of the documentation. The OP ends up sacrificing the cross-platform ambition and just placing the images in different places in the platform-specific projects.

    Truly disappointing. I'm still looking for a solution of the type originally requested, good luck to anyone else who is too.

  • This post on the Xamarin forums made a huge difference for me: https://forums.xamarin.com/discussion/17953/helpful-shared-project-image-information

    note: the first post basically gives you all the code you need, but a little bit down in the thread there's some advice about project configurations that may be necessary for it to work correctly.

    It basically introduces some custom code that programmatically derives the resource ID during runtime, so it's cross-platform code that customizes itself to whatever platform is currently running it. Working beautifully for me! Here's the version of the suggested approach that I'm using:

    using System.Linq;
    using System.Reflection;
    using Xamarin.Forms;
    using System.Diagnostics;
    
    namespace Helpers
    {
        public class EmbeddedSourceror
        {
            public static ImageSource SourceFor(string pclFilePathInResourceFormat)
            {
                var resourceID = Assembly.GetExecutingAssembly().FullName.Split(',').FirstOrDefault() + "." + pclFilePathInResourceFormat;
    
                Debug.WriteLine("EmbeddedSourceror: resourceID string is " + resourceID);
    
                return ImageSource.FromResource(resourceID);
            }
        }
    }
    

    This lets you write the Xaml code in a totally normal way, such as:

    <Image
                x:Name         ="backingImage"
                Aspect         ="AspectFill" />
    

    And in the code-behind all you have to do is:

        backingImage.Source = EmbeddedSourceror.SourceFor("Images.Backgrounds.flower.jpg");
    

    (note that it's necessary to use the image's shared-project path in ResourceID format)

  • Darn this is hard. The code above only works in some projects.

    At this thread I've posted code that's currently working in all my projects: https://forums.xamarin.com/discussion/comment/332328#Comment_332328

Sign In or Register to comment.