I’ve been trying to make a UI that utilizes the BorderLayout to place a button on the right edge of the screen, but I can’t figure out why the button does not appear on the screen.
I believe its a usage problem on the right way to setup the BorderLayout, but just can’t seem to figure it out.
[java]
GuiGlobals.initialize(this);
BorderLayout mainLayout = new BorderLayout();
Container mainContainer = new Container(mainLayout);
logger.log(Level.INFO, "MainContainer size width: {0}, height: {1}",
new Object[]{settings.getWidth(), settings.getHeight()});
mainContainer.setLocalTranslation(0f, 0f, 0f);
mainContainer.setPreferredSize(
new Vector3f(settings.getWidth(), settings.getHeight(), 0f));
guiNode.attachChild(mainContainer);
SpringGridLayout rightLayout = new SpringGridLayout(
Axis.Y, Axis.X, FillMode.EVEN, FillMode.EVEN);
Container rightContainer = new Container(rightLayout);
mainContainer.addChild(rightContainer, BorderLayout.Position.East);
float moveRightWidth = (float)(settings.getWidth()) / 10f;
float moveRightHeight = moveRightWidth;
logger.log(Level.INFO, "moveRight width: {0}, height: {1}",
new Object[]{moveRightWidth, moveRightHeight});
IconComponent moveRightIcon =
new IconComponent("Interface/RightArrow.png");
moveRightIcon.setOverlay(false);
moveRightIcon.setHAlignment(HAlignment.LEFT);
moveRightIcon.setVAlignment(VAlignment.BOTTOM);
Image moveRightIconImage = moveRightIcon.getImageTexture().getImage();
logger.log(Level.INFO, "moveRightIcon width: {0}, height: {1}",
new Object[]{moveRightIconImage.getWidth(), moveRightIconImage.getHeight()});
float moveRightIconScaleX = moveRightWidth / moveRightIconImage.getWidth();
float moveRightIconScaleY = moveRightHeight / moveRightIconImage.getHeight();
logger.log(Level.INFO, "moveRightIconScale x: {0}, y: {1}",
new Object[]{moveRightIconScaleX, moveRightIconScaleY});
moveRightIcon.setIconScale(Math.min(moveRightIconScaleX, moveRightIconScaleY));
Button buttonMoveRight = new Button("Move Right");
buttonMoveRight.setPreferredSize(
new Vector3f(moveRightWidth, moveRightHeight, 0f));
buttonMoveRight.setBackground(moveRightIcon);
buttonMoveRight.addCommands(Button.ButtonAction.Down, new Command() {
public void execute(Object source) {
moveRight = true;
}
});
buttonMoveRight.addCommands(Button.ButtonAction.Up, new Command() {
public void execute(Object source) {
moveRight = false;
}
});
rightContainer.addChild(buttonMoveRight, 0, 0);
If it were me, the first thing I would do is set some QuadBackgroundComponents with different colors on the various pieces just to see if that illuminates anything.
Just an aside in case there is/was a different bug:
You shouldn’t have to do this:
buttonMoveRight.setPreferredSize(
new Vector3f(moveRightWidth, moveRightHeight, 0f));
…if you’ve already setup the icon as you have. Did you find that you needed it?
Does Lemur work from the top of the screen down? If so, I think my container was being added at 0,0 and then going down which makes it below the screen.
Ah, yes… layouts work in a more logical top down space… so when you position the root components you need to place the top left corner and not the bottom left.
@pspeed said:
Hmmm... it looks like it should be working.
If it were me, the first thing I would do is set some QuadBackgroundComponents with different colors on the various pieces just to see if that illuminates anything.
Just an aside in case there is/was a different bug:
You shouldn’t have to do this:
buttonMoveRight.setPreferredSize(
new Vector3f(moveRightWidth, moveRightHeight, 0f));
…if you’ve already setup the icon as you have. Did you find that you needed it?
There appears to be a “slight” difference. I happen to set the text of the button to “Move Right”. When I include the setPreferredSize, “Move” and “Right” are on separate lines. When I remove the setPreferredSize, “Move Right” is all on one line, but the M and T are right at the very edges of the icon.
Yeah, setPreferredSize completely bypasses any of the default sizing. I guess it just depends on what you really want. I wasn’t sure from your post whether you were happy with either of the mentioned results.
If you aren’t getting what you like and can describe how you do want it to look then I might be able to help.
When placing items into the East area of the BorderLayout, I would like to add a SpringGridLayout that has 1 column with 2 rows. Each row will have a button (2 buttons stacked vertically).
I would like to place these buttons at the bottom of the East area of the BorderLayout.
Do I need to add a row 0 to the SpringGridLayout and pad it so that the buttons end up at the bottom East area? I didn’t see any kind of alignment capability for Layouts?
@pspeed said:
Yeah, setPreferredSize completely bypasses any of the default sizing. I guess it just depends on what you really want. I wasn't sure from your post whether you were happy with either of the mentioned results.
If you aren’t getting what you like and can describe how you do want it to look then I might be able to help.
It’s fine the way it is. I was just answering your question.
@iwgeric said:
When placing items into the East area of the BorderLayout, I would like to add a SpringGridLayout that has 1 column with 2 rows. Each row will have a button (2 buttons stacked vertically).
I would like to place these buttons at the bottom of the East area of the BorderLayout.
Do I need to add a row 0 to the SpringGridLayout and pad it so that the buttons end up at the bottom East area? I didn’t see any kind of alignment capability for Layouts?
If you don’t care if the spring grid layout doesn’t cover the whole area then you could also set a dynamic inset… you might have to guess at the proper “scale” for the top inset, though.
Adding a blank component is one way… using another nested BorderLayout might work also.
I have a similar thing in Mythruna and I seem to have set the layout for the east container to Fill.NONE for y. I don’t know why/how it ends up on the bottom, though. I did the same as you and set a specific preferred size, though. If you go with this approach, you may need to put those two buttons into one panel.
I’m not entirely happy with any of these solutions as sticking things in the corners is a pretty common thing to want to do. If I have some time, I will look into it some more because I seem to have not considered this an issue before… which makes me think I’ve forgotten the solution.
I ended up adding a nested BorderLayout and added the SpringGridLayout to its South position. Of the possibilities you listed, I thought that one was the easiest to figure out and remember later.
@iwgeric said:
I ended up adding a nested BorderLayout and added the SpringGridLayout to its South position. Of the possibilities you listed, I thought that one was the easiest to figure out and remember later.
Thanks for the quick responses.
It’s probably also the “right” solution given the layouts provided.