A matter of geometry

[Lorena]

Hi all,
I'm trying to familiarize myself with the visual stack as well as with the code.

Now, I would like to do this simple thing but I can't. I don't understand.

I've taken screenshots to try and explain what I'd like to achieve.

Here is figure 1: the stack is "small" and the items (buttons) are where I want. OK.


Here is figure 2: I put the stack "full screen" and the buttons look like this. That's no good!


Instead I would like the buttons to keep their respective positions (figure 3), but clearly
I put them by hand in the positions I want.


Is there a way to preserve initial button positions whether the stack is small or large?
Your help is greatly appreciated... I've been banging my head on the monitor for two days!

A thousand thanks
Lorena

[Klaus]

Hi Lorena,

you need to add a "resizestack" handler to your card!
Something like:

Code: Select all

on resizeStack pNewWidth, pNewHeight, pOldWidth, pOldHeight
   ## Button center
   set the loc of btn "Center" to the loc of this cd
   
   ## Button FOUR does not need to be moved
   ## Button "Five"
   set the topleft of btn "Five" to (pNewWidth - 10),10
   
   ## Button "Three"
   set the bottomright of btn "Three" to (pNewWidth - 10),(pNewHeight - 10)
   
   ## I'll leave the other buttons to you, but you get the picture! 
end resizeStack

Of course use your own values for the distance from the buttons to the card edges.

Best

Klaus

[stam]

Klaus' recommendation is a bullet proof way of doing this - but it you have many controls it can quickly make the resizeStack handler very long indeed.

I would just add that any objects of the top or left will always be anchored (they don't move when you resize the stack), so you don't need to actively do this - but anything that should be anchored to right or bottom does - in your example that means the top left will stay where it is, but he other three corners do need anchoring.

You have 3 ways of doing this - Klaus' method is very good and recommended, but can become more tricky if there are hundreds of controls on your card. One way around this is to group objects and then just anchor the group - but for a moderately complex layout the resizeStack handler can quickly become humongous...

The Geometry Manager is another - although can be a bit buggy sometimes. However it does work well usually - click the geometry manager pane in the property inspector (the one that looks like a cross), the radio button for position (rather than scale) object and anchor to bottom/right as needed.

The 3rd option is available if you have purchased the megabundle - with the ResponsiveLayout library it's possible to anchor anything to any wall.

Or you can use combinations of any of these.

S.

[richmond62]

I would divide this problem into 2 parts (as only 1 of them may be what you require):

1. When the stack is resized the objects (buttons, fields, and so on) retain their relative positions.

2. When the stack is resized the objects retain their relative positions AND are resized PROPORTIONALLY
to the stack size.
-

-

[Lorena]

Grazie a tutti!
I am, slowly, beginning to understand.

The resizeStack "message" written by Klaus holds the variables "pNewWidth, pNewHeight, pOldWidth, pOldHeight" as it is stated in the manual, while the Richmond stack holds "nWIDD, nHITE, oWIDD, oHITE."

So can I write these variables as I want? Like "NuovaLarghezza, NuovaAltezza, VecchiaLarghezza, VecchiaAltezza"?

And are these variables, I'm trying to explain, like "altimeters" that are updated instantly by resizeStack and then can be communicated to other internal parts of the script?

I'm also trying to figure out how to use the Geometry Manager that Stam pointed out... but it's a bit cryptic.

Thanks to your advice I am working on the new stack which I will then post...I hope to get it done!
Meanwhile really thank you for the support, how would I do without you!

[Klaus]

Buonasera Lorena,

So can I write these variables as I want? Like "NuovaLarghezza, NuovaAltezza, VecchiaLarghezza, VecchiaAltezza"?

si, guisto!

You could also name the parameters Giancarlo, Luigi, Alfredo, Paolo if you like, as long as you
as use these names throughout your "resizestack" handler!

This only tells the engine that there will be 4 parameters with these names, no matter what the names are.
Same for every other hander/function that has parameters.


Best

Klaus

[dunbarx]

Lorena.

One of the beauties of LiveCode is that variable names are entirely up to you, and can be of any length, so long as they are only a single word. They can also contain some symbols, like underscore "_".

The point is that they can be descriptive, which helps everybody understand what they contain. So you can:

Code: Select all

put money into myWallet

where money is a variable containing, hopefully, a number.

Craig

[stam]

Just a not on the variables mentioned:

You rarely actually need these. Instead, just refer to the rect of the card. For example:

Code: Select all

Set the right of button “top right” to the right of this card - 10
Set the top of button “top right” to the to of this card + 10

I actually can’t remember the last time I used the variables "pNewWidth, pNewHeight, pOldWidth, pOldHeight".

I just align objects to either the edges or the loc (the “centre”) of the card or other objects.

S.

[mwieder]

stam- the "last time" may have been when you wanted to center a control. Or resize it proportionally when the stack size changed. Or set limits so that objects don't run into each other. Or...

[richmond62]

Unless you are only aligning things down the left-hand side or along the top resize saves a lot of bother.

[jacque]

stam- the "last time" may have been when you wanted to center a control. Or resize it proportionally when the stack size changed. Or set limits so that objects don't run into each other. Or...

... or an Undo list.

[stam]

stam- the "last time" may have been when you wanted to center a control. Or resize it proportionally when the stack size changed. Or set limits so that objects don't run into each other. Or...

Errrmm no... I don't agree with that:

To centre just use 'loc'.

To resize proportionately just refer to card size - no need to know the parameters passed.

If you want to change layout and stack objects instead of aligning them to 'avoid things running into each other' (i.e. akin to bootstrap 'breakpoints' in web design) you just need to know the card width (or I guess height if you want to align instead of stack).

In short variables "pNewWidth, pNewHeight, pOldWidth, pOldHeight" don't ever enter any of my scripts. I guess they're there if you want to use them, there's just no need to 99% of the time...

An 'undo list' as Jacque mentions is a good use-case for this, but can't think of many others...

[richmond62]

We ESL teachers love Compare & Contrast exercises:
-

-
No resize scripts were hurt in the making of this stack.

[stam]

To be clear Richmond - I didn't say you can't use them, I just said you don't need to use them. You can derive all the required information from the size of the card, as what you are doing is resizing/moving to the current card size, you don't normally need the old size.

So whether you write

Code: Select all

on resizeStack w,x,y,z
...
end resizeStack

or just

Code: Select all

on resizeStack
...
end resizeStack

amounts to the same for all intents and purposes (except when needing to keep a history of previous sizes I guess).
And in many cases it's easier to refer to aspects of the current card geometry such as 'bottomRight' or 'loc' than calculate these coordinates from the given variables. LC already calculates these for us, and I'm inclined to use any shortcut I'm given...

Each to his own

[richmond62]

I only left "w,x,y,z" in the script so that it was clear that those values were NOT being used.