@zzuegg said:
Hello, is there anywhere any example on how to use the layouts actually?
I tried by “Trial and Error” but i got basically nowhere.
[java]
window = new Window(guiAppstate.screen, “blah”, new Vector2f(100, 100), new Vector2f(200, 200));
Effect showEffect = new Effect(Effect.EffectType.SlideIn, Effect.EffectEvent.Show, 1);
showEffect.setEffectDirection(Effect.EffectDirection.Top);
Effect unshowEffect = new Effect(Effect.EffectType.SlideOut, Effect.EffectEvent.Hide, 1);
unshowEffect.setEffectDirection(Effect.EffectDirection.Top);
window.addEffect(showEffect);
window.addEffect(unshowEffect);
MigLayout layout = new MigLayout(guiAppstate.screen, "[30%]5%[65%]", "[50%][50%]");
window.setLayout(layout);
Button playOffline = new ButtonAdapter(guiAppstate.screen, Vector2f.ZERO);
playOffline.setLabelText("Play Offline");
Button playOnline = new ButtonAdapter(guiAppstate.screen, Vector2f.ZERO);
playOnline.setLabelText("Connect with Facebook");
TextElement label = new LabelElement(guiAppstate.screen, Vector2f.ZERO);
label.setText( "Some very long description text goes right here in the right side of the window. " +
"Some very long description text goes right here in the right side of the window. " +
"Some very long description text goes right here in the right side of the window. ");
label.setLayoutHints(new LayoutHints("span 1 2", "wrap"));
window.addChild(playOffline);
window.addChild(label);
window.addChild(playOnline);
layout.layoutChildren();
[/java]
What i want is, 2 buttons on the left side, and a large text label on the right side.
What i get is 1 button
Could you maybe add some doc, and an example somewhere in the repository/wiki?
Atm, there is not… but it will be posted soon. Still trying to clean some things up. In the mean time, here are a few musts:
- Layout cell definition doesn’t support padding in the definition
- Elements have to define their cell row col in layout hints
- This looks like “cell row# col#” – this is 0 based
- span looks like “span #ofcols #ofrows”
Here is the above in a format that may be what you were looking for. On a side note, setLabelText in Button/ButtonAdapter is experimental until I finish TextElement., So I switched these to setText and replace the LabelElement with the original Label class.
[java]
window = new Window(screen, “Blah”, new Vector2f(100, 100), new Vector2f(200, 200));
Effect showEffect = new Effect(Effect.EffectType.SlideIn, Effect.EffectEvent.Show, 1);
showEffect.setEffectDirection(Effect.EffectDirection.Top);
Effect unshowEffect = new Effect(Effect.EffectType.SlideOut, Effect.EffectEvent.Hide, 1);
unshowEffect.setEffectDirection(Effect.EffectDirection.Top);
window.addEffect(showEffect);
window.addEffect(unshowEffect);
MigLayout layout = new MigLayout(screen, "[200][]", "[50%][50%]");
window.setLayout(layout);
ButtonAdapter playOffline = new ButtonAdapter(screen, Vector2f.ZERO);
playOffline.getLayoutHints().define("cell 0 0","span 1 1","grow true true");
playOffline.setText("Play Offline");
playOffline.setTextVAlign(VAlign.Center);
ButtonAdapter playOnline = new ButtonAdapter(screen, Vector2f.ZERO);
playOnline.setText("Connect with Facebook");
playOnline.setTextVAlign(VAlign.Center);
playOnline.getLayoutHints().define("cell 1 0","span 1 1","grow true true");
Label label = new Label(screen, Vector2f.ZERO);
label.setText( "Some very long description text goes right here in the right side of the window. " +
"Some very long description text goes right here in the right side of the window. " +
"Some very long description text goes right here in the right side of the window. ");
label.getTextElement().setVerticalAlignment(VAlign.Top);
label.getLayoutHints().define("cell 0 1", "span 1 2", "pad 10 0 0 0" ,"wrap","fill true true", "grow true true");
label.setTextAlign(Align.Left);
label.setTextWrap(LineWrapMode.Word);
window.addChild(playOffline);
window.addChild(label);
window.addChild(playOnline);
window.addClippingLayer(window);
layout.layoutChildren();
screen.addElement(window);
[/java]
I’ll do a write up on using the following very soon:
- LayoutHelper
- FlowLayout
- MigLayout