CODEWITHSUNDEEP
xamarinxamarin.formsxamarin.iosxcasset
user2074945
user2074945

Reputation: 557

Xamarin Forms iOS - Display image from asset catalog

I know that there are serveral questions on SO covering the topic, however, so far they didn't help me to solve the problem. I want to display an image in xamarin forms. On android it works, on iOS the image wont show up. I use asset catalog to define the image in iOS. Please see below:

Xaml:

<Image Opacity="0.4" Source="happinessfactury.png" Aspect="AspectFill" />

iOS project file:

<ImageAsset Include="Assets.xcassets\happinessfactury.imageset\Contents.json" />
<ImageAsset Include="Assets.xcassets\happinessfactury.imageset\[email protected]" />
<ImageAsset Include="Assets.xcassets\happinessfactury.imageset\[email protected]" />
<ImageAsset Include="Assets.xcassets\happinessfactury.imageset\[email protected]" />

contents.json

{"images": [
{
  "idiom": "universal"
},
{
  "filename": "[email protected]",
  "scale": "1x",
  "idiom": "universal"
},
{
  "filename": "[email protected]",
  "scale": "2x",
  "idiom": "universal"
},
{
  "filename": "[email protected]",
  "scale": "3x",
  "idiom": "universal"
},
{
  "idiom": "iphone"
},
{
  "scale": "1x",
  "idiom": "iphone"
},
{
  "scale": "2x",
  "idiom": "iphone"
},
{
  "subtype": "retina4",
  "scale": "2x",
  "idiom": "iphone"
},
{
  "scale": "3x",
  "idiom": "iphone"
},
{
  "idiom": "ipad"
},
{
  "scale": "1x",
  "idiom": "ipad"
},
{
  "scale": "2x",
  "idiom": "ipad"
},
{
  "idiom": "watch"
},
{
  "scale": "2x",
  "idiom": "watch"
},
{
  "screenWidth": "{130,145}",
  "scale": "2x",
  "idiom": "watch"
},
{
  "screenWidth": "{146,165}",
  "scale": "2x",
  "idiom": "watch"
},
{
  "idiom": "mac"
},
{
  "scale": "1x",
  "idiom": "mac"
},
{
  "scale": "2x",
  "idiom": "mac"
}],"info": {
"version": 1,
"author": "xcode"},"properties": {
"on-demand-resource-tags": [
  "happinessfactury"
]}}

EDIT 1 In Xaml I mistakenly set the source to Source="happinessfactury" which was wrong. However even with Source="happinessfactury.png" it is not working on iOS. (On android though)

EDIT 2 It's a little bit embarassing, but I solved the issue. The mistake was to reference the image in xaml by happinessfactury instead of happinessfactory which is the correct name and also the name of the image files.

Upvotes: 2

Views: 2097

Answers (1)

K.Warrens
K.Warrens

Reputation: 35

First off, I'm a little confused as to if you are using Xamarin.Forms or Xamarin.iOS. But one possible solution when using Xamarin.forms with PCL, is to simply add the images you wish to display to an Assets folder in your Portable project. And then set the image source in code behind using a ImageSource.FromResource() like so:

MyImg.Source = ImageSource.FromResource("ProjectName.Assets.happinessfactury.png");

Another source that might help is the Book Creating Mobile Apps with Xamarin.Forms

Upvotes: 0

Related Questions