Resiazable Layout – RelativeCoordinate / RelativeRectangle /


#1

I was wondering what is the best way to create resizable layouts in Juce.

I currently have my own custom layout manager that works similarly to a Table Layout, which works ok. However after seeing the new RelativeCoordinate / RelativeRectangle I think they have a lot of potential and am trying to figure out how to use them for resizable layouts, but was not able to find any examples or docs about the expressions that need to be used with RelativeCoordinate. I understood we are supposed to give some markers in the parent and then create the expression in function of these markers, but I am still not sure upon how to do this.

I also was thinking of using StretchableLayoutManager but then saw in some posts that it is meant to be deprecated; should I stay away from it and wait until RelativeCoordinate / RelativeRectangle are ready?

In fact I was just wondering what is the recommended way of placing components in a layout that is meant to be resizable?

What I would like to do is not have to calculate a position or size for a component, just give it a relative position (depending on the parent and sibling components) and have him size and place itself. My table layout works kind of like this, and by having embedded table layouts in each other, I can achieve almost any layout(but they are all kind of squared and very symmetric), but I wonder if there is a better way. (I would also like to prevent me working on this when a better alternative way is available)

Did anyone already experiment with RelativeRectangle/ RelativeCoordinate or these classes are not ready to use yet?

(I have just updated to Juce 1.53.91)

Thank you very much,
Sorin


#2

Just a small update to clarify my previous post,

I was able to figure out simple ways to use setBounds(RelativeRectangle) to do simple things such as:

		myButton3->setBounds(RelativeRectangle (RelativeCoordinate ("parent.right / 2 + 10"),
                                          RelativeCoordinate ("parent.right - 10"),
                                          RelativeCoordinate ("parent.bottom / 2 + 5"),
                                          RelativeCoordinate ("parent.bottom  - 30")));

but I am still missing is how to use the MarkerList and add markers so I can use something else then “parent”. I am also not very clear on the syntax of the expressions, and so far I am just guessing.


#3

Here’s at least a couple of tips…

  • use setComponentID(“someId”) to name components. You can then use these names in your expressions as well as ‘parent’.
  • it’s possible to avoid the RelativeRectangle/RelativeCoordinate parts, as there’s a version of setBounds that takes a single String for ease;
    e.g.
    myButton1->setComponentID(“b1”);
    myButton2->setComponentID(“b2”);
    myButton1->setBounds(“0,0,parent.width/2,parent.height”);
    myButton2->setBounds(“b1.right,b1.top,parent.width,b1.bottom”);

[i’m not going to go into Markers, as they currently require a bit more work to set up (and i’m tired and it’s late!)… but you can still do a lot without them!]


#4

Thank you very much,