Home>

I am studying javaFX.
I want to set the slider track color with the following slider program, but I don't know how to do it.
BorderPane root = new BorderPane ();
The background can be set with root.setStyle ("-fx-background-color: yellow") ;.
I found the code my-style.css on the net to set the color of the track, but
I wrote sliderR.getStylesheets (). Add ("my-style.css");in Main.java
It does n’t work. Please tell me what to do.
If there is a way to set directly in Main.java, please also.

// Main.java
package application;
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.canvas.Canvas;
import javafx.scene.canvas.GraphicsContext;
import javafx.scene.control.Label;
import javafx.scene.control.Menu;
import javafx.scene.control.MenuBar;
import javafx.scene.control.MenuItem;
import javafx.scene.control.Slider;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.VBox;
import javafx.scene.paint.Color;
import javafx.stage.Stage;
public class RGBColor extends Application {
    Slider sliderR = new Slider (0, 255, 128);
    Slider sliderG = new Slider (0, 255, 128);
    Slider sliderB = new Slider (0, 255, 128);
    Canvas canvas = new Canvas (600,80);
      @Override
      public void start (Stage stage) throws Exception {
          stage.setTitle ("RGBColor");
          stage.setWidth (400);
          stage.setHeight (280);
          MenuBar menuBar = new MenuBar ();
          menuBar.setUseSystemMenuBar (true);

          Menu fileMenu = new Menu ("File");
          MenuItem mnuExit = new MenuItem ("Exit");
          mnuExit.setOnAction (event->System.exit (0));
          fileMenu.getItems (). addAll (mnuExit);
          menuBar.getMenus (). add (fileMenu);
          // Red label and slider
          Label lblR = new Label ("Red:");
          lblR.setTextFill (Color.rgb (255, 0, 0));
          // Label label = new Label ("LABEL");
          // label.setFont (Font.font ("Verdana", FontWeight.BOLD, 32));
          // label.setTextAlignment (TextAlignment.CENTER);
          // label.setText ("NEW LABEL");
          sliderR.setMaxWidth (380);
          sliderR.getStylesheets (). add ("my-style.css");
          sliderR.setShowTickMarks (true);
          // If the value is false, there will be no separator.
          sliderR.setShowTickLabels (true);
          // If the value is false, there will be no numbers.
          sliderR.setMajorTickUnit (64.0);
          sliderR.setBlockIncrement (1.0);
          sliderR.setOnKeyPressed (event->updateColor ());
          sliderR.setOnMouseMoved (event->updateColor ());
          // Green label and slider
          Label lblG = new Label ("Green:");
          lblG.setTextFill (Color.rgb (0, 255, 0));
          sliderG.setMaxWidth (380);sliderG.setShowTickMarks (true);
          sliderG.setShowTickLabels (true);
          sliderG.setMajorTickUnit (64.0);
          sliderG.setBlockIncrement (1.0);
          sliderG.setOnKeyPressed (event->updateColor ());
          sliderG.setOnMouseMoved (event->updateColor ());
          // Blue label and slider
          Label lblB = new Label ("Blue:");
          lblB.setTextFill (Color.rgb (0, 0, 255));
          sliderB.setMaxWidth (380);
          sliderB.setShowTickMarks (true);
          sliderB.setShowTickLabels (true);
          sliderB.setMajorTickUnit (64.0);
          sliderB.setBlockIncrement (1.0);
          sliderB.setOnKeyPressed (event->updateColor ());
          sliderB.setOnMouseMoved (event->updateColor ());
          VBox panel = new VBox ();
          panel.getChildren (). addAll (lblR, sliderR, lblG, sliderG, lblB, sliderB);
          BorderPane root = new BorderPane ();
          root.setStyle ("-fx-background-color: yellow");
          root.setTop (menuBar);
          root.setCenter (panel);
          updateColor ();
          stage.setScene (new Scene (root));
          stage.show ();
      }
      void updateColor () {
          Color col = Color.rgb (
              (int) sliderR.getValue (),
              (int) sliderG.getValue (),
              (int) sliderB.getValue ());
          GraphicsContext gc = canvas.getGraphicsContext2D ();
          gc.setFill (col);
          gc.fillRect (0,0,660,80);
      }
      public static void main (String [] args) {
        launch (args);
    }
}
// my-style.css
 / * Styling the slider track * /
.jfx-slider>.track {
     -fx-background-color: yellow;
}
/ * Styling the slider thumb * /
.jfx-slider>.thumb {
     -fx-background-color: green;
}
/ * Styling the filled track * /
.jfx-slider>.colored-track {
     -fx-background-color: green;
}
/ * Styling the animated thumb * /
.jfx-slider>.animated-thumb {
     -fx-background-color: green;
}
/ * Styling the slider value text inside animated thumb * /
.jfx-slider .slider-value {
     -fx-fill: white;
     -fx-stroke: white;
}
  • Answer # 1

    Is Main.java and the style sheet in the same hierarchy (folder/directory)?

    If not, please describe the path as a relative path

    Absolute and relative paths that can't be heard now Win/Mac

    What is the difference between absolute path, relative path and root path? What are the advantages and disadvantages?


    Addition (20180902)

    Since JavaFX has never been touched, I cannot give a reliable answer.

    This is an article in 2016, but it is "brilliantly decorating JavaFX applications"
    Class and id
    • Can you set your own style class for your own Control?

    Is

    helpful?

    Although it is a post in 2015
    I think that the code in the question of JavaFX StyleSheet doesn't work (during Java learning) will be a hint for how to apply FXML/CSS (∵There is such a description and the code is concise)

    Since CSS doesn't look strange,

    the part of the applied part successfully (root.setStyle ("-fx-background-color: yellow");)
    // my-style.css
     / * Styling the slider track * /
    .jfx-slider>.track {
         -fx-background-color: yellow;
    }
    / * Styling the slider thumb * /
    .jfx-slider>.thumb {
         -fx-background-color: green;
    }
    / * Styling the filled track * /
    .jfx-slider>.colored-track {
         -fx-background-color: green;
    }
    / * Styling the animated thumb * /
    .jfx-slider>.animated-thumb {
         -fx-background-color: green;
    }
    / * Styling the slider value text inside animated thumb * /
    .jfx-slider .slider-value {
         -fx-fill: white;
         -fx-stroke: white;
    }


    How about rewriting one of the properties?
    (Example:root.setStyle ("-fx-background-color: green");)
    If that's okay, then it might be strange to write a selector (eg.jfx-slider>.animated-thumb), but from my knowledge, it's possible to construct elements and classes from JavaFX code. I can't say anything because I can't confirm the grant status of. (If it is a part that you wrote by thinking instead of copy and paste, you may understand something if you explain what kind of idea you wrote the selector based on. Let's read the explanation hard)