How to adjust row spacing

[yanzhao77]

No description provided.

[Jugen]

You can specify line spacing with CSS like so:

.paragraph-text {
    -fx-line-spacing: 15;
}

[yanzhao77]

I tried to do that, but it didn't seem to work. Did I set it up wrong

~~o(>_<)o ~~
this is my code

package test;

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.layout.AnchorPane;
import javafx.stage.Stage;
import org.fxmisc.flowless.VirtualizedScrollPane;
import org.fxmisc.richtext.InlineCssTextArea;

public class consoleText1 extends Application {
    @Override
    public void start(Stage primaryStage) throws Exception {
        AnchorPane anchorPane = new AnchorPane();
        InlineCssTextArea textArea = new InlineCssTextArea();
        VirtualizedScrollPane virtualizedScrollPane=new VirtualizedScrollPane(textArea);
        anchorPane.setTopAnchor(virtualizedScrollPane, 0.0);
        anchorPane.setBottomAnchor(virtualizedScrollPane, 0.0);
        anchorPane.setLeftAnchor(virtualizedScrollPane, 0.0);
        anchorPane.setRightAnchor(virtualizedScrollPane, 0.0);

        textArea.setStyle(" -fx-line-spacing: 15");

        anchorPane.getChildren().add(virtualizedScrollPane);
        Scene scene = new Scene(anchorPane, 500, 600);
        primaryStage.setScene(scene);
        primaryStage.setTitle("test");
        primaryStage.show();
    }

    public static void main(String[] args) {
        launch(args);
    }
}

[Jugen]

Unfortunately it doesn't work with setStyle, it has to be added through a stylesheet like:

scene.getStylesheets().add( "path-to/my-style-sheet.css" );

[yanzhao77]

wo,It's a bit awkward, or it's a failure. No matter how I adjust, the spacing between each line is still so large

package test;

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.layout.AnchorPane;
import javafx.stage.Stage;
import org.fxmisc.flowless.VirtualizedScrollPane;
import org.fxmisc.richtext.InlineCssTextArea;

public class consoleText1 extends Application {
    @Override
    public void start(Stage primaryStage) throws Exception {
        AnchorPane anchorPane = new AnchorPane();
        InlineCssTextArea textArea = new InlineCssTextArea();
        VirtualizedScrollPane virtualizedScrollPane=new VirtualizedScrollPane(textArea);
        anchorPane.setTopAnchor(virtualizedScrollPane, 0.0);
        anchorPane.setBottomAnchor(virtualizedScrollPane, 0.0);
        anchorPane.setLeftAnchor(virtualizedScrollPane, 0.0);
        anchorPane.setRightAnchor(virtualizedScrollPane, 0.0);

//        textArea.setStyle(" -fx-line-spacing: 15");

        anchorPane.getChildren().add(virtualizedScrollPane);
        Scene scene = new Scene(anchorPane, 500, 600);
        scene.getStylesheets().add( "path-to/my-style-sheet.css" );
        primaryStage.setScene(scene);
        primaryStage.setTitle("test");
        primaryStage.show();
    }

    public static void main(String[] args) {
        launch(args);
    }
}

my-style-sheet.css

.paragraph-text {
    -fx-line-spacing: 100;
}

[Jugen]

It only applies to lines inside a paragraph that wraps over multiple lines and not between paragraphs that only have one line. In RichTextFX a paragraph is any text that ends with enter / new line.

In the image you provided it looks like each line ends with enter without wrapping and so no line-spacing is seen.

I suppose this is an oversight since if you have for example a numbered or bulleted list of single lines then one would expect the list to have the same spacing as a multi-lined wrapped paragraph. I'll have a look and see if I can change it.

[Jugen]

You can also try the following CSS to achieve what you want:

.paragraph-box {
    -fx-padding: 0 0 15 0;
}