not working ccs style javafx -fx-strikethrough


Question

I want to make text strikethrough using CSS.

I use tag:

button.setStyle("-fx-strikethrough: true;");

But this code is working, please help.

1
1
11/10/2014 12:33:57 PM

Accepted Answer

You need to use a CSS stylesheet to enable strikethrough on a button. Using a CSS stylesheet is usually preferable to using an inline CSS setStyle command anyway.

/** file: strikethrough.css (place in same directory as Strikeout) */
.button .text {
    -fx-strikethrough: true;
}

The CSS style sheet uses a CSS selector to select the text inside the button and apply a strikethrough style to it. Currently (as of Java 8), setStyle commands cannot use CSS selectors, so you must use a CSS stylesheet to achieve this functionality (or use inline lookups, which would not be advisable) - the style sheet is the best solution anyway.

See @icza's answer to understand why trying to set the -fx-strikethrough style directly on the button does not work.

strikethrough

Here is a sample application:

import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;

public class Strikeout extends Application {

    @Override 
    public void start(Stage stage) throws Exception {
        Button strikethrough = new Button("Strikethrough");
        strikethrough.getStylesheets().addAll(getClass().getResource(
                "strikethrough.css"
        ).toExternalForm());

        StackPane layout = new StackPane(
                strikethrough
        );
        layout.setPadding(new Insets(10));
        stage.setScene(new Scene(layout));

        stage.show();
    }

    public static void main(String[] args) {
        launch(args);
    }
}
5
11/11/2014 12:17:48 AM

Button does not support the -fx-strikethrough CSS property, so setting this has no effect.

Here is the official JavaFX 8 CSS reference: JavaFX CSS Reference Guide

The -fx-strikethrough is defined for the Text node.

Button only supports the following: cancel, default, and all inherited from Labeled:

-fx-alignment, -fx-text-alignment, -fx-text-overrun, -fx-wrap-text, -fx-font, 
-fx-underline, -fx-graphic, -fx-content-display, -fx-graphic-text-gap,
-fx-label-padding, -fx-text-fill, -fx-ellipsis-string

And Labeled inherits these from Control: -fx-skin, -fx-focus-traversable.

So looking at the supported properties, the following works (of course it's not strikethrough):

button.setStyle("-fx-underline: true");

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