Search code examples
xamlxamarin.iosxamarin.formscross-platformasset-catalog

How do I load an image from the Asset Catalog on cross-platform xamarin XAML?


It seems like a really easy thing to do, and in theory it looks very straight forward:

  1. create the Asset Catalog
  2. add an Image Set and name it "imageName" (without .png)
  3. add the images
  4. done

or at least that's what i read pretty much everywhere, but I still can't get it to work.

My XAML looks like this:

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:CrossBaiscs"
             x:Class="CrossBaiscs.MainPage">
    <ContentPage.Content>
        <StackLayout BackgroundColor="Orange">
            <Label Text="Welcome to Xamarin.Forms!"
                   TextColor="White"
                VerticalOptions="CenterAndExpand" 
                HorizontalOptions="CenterAndExpand" />

            <Image VerticalOptions="CenterAndExpand"
                   HorizontalOptions="Center"
                   Source="logo1.png"/>

        </StackLayout>
    </ContentPage.Content>
</ContentPage>

And I added the images on the Asset Catalog:

Screenshot

I'm testing with Xamarin Live Player on an Iphone 6, and I can't see any image under the Label.

So... What am I missing?

EDIT

It works for this guy: Is it possible to use Image Set in a Xamarin Forms

But not for me, i did try removing the .png extension and leaving the xaml like this:

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:CrossBaiscs"
             x:Class="CrossBaiscs.MainPage">
    <ContentPage.Content>
        <StackLayout BackgroundColor="Orange">
            <Label Text="Welcome to Xamarin.Forms!"
                   TextColor="White"
                VerticalOptions="CenterAndExpand" 
                HorizontalOptions="CenterAndExpand" />

            <Image VerticalOptions="CenterAndExpand"
                   HorizontalOptions="Center"
                   Source="logo1"/>

        </StackLayout>
    </ContentPage.Content>
</ContentPage>

Still doesn't work. Tried cleaning build folders and deleting bin/obj folders, still nothing.

Tried adding the resources to the Resources folder and deleting the Image Set from the Asset Catalog:

Resources on folder

Still didn't work.

Ideas?

EDIT 2

I left those 3 images on Resources folder and added the extension .png on XAML and it worked, still would be nice to know how its supposed to be done using the Asset Catalog.


Solution

  • We were testing on Xamarin Live Player on an IPhone, turns out Asset Catalogs are not yet supported. (https://twitter.com/praeclarum/status/941775333753217025?s=08)

    Thanks for the replies!