Button Names on top of their icon?
Brahmanathaswami
brahma at hindu.org
Fri Aug 28 23:17:45 EDT 2015
@ Scott: iconGravity: wow... undocumented feature and this really should
be exposed in the button inspector.. it works.
@ Paul: setting the pattern works.
So far so good, but but the issue is also the vertical alignment of the
button name:
Solution: Set the pattern to the image... set the rect of the button to
exactly the rect of the image and you will clean up any appearance of
the image repeated along the edges (it's a pattern); then use the
textProperty/margins of the button to position the name to center it on
the button. hurray!
Long story:
In both cases.. the default vertical center line of the name of the
button is shifted down from the actual vertical center of the button
itself -- and, now, the icon therein. The engine algorithm seems to be:
hang the text from the top of the "m" height (top of the lower case
letters) on the center line of the button. this seems to be, from my
tests "sticky" , ... as you change size of the type for the name... it
consistently places the text with the top of the lower case letters
aligned to the vertical center of the button
Now... we have this in the dictionary as a possible way to "tweak"
positioning in the iconGravity entry... but it does not help us if you
use iconGravity...
Comments:
The margins and borderWidth are taken into account when rendering the
icon - the rectangle the icon is placed in is taken to be the button
rect after subtracting margins and borderWidth all the way round.
But it does not affect the text position.
but if you use the pattern then setting the button textProperty margin
gives us what we want as documented under the dictionary entry for
"margins" :
"Use the margins property to control how close text within a button or
field can come to the object's edges, how close objects in a group can
come to the group's edges, and how the label of a graphic is displayed."
I wonder if it the button name position holds across platforms...
BR
Paul Hibbert wrote:
> If the image is the correct size for the button, you can assign it to the backgroundPattern (fill) instead of the icon.
>
> Paul
>
> - hide quoted text -- show quoted text -
>> > On Aug 27, 2015, at 21:22, Brahmanathaswami<brahma at hindu.org> wrote:
>> >
>> > Is there some way to get a button name to be centered on top of it's icon?
>> >
>> >
>> > This is a context where the icon is designed to be a background for the button and the center area is clear, plain, flat colored and meant to take the button label. Of course can import the image and put a transparent button on top, but ideally we could center the button name on top of the icon itself... but I can't find a way to do that... is there a way?
>> >
>> > BR
More information about the use-livecode
mailing list