Changing space between button text and button image

[mrcoollion]

Does anybody know how I can change the space between the image on a button and the text below?

When I 'set the showName of button "ButtonWithImage" to true' the image is making space for the text but it is not enough.
I would like to have more space between image and button label.
Changing the margins only makes the problem worse because it actually places the text over the image .

I would like to:
Place the label on top or in the middle or at the bottom.
- Label on top, the image should make enough (changeable) space on top for the text or not (a choice)
- Label in the middle, image should stay in full on the button (no space at the bottom or top for text needed)
- Label on the bottom, then i would like the image to make enough (changeable) space on the bottom for the text or not (a choice)

Is this possible?

Regards,

Paul

[Klaus]

Hi Paul,

I think this can be done by changing the buttons width and/or height and setting its "icongravity"* to whatever may fit.
* Check the dictionary for this handy feature.


Best

Klaus

[mrcoollion]

Thanks for the tip Klaus,

found this about icon gravity

http://livecode.wikia.com/wiki/IconGravity

I will try this.

Regards,

Paul

[richmond62]

I've been having a "thing" recently about shoving pictures into the backPattern of graphic objects
for purposes of animations and various other things.

I wonder if one can use resize, and maybe other terms used for manipulating the position of
icons in buttons to setting the backPattern of graphic objects?

[richmond62]

Not really what I had in mind.

[Klaus]

Hi Richmond,

not sure what you were exspecting, but an icon and a backpattern will always reflect the actual image used!
If you resize the image the icon and backpattern will show this new size.

I would always use the icon of a button for animating, since this way you do not need to resize the graphic object no
NOT show the tiling of the image used in it.

Know what I mean? No tiling in icons of buttons!


Best

Klaus

[richmond62]

Thank you, Klaus, that is very useful.

[mrcoollion]

Be aware that it seems that using "icongravity" could change the nature of the picture.
In my case e.g. an animated gif did not animate anymore ?

Regards,

Paul

[richmond62]

If you display an animated GIF inside another control [field, graphic, button] it stops
animating.

But as controlling animated GIF images is more trouble than it's worth that does not fuss me.

If you open an animated GIF in an image editor such as GIMP you can export the frames as separate
PNG or GIF images (both of those formats preserve transparency) and then use then as either
a backPattern or icon with as much fine-grained control as you want in a comparatively simple
way.

[Klaus]

Hm, I just made a little test with 2 different animated gifs:
1. they keep "animating" if set as icon in a button!
2. setting the icongravity does NOT stop the animation!

Livecode 8.01 on a Mac with OS X 10.11.5

[mrcoollion]

Do not know why but the animated gif's work again so please ignore my previous comments on this.

Windows 10 LC 8.0

[richmond62]

Just ran a test:

animated GIFs do NOT animate when used as icons in Livecode 7.x

animated GIFs DO work when used as icons in Livecode 8.x

But: oddly; if one sets up a graphic on the same stack (in LC 8.x) and sets an animated GIF
as its backPattern the animation of both the GIF and the GIF-as-icon in the button stops.

on Linux.

[mrcoollion]

Post the test stack and i will test for Windows 10 and LC 8.0
So we have got the same baseline....

[richmond62]

No sooner said than done; err, well, my supper intervened.

[mrcoollion]

Tested it on Windows 10 LC 8.0 and the results are:
- Initially image and button gif are moving (Mario walks left and right)
- After adding the same gif as a background on the card the image and button gif stop moving and the background does not move at all.
- However if (and only if) I set the visible of the image 'sm' to false and then to true again via the project browser (click on the eye behind the image sm), then the image 'sm' and button gif's both start moving again .
- Never could get the image moving as a background image for the card.
- Also the first time I added a new card after setting the gif as a background image for the card with the button and sm image, the gif started moving again . That made me play and is also how I found out that the visible on/off switch makes the gif's run again.

I personally would like to have an animated gif work in any situation because they are a very easy way to make moving visible's in my applications .

Regards,

Paul