14

I'm new to MonoTouch and iPhone development. I have my images (PNG) in a resources folder in MonoDevelop, however if I want to set the image property for a button in Interface Builder, how do I do that? It's always a blank dropdown. Do I need to use XCode to access the XIB file and then somehow embed the button image file I'll need in it?

rene
  • 41,474
  • 78
  • 114
  • 152
Driss Zouak
  • 2,381
  • 2
  • 26
  • 39
  • I know nothing about monotouch, but in my experience for Interface Builder to "see" an image file the file needs to be part of the same Xcode project that the xib file is part of. You don't actually embed the image file into the xib file, but the nib loader can normally only load resources from the application bundle, and when you add an image to an Xcode project then it gets added as a file that will be in the built application bundle. Therefore, IB expects Xcode project resources to be valid files to refer to in nib (xib) files since it has some assurance they will be there at runtime. – Nimrod Jan 11 '10 at 06:13

4 Answers4

11

This is a known limitation of MonoDevelop and Interface Builder. To add images to an XIB in Interface Builder they must be part of an XCode project, which of course coming from MonoDevelop they're not.

To achieve what you're trying to do you will need to set the image via code, and ensure the build action of your image is set to Content. To do this, simply right click your image inside MonoDevelop, and select Build Action > Content.

On your view with the button on it, create an outlet in Interface Builder for your button, hook it up, then from code to set your image, you just need to use the .FromFile("path/name") method of UIImage.

UIImage buttonImage = UIImage.FromFile ("resources/image.png");
myButton.SetBackgroundImage (buttonImage,UIControlState.Normal);

That's off the top of my head, but I think that should do it.

Ira Rainey
  • 5,173
  • 2
  • 34
  • 42
  • 2
    You can still set the image in Interface Builder, they simply won't show up in IB while you're editing. Add the image to the root dir in monotouch, set as content as above, and in IB set the image to "myimage.png". You'll see a question mark during editing, but during runtime the image will appear. – Eduardo Scoz Jan 31 '10 at 23:40
5

You can manually set the image in Interface Builder, but it wont show up until run time. The image name can include a path, e.g. "images/settings.png".

jamie
  • 2,963
  • 1
  • 26
  • 27
4

All solutions given here are completely wrong and misleading. All you need to do, is place your images in the Resources folder (on the project root), and add your images to this folder. After adding files to this folder, mark all files and make sure their build action is set to BundleResource.

Forumtroll
  • 41
  • 1
  • This features was only added in 2012, so the previous answers were correct, but are now out of date. See here for the developer's answer to the same question: http://stackoverflow.com/a/11493599/66131 . Anyway, your answer worked perfectly, so thanks! – David Miani Jan 18 '13 at 11:24
3

I also needed this to work, here is a workaround I found. You need to create a dummy xcode project. Place it in the same folder as your project. Add all your xib files and image files to that xcode project by dragging them in when the project is opened in xcode. Now you will be able to see the preview of the images. The image files must be in the same folder as the project file and xcode must be opened with the dummy project while the interface builder is opened. Not great - but solves the issue for now. Here is a sample project I have created.

For this issue to be resolved on the MonoDevelop side - some inter-process communication code needs to be created, I think that a good starting point will be looking for "PBXProjectWatcherServerConnection-3.1.2" in google.

Assaf R.
  • 31
  • 1
  • This works... kind of. When i select a picture in the Interface builder, it just uses the immediate name of the picture, and ignores the file path. If i add the file path in the interface builder, the image goes back to the question mark. Is there any way to make it work with the path? – Timothy Groote Apr 08 '11 at 11:09