Intro

This page host samples of the Rich Text API in use along with the rendering result.
Visit Rich Text API Details for some background information on the API.

Sample 1 - Simple Hello World

@Override
public void start(Stage stage) throws Exception {
    String family = "Helvetica";
    double size = 20;

    TextFlow textFlow = new TextFlow();
    textFlow.setLayoutX(40);
    textFlow.setLayoutY(40);
    Text text1 = new Text("Hello ");
    text1.setFont(Font.font(family, size));
    Text text2 = new Text("Bold");
    text2.setFont(Font.font(family, FontWeight.BOLD, size));
    Text text3 = new Text(" World");
    text3.setFont(Font.font(family, FontPosture.ITALIC, size));
    textFlow.getChildren().addAll(text1, text2, text3);

    Group group = new Group(textFlow);
    Scene scene = new Scene(group, 500, 500, Color.WHITE);
    stage.setTitle("Hello Rich Text");
    stage.setScene(scene);
    stage.show();
}

Result:

Sample 2 - FXML + CSS

@Override
public void start(Stage stage) throws Exception {
    stage.setTitle("Hello Rich Text FXML");
    stage.setScene((Scene)FXMLLoader.load(getClass().getResource("hellorichtext.fxml")));
    stage.show();
}
<Scene width="500" height="500" fill="white" xmlns:fx="http://javafx.com/fxml">
    <stylesheets>
        <URL value="@style1.css"/>
    </stylesheets>

    <Group>
        <TextFlow styleClass="paragraph">
            <Text styleClass="span1">Hello </Text>
            <Text styleClass="span2">Bold</Text>
            <Text styleClass="span3"> World</Text>
        </TextFlow>
    </Group>
</Scene>
.paragraph {
	-fx-font-family: "Helvetica";
	-fx-font-size: 50px;
}

.span1 {
}

.span2 {
	-fx-fill: red;
	-fx-font-weight: bold;
}

.span3 {
	-fx-fill: green;
	-fx-font-style: italic;
}

Result:

Sample 3 - FXML + CSS + Gradient + Stroke + Effects

@Override
public void start(Stage stage) throws Exception {
    stage.setTitle("Hello Rich Text FXML");
    stage.setScene((Scene)FXMLLoader.load(getClass().getResource("fancy.fxml")));
    stage.show();
}
<Scene width="800" height="500" fill="white" xmlns:fx="http://javafx.com/fxml">
    <stylesheets>
        <URL value="@style2.css"/>
    </stylesheets>
    <Pane fx:id="pane">
         <TextFlow styleClass="paragraph" wrappingWidth="${pane.width}">
            <Text styleClass="span1, fancy1">Hello </Text>
            <Text styleClass="span2, big, fancy2">Bold</Text>
            <Text text=" "/>
            <Text styleClass="span3, fancy3">Effect</Text>
            <Text text=" "/>
            <Text styleClass="underlinefancy">fancy underline</Text>
            <Text text=" "/>
            <Text styleClass="strikeout, fancy2">fancy strikeout</Text>
        </TextFlow>
    </Pane>
</Scene>
.paragraph {
	-fx-font-family: "Helvetica";
	-fx-font-size: 50px;
}

.span1 {
}

.span2 {
	-fx-fill: red;
	-fx-font-weight: bold;
}

.span3 {
	-fx-fill: green;
	-fx-font-style: italic;
}

.big {
	-fx-font-size: 80px;
	-fx-cursor: hand;
}

.fancy1 {
	-fx-stroke: rgb(255, 0, 0);
	-fx-fill: rgba(255, 0, 0, 0.2);
}

.fancy2 {
	-fx-fill: linear-gradient(from 0% 0% to 100% 100%, repeat, orange 0%, red 50%);
	-fx-stroke: black;
	-fx-stroke-width: 1;
}

.fancy3 {
	-fx-effect: dropshadow(gaussian, gray, 8, 0.5, 8, 8);
}

.underlinefancy {
	-fx-underline: true;
	-fx-fill: transparent;
	-fx-stroke: linear-gradient(from 0% 0% to 100% 100%, repeat, black 0%, blue 50%);
	-fx-stroke-width: 1;
}

.strikeout {
	-fx-strikethrough: true;
}

Result:

Sample 4 - Embedded Objects

@Override
public void start(Stage stage) throws Exception {
    String family = "Helvetica";
    double size = 20;

    TextFlow textFlow = new TextFlow();
    textFlow.setLayoutX(0);
    textFlow.setLayoutY(100);
    Text text1 = new Text("Lets have ");
    text1.setFont(Font.font(family, size));
    Text text2 = new Text("embedded objects: ");
    text2.setFont(Font.font(family, FontWeight.BOLD, size));
    Rectangle rect = new Rectangle(80, 60);
    rect.setFill(null);
    rect.setStroke(Color.RED);
    Text text3 = new Text(" then button ");
    Button button = new Button("click me");
    Text text4 = new Text(" finally an image ");
    ImageView image = new ImageView("file:///Users/felipe/Documents/felipe/worker.png");
    Text text5 = new Text(".");
    text5.setFont(Font.font(family, size));

    textFlow.getChildren().addAll(text1, text2, rect, text3, button, text4, image, text5);

    Scene scene = new Scene(textFlow, 800, 500, Color.WHITE);
    textFlow.wrappingWidthProperty().bind(scene.widthProperty());

    stage.setTitle("Hello Rich Text with Embedded Objects");
    stage.setScene(scene);
    stage.show();
}

Result:

Sample 5 - Transforms

@Override
public void start(Stage stage) throws Exception {
    String family = "Helvetica";
    double size = 20;

    TextFlow textFlow = new TextFlow();
    textFlow.setTranslateX(30);
    textFlow.setTranslateY(100);
    textFlow.setRotate(45);
    Text text1 = new Text("Hello ");
    text1.setFont(Font.font(family, size));
    Text text2 = new Text("Bold");
    text2.setRotate(-45);
    text2.setFont(Font.font(family, FontWeight.BOLD, size));
    Text text3 = new Text(" World");
    text3.setFont(Font.font(family, FontPosture.ITALIC, size));
    textFlow.getChildren().addAll(text1, text2, text3);

    Group group = new Group(textFlow);
    Scene scene = new Scene(group, 500, 500, Color.WHITE);
    stage.setTitle("Hello Rich Text");
    stage.setScene(scene);
    stage.show();
}

Result:

Sample 6 - Bidi Text

@Override
public void start(Stage stage) throws Exception {
    TextFlow textFlow = new TextFlow();
    Font font = new Font("Tahoma", 48);
    textFlow.setTextOrigin(VPos.TOP);
    Text text1 = new Text("He said \u0627\u0644\u0633\u0644\u0627\u0645");
    text1.setFill(Color.RED);
    text1.setFont(font);
    Text text2 = new Text(" \u0639\u0644\u064a\u0643\u0645 to me.");
    text2.setFill(Color.BLUE);
    text2.setFont(font);
    textFlow.getChildren().addAll(text1, text2);

    Group group = new Group(textFlow);
    Scene scene = new Scene(group, 500, 500, Color.WHITE);
    stage.setTitle("Hello Rich Text");
    stage.setScene(scene);
    stage.show();
}

Result:

  • No labels