Multilne text. Libgdx - java

How to crate a multiline text? I tried to use Label , but text have only 1 line.
Table table = new Table();
table.setPosition(0,0);
table.setSize(800,440);
label = new Label("Some long string here...", skin);
label.setFillParent(true);
label.setAlignment(center);
label.setPosition(0,0);
label.setWidth(40);
label.setHeight(label.getPrefHeight());
label.setText(tutortext);
table.addActor(label);
stage.addActor(table);
stage.setDebugAll(true);
https://i.stack.imgur.com/3whQr.png

Use setWrap(true); on label.
According to doc.
If false, the text will only wrap where it contains newlines (\n). The preferred size of the label will be the text bounds.
If true, the text will word wrap using the width of the label. The preferred width of the label will be 0, it is expected that something external will set the width of the label. Wrapping will not occur when ellipsis is enabled. Default is false.
When wrap is enabled, the label's preferred height depends on the width of the label. In some cases the parent of the label will need to layout twice: once to set the width of the label and a second time to adjust to the label's new preferred height.
I've tested with small example :
public class MultiLine extends ApplicationAdapter {
Stage stage;
Skin skin;
#Override
public void create() {
stage=new Stage();
skin=new Skin(Gdx.files.internal("skin/glassy-ui.json"));
Label label=new Label("MULTILINE IN LIBGDX GAME DEVELOPMENT",skin);
label.setWrap(true);
Table table=new Table();
table.setFillParent(true);
table.add(label).width(150);
stage.addActor(table);
}
#Override
public void render() {
Gdx.gl.glClearColor(0,0,0,0);
Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
stage.draw();
stage.act();
}
#Override
public void dispose() {
stage.dispose();
skin.dispose();
}
}
Here is the output :

A way simpler solution is to just use \n for linebreaks so instead of
Label label=new Label("MULTILINE IN LIBGDX GAME DEVELOPMENT",skin);
you would just do
Label label=new Label("MULTILINE\nIN\nLIBGDX\nGAME\nDEVELOPMENT",skin);
The label will be:
MULTILINE
IN
LIBGDX
GAME
DEVELOPMENT

Related

How to display white text with a black background?

I am trying to figure out why my text isn't being displayed here. I assume it isn't being colored white, and simply doesn't show up against the black background. So, I'm trying to figure out why the background is being colored black, but the text isn't being shown.
I am using JavaFX 12.
How can I color the letters white?
public class MCVE extends Application {
private static Stage gameStage = new Stage();
#Override
public void start(Stage primaryStage) {
gameStage.setScene(new Scene(createScreen(), 1280.0, 800.0));
// adjust window settings.
gameStage.setTitle("my game");
gameStage.setResizable(false);
gameStage.show();
}
private Pane createScreen() {
Text welcome = new Text("Welcome,");
welcome.setFont(new Font("Old_Style", 22.0));
welcome.setStyle("-fx-text-fill: whitesmoke");
Text toMyGame = new Text(" to my game.");
toMyGame.setFont(new Font("System", 14.0));
toMyGame.setStyle("-fx-text-fill: whitesmoke");
TextFlow tf = createTextFlow();
ObservableList list = tf.getChildren();
list.addAll(welcome, toMyGame);
return tf;
}
private TextFlow createTextFlow() {
String style = "-fx-background-color: black;";
style += " -fx-text-fill: whitesmoke;";
TextFlow tf = new TextFlow();
tf.setStyle(style);
return tf;
}
}
-fx-text-fill is a CSS property of Labeled, not Text. Text is a type of shape, and Shape supports -fx-fill rather than -fx-text-fill.
Changing every occurrence of -fx-text-fill to -fx-fill should give you the appearance you want.

How to change the value of a Slider programmatically? (LibGDX)

I think I am missing something obvious, but I can't seem to change the value of a Slider (Scene2D.ui) programmatically.
The reason that I want to do this is because I have a character that you can customize with the sliders but I want to have some preset characters that you can use as a starting point for customization.
What I have so far is something like this:
(ChangeListener)(slider.getListeners().get(0)) but I cannot call the changed(ChangeEvent event, Actor actor) method that is called when the slider is changed.
You can use setValue(float value) method of Slider to change value of slider programmatically.
public class GdxTest extends ApplicationAdapter {
Stage stage;
Slider slider;
#Override
public void create() {
stage=new Stage();
Gdx.input.setInputProcessor(stage);
Skin skin=new Skin(Gdx.files.internal("skin/glassy-ui.json"));
Table table=new Table();
table.setFillParent(true);
stage.addActor(table);
table.add(slider=new Slider(0,100,1,false,skin));
slider.setValue(50); // value changed by 50%
}
...
}
slider.setAnimateDuration(0.3f);

Libgdx making lists and scrollpanes wrap text?

I was wondering, if there is anyway to make a ScrollPane and Lists that wrap text horizontally in LibGDX. I would love the scroll pane to scroll vertically but for it to wrap its text instead of scrolling horizontally.
I know I can disable the X direction of scrolling by using
scrollPane.setScrollingDisabled(false, true);
but is there anyway to make the text wrap so that there is no horizontal scrolling and it would just go to a new line?
You can do in this way :
public class ScrollPaneTest extends ApplicationAdapter {
private Stage stage;
private Table container;
#Override
public void create () {
stage = new Stage();
Skin skin = new Skin(Gdx.files.internal("skin/glassy-ui.json"));
Gdx.input.setInputProcessor(stage);
container = new Table();
stage.addActor(container);
container.setFillParent(true);
Table table = new Table();
final ScrollPane scroll = new ScrollPane(table, skin);
scroll.setScrollingDisabled(true,false);
table.pad(10).defaults().expandX().space(4);
for (int i = 0; i < 100; i++) {
table.row();
Label label=new Label(i + ". Publish your games on Windows, Mac, Linux, Android, iOS, BlackBerry and HTML5, all with the same code base.", skin);
label.setAlignment(Align.center);
label.setWrap(true);
table.add(label).width(Gdx.graphics.getWidth());
}
container.add(scroll).expand().fill();
}
#Override
public void render () {
Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
stage.act(Gdx.graphics.getDeltaTime());
stage.draw();
}
#Override
public void resize (int width, int height) {
stage.getViewport().update(width, height, true);
}
#Override
public void dispose () {
stage.dispose();
}
}
And the output is :
You can wrap the text by using Labels. Then add those Labels to your scrollpane.

JavaFX - label size not initialized

I am working on an application that enables the user to draw graphs, i.e. edges and nodes. As nodes I am currently using plain JavaFX label elements. When drawing the edges, I need to consider the bounds of the label, however, the width and the height of the labels seem to be initialized only after "drawing" it. E.g., when starting the application the label bounds have a width/height of 0, but if a label is repositioned by the user, the width/height is correct.
Is there a possibility to force JavaFX to draw the current elements? The code is rather complex, but the following gives an idea of what I want to do:
stackpane = new StackPane();
text = new Label("Test");
text.setStyle("-fx-border-color:black; -fx-padding:3px;");
stackpane.getChildren().addAll(text);
...
// is it possible to force JavaFX to draw the text here?
...
// some calculations with the bounds of the label
Node node = getLabel();
Bounds bounds = node.getBoundsInParent();
double height = bounds.getHeight();
double width = bounds.getWidth();
I also tried to wrap the text in a rectangle and then manually set the width/height of the rectangle. This works, but the nodes have labels of different length and thus manually setting it is not always suitable.
You may try to bind your logic to node.boundsInParentProperty() changes
public class SmartBorder extends Application {
#Override
public void start(Stage primaryStage) {
final Label txt = new Label("Example");
txt.relocate(100, 100);
Pane root = new Pane();
final Rectangle border = new Rectangle();
border.setFill(Color.TRANSPARENT);
border.setStroke(Color.RED);
// here we autoupdate border
txt.boundsInParentProperty().addListener(new ChangeListener<Bounds>() {
#Override
public void changed(ObservableValue<? extends Bounds> ov, Bounds old, Bounds b) {
border.setX(b.getMinX() - 1);
border.setY(b.getMinY() - 1);
border.setWidth(b.getWidth()+2);
border.setHeight(b.getHeight()+2);
}
});
root.getChildren().addAll(txt, border);
// click to see automatic border reaction
root.setOnMouseClicked(new EventHandler<MouseEvent>() {
#Override
public void handle(MouseEvent t) {
txt.relocate(Math.random()*200, Math.random()*200);
txt.setText(Math.random() + "");
}
});
Scene scene = new Scene(root, 300, 250);
primaryStage.setTitle("Hello World!");
primaryStage.setScene(scene);
primaryStage.show();
}
}

TitleAreaDialog - adjusting the title image

So I am creating a image to place in the title area. Everything works with the exception that only a 1/4th of the image is displayed?
my image is actually text and a image combine in one image EX: JKTeater [ ] <-- icon
so right now only JKT is showing in the title area
Here is the create() method
public void create() {
super.create();
setTitle("JKTeater Application");
setMessage("Hello World");
if (image != null) setTitleImage(image);
}
Is there a specific size that the title area code allows for?
Is there a way to place the end of the image at the end of the title area?
Can you use a layout to move it around?
How can I get a black horizonal line at the bottom of the title area?
EDIT
I am sure that it would be asking to much to see if you can actually change the background color from a basic color to a gradient
Here is an example TitleAreaDialog. As you can see, the Image is completely shown and aligned to the right:
public static void main(String[] args) {
final Shell shell = new Shell();
shell.setLayout(new FillLayout());
TitleAreaDialog dialog = new MyTitleAreaDialog(shell);
dialog.setTitleAreaColor(Display.getDefault().getSystemColor(SWT.COLOR_WIDGET_BACKGROUND).getRGB());
dialog.open();
}
private static class MyTitleAreaDialog extends TitleAreaDialog
{
private Image image;
public MyTitleAreaDialog(Shell parentShell) {
super(parentShell);
image = new Image(Display.getDefault(), "/home/baz/Desktop/StackOverflow.png");
}
#Override
public boolean close() {
if (image != null)
image.dispose();
return super.close();
}
#Override
protected Control createContents(Composite parent) {
Control contents = super.createContents(parent);
setTitle("Title");
setMessage("Message");
if (image != null)
setTitleImage(image);
return contents;
}
#Override
protected Control createDialogArea(Composite parent) {
Composite composite = (Composite) super.createDialogArea(parent);
// YOUR LINE HERE!
Label line = new Label(parent, SWT.SEPARATOR | SWT.HORIZONTAL);
line.setLayoutData(new GridData(SWT.FILL, SWT.END, true, true));
return composite;
}
}
Is there a specific size that the title area code allows for?
AFAIK there are no restrictions to the size. I tried using an Image that was larger than my screen resolution and it was fully displayed. The Dialog was obviously unusable though.
I am sure that it would be asking to much to see if you can actually change the background color from a basic color to a gradient
The background color can be changed using dialog.setTitleAreaColor(RGB) (in this case the widget background color), but you cannot use a gradient. There is a deprecated method getTitleArea() which would return the title area Composite, but I really wouldn't recommend using that.
How can I get a black horizonal line at the bottom of the title area?
The line at the bottom was achieved by using:
Label line = new Label(parent, SWT.SEPARATOR | SWT.HORIZONTAL);
line.setLayoutData(new GridData(SWT.FILL, SWT.END, true, true));
Can you use a layout to move it around?
There is a similar question here:
Moving an image of a TitleAreaDialog to the left
The answers there explain how to change details of the TitleAreaDialog. Maybe read up on them.

Categories