Problems with Images and Buttons (SOLVED)

[Traxgeek]

Hi,

I have an image resource folder on my Dev machine - it contains all the images, in various sizes, that my app needs...
So that I don't have to ship these raw images with the app and to make the app a little faster once loaded... I select the images the app needs and place them on a hidden card within the app.

BUTTONS
Populating button icons with these images is pretty simple :
'set the icon of button "MyButton" of card "MyCard" to 1234' - where 1234 is the ID of the source image on the hidden card).

If I'm to achieve this across stacks / sub-stacks then I simply amend the code line to be:
'set the icon of button "MyButton" of card "MyCard" to 1234 of stack "MyResourcesStack"

For me, that's pretty intuitive and straight forward. And... I use buttons to display all sorts of 'images' at runtime, setting the 'Disabled' to true if there's no text within the button / I don't care about the button text greying out -or- simply not giving the button any script and unchecking its 'Focus' properties... Simple...

The problem is (as far as I can tell) a button's icon does NOT resize when one resizes the button itself (for whatever reason)... which can be a real pain...

---

IMAGES
Images, on the other hand, don't appear to be quite so friendly, but do allow themselves to be resized... wonderful...
So, it's pretty simple to load an image with the selected file/source image both at dev time - using the 'Source' option in the Properties Inspector, navigating to my required image and selecting 'Open' and at runtime - using something like 'set the filename of image "MyImage" to ImagePath & "/" & ImageName'... all very Simple...

Now for the problem :
I cannot for the life of me get the contents of one image to be transferred to another image. Example; I have a (hidden) Image Resource card, on it I have a hidden image of a 'X' and a 'O'. I then have a game playing card for OXO / 'Naughts and Crosses'. The game card is really simple - 9 empty images in a 3 x 3 grid. Clicking on an image SHOULD copy the contents of either the 'X' or the 'O' source image (on the Image Resource card) into the selected/clicked image on the game card... (sound of raspberry blowing - ) It does not. I have tried :

so many different versions of : the 'text' of my source image to the 'text' of my destination image, the 'ID' of my source image to the 'ID' of my destination image, image to image.... arghhh...
Some of my attempts fail with an error BUT a lot don't (and don't actually seem to do anything either)

set the text of image "MyImage" of card "MyCard" to 2115233
set the text of image "MyImage" of card "MyCard" to image id 2102544
set the text of image "MyImage" of card "MyCard" to image id 2102544 of card "MyCard"
set the text of image "MyImage" of card "MyCard" to image id 2102544 of stack "MyStack"
put the text of image "MySourceImage" into the text of image "MyImage"
put the text of image "MySourceImage" of card "MyCard" into the text of image "MyImage" of card "MyCard"
it goes on ad infinitum and I forget everything I've tried, frustration sets in and then I repeat previous errors... It's horrible...

There is manifestly, something I am missing... but what ? Do the 2 images have to be the same size (it doesn't seem to make any difference during my tests...
What am I missing ?
This is SOOOOO frustrating...
If I switch the game card images for buttons, I can load/populate them as per the button script above BUT, I can't resize them... hmmm... so, I switch the buttons to images but now I can't load / populate them like I did with the buttons... What am I doing wrong please ?

A lot of the above is for those like me that simply become frustrated with all the examples that don't in reality seem to work and an attempt to clear up some confusion or missing 'nugget' that, I (at least) have... So, I hope it helps BUT it still doesn't provide a definitive answer re: how to populate one image control with the contents of another...
I'm hoping someone can clear this one up for me - it's driving me nuts...

Regards.

[jacque]

There are two ways to populate image contents and you can't mix them.

1. put image 1 into image 2
2. set the text of img 2 to the text of img 1

For your example:

set the text of image "MyImage" of card "MyCard" to the text of image id 2102544 of stack "MyStack"

OR

put image id 2102544 of stack "MyStack" into image "MyImage" of card "MyCard"

[Traxgeek]

Thanks a million Jacque,
For some reason I've struggled with this, on and off, for days. I'll give this a go tomorrow when i'm back at LC.
Again, thanks a mil.

[Klaus]

You already had it correct here: http://forums.runrev.com/phpBB2/viewtop ... 922#p89915
??? What gives?

[Traxgeek]

Hi Klaus,

Dunno... I tried both Jacque's methods (the same methods I've used before I think) but... still 'nada' / muffin / not a squidgie...

Just moved up to 6.1.2 (2016) but don't think it's that (just going to try it in my old 5.4.2) but... (sigh) I am clueless as to what's going on...
It's held me up for more than a day now and... it's most annoying because in the past I've used buttons (like you also suggest in the post you referenced) but the problem is that a button's icon seems not to resize when you resize the button itself. Therefore, I've been switching buttons (both where I've used them as an 'image' and where I've had a button with an icon / icon + text) throughout the app to images and, where necessary, grouped labels. All this works great EXCEPT I can't populate the image (that's a proper image -not a button with its icon masquerading as an image !) from another image held on a resources substack... infuriating. Simple enough to load the image by pointing it at my Images sub-folder via the Properties Inspector - but I want to be able to change the image at runtime.

The REAL reason it's so frustrating is that once this is complete I have a real simple runtime stack resize script that works with, well, every control I've tried (including DGs)... and I'm desperate to finish the image issue (It was just the button icons that didn't resize !) ...

Nevermind. I'm back on the case now and will, hopefully, get a result within the next few minutes (calmer head and all that !)...

Regards.

[Traxgeek]

What a larf (NOT) !

I just put two new images on a card; 'imgS' (the source image) and 'imvd' (the destination image).
I put some old .png into 'imgS'.


Then, I selected 'Run' and then launched the Message Box.
In the Message Box I typed :

set the text of image "imgD" to the text of image "imgS"
... the instruction was 'accepted' (no errors) BUT nothing happened...

so, I then tried :
put image "imgS" into image "imgD"
again... the instruction was 'accepted' (no errors) BUT nothing happened...

so, then I tried :
set the text of image "imvd" of card "MyCard" to the text of image "imgS" of card "MyCard"
... again, the instruction was 'accepted' (no errors) BUT nothing happened...

If I force a screen redraw (by navigating away from the card and then coming back to it); still nothing !

Similarly (just as a 'see if I can make LC mad at me !) :
set the text of "imgD" of card "crdSplash" to the text of "imgS" of card "crdSplash"
... again, the instruction was 'accepted' (no errors) BUT nothing happened... Now, I believe this is u/s because I've omitted the 'image' control identifier of 'imgS'' and 'imgD'; I'm simply surprised LC lets me away with it !

Right, I'll go try this in 5.4.2... worth a shot...
This must be so ridiculously simple...

EDIT1 - Oops - that's LC V 5.5.4 (not 5.4.2)
EDIT2 - Nah ! Same in 5.5.4 ! This is quite obviously not a bug so what the heck am I doing wrong ?

[jacque]

Are these imported images or referenced images? Referenced images have no "text", they are drawn from content on disk. If you want to change an image that's referenced, you need to set its filename, not its content.

Try using imported images ("Import as control" in the File menu) and what you are doing will work. If you want to keep the referenced images, then:

set the filename of img 2 to the filename of img 1

[Klaus]

Are these imported images or referenced images?

Yep, just had the same idea

[Traxgeek]

hmmm... confusing ? ? ? Surely (sorry, frustration getting the better of me - I can;t help but wonder how many people wander away after this type of issue... however...)

To answer you question, I'm not 100% sure what each means...

Let me explain (I'm calming down - sorry for the rant above, but really ! )

I drag an image onto a card.
I name said image "imgS"
I 'populate' / 'load' the said image - using the little 'Source' (folder) icon in the Property Inspector and selecting some old .png file...

I then create a second image - by dragging it onto a card.
I name 2nd said image "imgD"

I then used the instructions as per previous posts...

So would the Source image "imgS" be considered 'Referenced' or 'Imported' ?
To me I simply imported / loaded a file into an image control (or populated an image control)- "imgS" and then I referenced said "imgS" in my attempt to 'copy' it into "imgD".

Must confess to being a little confused and also a little frustrated (I would say 'angry', but I know Klaus will slap me for that !) that this isn't made so much clearer in the documentation. I've said it before, there's loads of it (documentation) but... (in may cases - not all) it's so difficult extracting pertinent information from it - case in point being all the above simply to populate an image from another image...

Ooops ! bordering on further ranting - my time will be better spent methinks trying your suggestions which, if you'll excuse the rant (forgive me please - it's my sheer frustration), I am extremely grateful for - even should I not sound it.

Seriously Jacque / Klaus - I can't thank you enough... Thumbs up to you two !!

By the way, in my frustration, my work-around was to create multiple images, one on top of the other and set the visible property of each as required. Well, it works... but...

Thanks a million - both of you.

EDIT 1 : Why though can I use whatever type of image I have on my resources sub-stack to populate a Button icon but NOT an Image ? What's the logic here please ?

EDIT 2 : filename -> filename works perfectly - THANK YOU ! (but why the difference plea between button icons and images ? - Just so I understand...)
Finally, I have tried to be as accurate & provide as much info as I can from the outset with this thread - purely in the hope it'll help others. So, your help is even more appreciated !
Have a great night.

[jacque]

The frustration is a normal part of the learning curve, so don't worry. We have all been through it and we understand perfectly. The wide choice of options in LiveCode is both a blessing and a curse.

A referenced image is what you did -- you assigned a file name to a blank image object. It is now referenced from disk -- that is, it has no content of its own, it pulls from the file reference. Think of it sort of like an alias to the real image file. These images are loaded dynamically when the card opens. If your image on disk is moved, the image object in the stack will break; there will be nothing displayed because the file path has changed.

If you import an image as a control, the actual image data is brought into the stack and stored as binary code in the stack file. It does not rely on any file paths because the whole image is inside the stack. You don't have to worry about what's on disk or where it's located. To create an imported image, don't drag an image object from the palette, just choose the menu item.

There are pros and cons to both methods. An imported image will never be lost but it takes up room in the stack. A referenced image keeps the size of the stack down but moving the file on disk will break the reference (which is why it's usually a good idea to use relative paths, but even that won't help if you move or rename the file.) I use referenced images when I need to change the content frequently or on demand. I use imported images for icons and other permanent displays like backgrounds or card artwork. Actually, I use imported images far more often than referenced ones.

Icons can only be assigned to imported images; they can't be fetched from disk. This is just a restriction in how the engine works. They are generally small and fit well inside a stack. Many people put all the icon images and other permanent images in a substack that is never shown, it serves only as an image repository. I do that frequently. Or you can put them all inside a group and either hide or unplace the group. If you only have a few images it's fine to just plunk them on a card and hide them. There are many ways to store icon images, but they all will be inside the stack somewhere.

Does that help? There's a big learning curve at first, but at some point the shoe will drop and you will experience a eureka moment. And after that it is smooth sailing.

EDIT: There's more explanation in the User Guide about the differences in these sections:

13.1.1 Importing Images
13.1.2 Importing Referenced Images

The User Guide can be found with the Resources icon in the tool bar, it's listed in the left-hand column there.

[Traxgeek]

Hi Jacque,

Excellent, much to think about !