removeFromLeft does not work when the mainwindow is resizable!

I have two GUI components that i want to print on my main screen side by side .

in resized() section of both i set their bounds like this :

       setLocalBounds(); 

in resized() method of my main window definitions are like this :

delayGui.setBounds(area.removeFromLeft(getWidth() /2));
reverbGui.setBounds(area.removeFromLeft(getWidth()/2));

at first it works fine. I am able to see both of them on the screen but whenever i try to resize the screen , the second one jumps over the first one so first one becomes invisible under the second one.
Actually i want to add more components but even these two dont work.

What am i missing? This is the way that shown in the tutorials but looks like it is not suitable for resizable windows. How do you create something like this ?

If we extract area.removeFromLeft(getWidth()/2) to a variable, we get:

auto newBounds = area.removeFromLeft(getWidth()/2);
delayGui.setBounds(newBounds);
reverbGui.setBounds(newBounds);

This means that both delayGui and reverbGui have the same bounds. They are at the same position and have the same size.

You need to set different bounds. For instance:

delayGui.setBounds(area.removeFromLeft(getWidth()/2));
reverbGui.setBounds(area.removeFromRight(getWidth()/2));

if you want them to be side-by-side.

EDIT: I didn’t read properly the documentation of removeFromLeft, so I missed the fact that it changes area. Please ignore this post :sweat_smile:

The method setLocalBounds() doesn’t exist. You call setBounds() to set the placement of a child component.
To find out the area you can distribute to your children to, call getLocalBounds(). Use getLocalBounds(), because your coordinate system for children shall have the origin at topLeft. Using getBounds() here would return a rectangle with the origin relative to the parent (i.e. grand parent of the child you want to place).

The removeFromXXX() might be a bit confusing at the beginning. It removes a part from the rectangle (in your case area) and returns the part, that was removed, i.e. the area shrinks by that part that is returned. This allows this short writing of what you quoted.

Be careful with your getWidth(), I would suggest to put it into a variable. The result shouldn’t change, but the result of area.getWidth() will.

For more than 2 you can simply use a smaller width:

void resized() override
{
    // if you want to add a margin around, simply chain e.g. .reduced (5) here:
    auto area = getLocalBounds();  

    // simply divide by the number you want to add:
    const childWidth = area.getWidth() / 3;  

    gui1.setBounds (area.removeFromLeft (childWidth));
    gui2.setBounds (area.removeFromLeft (childWidth));
    gui3.setBounds (area.removeFromLeft (childWidth));
}

And for the individual ones you can again add a margin…

This might be the reason for the unexpected behaviour, the children shouldn’t set their own bounds, only their children’s bounds.

:smiley:

You are right :smiley: after changing it as “setBounds()” , it worked. THANK YOU VERY MUCH !!! :pray:

Thank you for trying to help . It is really great to know that there are some people willing to help others here. :pray:

3 Likes