2 Replies Latest reply: Oct 25, 2012 7:58 AM by biochemistry43 RSS

    Radiobuttons and CSS

    biochemistry43
      Hi all!

      I'm looking for a way to make a radio button change the background color of the "radio" when active.

      I'm treating it to do with CSS but I can not get what I want.

      The following is the way in which I'm trying.
      .radio-button .radio:focused {
          -fx-background-color: red; 
      The radiobuttons'm doing in the Scene Builder

      You simply find other ways but I could not ... Someone help me?

      Thanks to all
        • 1. Re: Radiobuttons and CSS
          jsmith
          /* radio.css 
             place in same location as RadioCssTest.java and ensure build system copies it to your output directory
          */
          #red-dot .radio-button:selected .dot { 
            -fx-background-color: -fx-mark-highlight-color, red;
            -fx-background-insets: 0 0 -1 0, 0;  
          }
          
          #red-radio .radio-button:selected .radio { 
            -fx-color: red;
          }
          import javafx.application.Application;
          import javafx.scene.Scene;
          import javafx.scene.control.RadioButton;
          import javafx.scene.layout.VBox;
          import javafx.stage.Stage;
          
          public class RadioCssTest extends Application {
            public static void main(String[] args) { launch(args); }
            @Override public void start(Stage stage) throws Exception {
              VBox layout = new VBox(10);
              layout.setStyle("-fx-padding: 10; -fx-background-color: cornsilk;");
              
              RadioButton redRadio = new RadioButton("red-radio");
              redRadio.setId("red-radio");
              redRadio.setSelected(true);
              RadioButton redDot = new RadioButton("red-dot");
              redDot.setId("red-dot");
              redDot.setSelected(true);
              RadioButton normalRadio = new RadioButton("normal-radio");
              normalRadio.setSelected(true);
              
              layout.getChildren().addAll(redRadio, redDot, normalRadio);
                      
              Scene scene = new Scene(layout);
              scene.getStylesheets().add(getClass().getResource("radio.css").toExternalForm());
              stage.setScene(scene);
              stage.show();
            }
          }
          • 2. Re: Radiobuttons and CSS
            biochemistry43
            many thank you very much ... is all I needed