JavaFX: how to make a clickable text


Question

I'm looking for a simple way to make this. I can't find it anywhere and I've already tried the API.

So I have a sentence:

Don't have an account? Click here

I want to make the "here" word blue and clickable - into a button. How can achieve this? Do I just make an invisible button behind the position of the text?

1
9
1/7/2014 11:33:40 PM

Accepted Answer

Solution

Use a TextFlow (Java 8):

TextFlow flow = new TextFlow(
    new Text("Don't have an account? "), new Hyperlink("Click here")
);

Use a FlowPane (Java 7):

FlowPane flow = new FlowPane();
flow.getChildren().addAll(
    new Text("Don't have an account? "), new Hyperlink("Click here")
);

Sample

Here is a complete, executable example (Java 8):

clickme

import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.scene.*;
import javafx.scene.control.*;
import javafx.scene.text.*;
import javafx.stage.Modality;
import javafx.stage.*;

public class TextLink extends Application {

    @Override
    public void start(final Stage primaryStage) throws Exception {
        Stage     accountCreation = buildAccountCreationStage(primaryStage);
        Hyperlink createAccount   = buildCreateAccountLink(primaryStage, accountCreation);

        TextFlow flow = new TextFlow(
            new Text("Don't have an account? "), createAccount
        );
        flow.setPadding(new Insets(10));

        primaryStage.setScene(new Scene(new Group(flow)));
        primaryStage.show();
    }

    private Hyperlink buildCreateAccountLink(Stage primaryStage, Stage accountCreation) {
        Hyperlink createAccount = new Hyperlink("Click here");

        createAccount.setOnAction(event -> {
            accountCreation.setX(primaryStage.getX());
            accountCreation.setY(primaryStage.getY() + primaryStage.getHeight());
            accountCreation.show();
        });

        return createAccount;
    }

    private Stage buildAccountCreationStage(Stage primaryStage) {
        Stage accountCreation = new Stage(StageStyle.UTILITY);

        accountCreation.initModality(Modality.WINDOW_MODAL);
        accountCreation.initOwner(primaryStage);
        accountCreation.setTitle("Create Account");
        accountCreation.setScene(new Scene(new Label("<Account Creation Form Goes Here>"), 250, 50));

        return accountCreation;
    }

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

The default link highlight is kind of strange with the dashed border around it (if you wish you can style it with css to get something nicer and more similar to links on the web; i.e. just different colored text to indicate visited and unvisited links).

Aside

For you particular message, you should just make the "Don't have an account" text a hyperlink and get rid of the "Click here" text (as recommended by the w3c web standards body).

Related

25
1/18/2019 4:43:40 PM

Licensed under: CC-BY-SA with attribution
Not affiliated with: Stack Overflow
Icon