How to use images in Layout Editor


03-01-2014 16:31:21

I can't figure out at all how I'm supposed to set an image on an ImageBox or button from the layout editor... there are a whole bunch of properties (tiles, coord, texture) but I don't know what they mean. Maybe I have to add resources first, but everything I tried didn't work - no errors, but the image isn't displayed. And I can't see documentation anywhere, unless I missed it?

I want to load a single PNG file as the contents of an ImageBox... what should sample .layout look like and how do I build it in LayoutEditor please?

edit: I relaunched LayoutEditor and suddenly my image was visible... then I tried to figure out which properties were used and now it's gone again, and I can't get it to come back. :(


03-01-2014 17:33:10

Aha, ImageBox makes sense... only ImageTexture property should be set to the image file-name in this case. I had forgotten the samples exist, although docs would still be nice :)

Side-question... I was searching on the forum and saw code sample using MyGUI::StaticImage but I can't find this anywhere, is it gone? Is it replaced by ImageBox?


03-01-2014 19:49:54

StaticImage was renamed into ImageBox a while ago.


03-01-2014 20:01:45

About putting images to use in a button... is the only way to create a resource entry for each button listing the images to use? Does one of the tools allow me to do this more quickly?


06-01-2014 15:27:03

Nope, still stuck.

I can get ImageBox to work if I set the filename of an image in ImageTexture field. But I'm trying to figure how to use resources instead and it just isn't working.

I've set up a resources.xml file using the Image Editor (this is correct , at least I can see the images in that tool):<?xml version="1.0" encoding="UTF-8"?>
<MyGUI type="Resource" version="1.1">
<Resource type="ResourceImageSet" name="mobile-c-arm-img">
<Group name="main" texture="Mobile-C-Arm.png" size="256 256">
<Index name="normal" rate="0">
<Frame point="0 0"/>

And I added the containing dir to the directories setting of LayoutEditor... but how should I use this in an ImageBox or ButtonImage? Every combination of settings I try still fails, even after trying to figure out from demos:



07-01-2014 00:46:52

afaik you should set "ImageResource" to "mobile-c-arm-img".

And I added the containing dir to the directories setting of LayoutEditor
I think you also need to add resources.xml to the resources of layout editor. Check in the log if resources.xml is loaded at all?


07-01-2014 09:18:41

Thanks for that. It looks like you're right, ImageResource is where the image name should go. Through a little testing this seems to be the mapping:

Image Editor ------- Layout Editor
Image name ------- ImageResource
Group name ------- ImageGroup
Index name ------- ImageName

I don't know what ImageIndex does, but it doesn't map to the index you set up in the image editor which is confusing!

Also it looks like you're right, I need to add the full path to my Resources.xml file as an additional resource. This could also get confusing when working on more than one project, unless you can set this per-project somehow.

Thanks for the help!


09-01-2014 15:13:27

However, I still can't get ButtonImage to work. Does it require a special set-up of my image resource, certain group/index names perhaps?

Also - ButtonImage doesn't render anything except the image, right? You simply supply the normal/pressed/etc images in your resource.