切换按钮具有两种状态：选择或未选择。
我们通常将两个或多个切换按钮组合成一个组，并允许用户只选择一个按钮或不选择。

创建切换按钮

我们可以使用ToggleButton类的三个构造函数创建一个切换按钮。要创建没有任何字幕或图标的切换按钮。

  1. ToggleButton tb = new ToggleButton();

要创建带有文字说明的切换按钮 

  1. ToggleButton tb = new ToggleButton("Press me");

要创建带有文字说明和图标的切换按钮。 

  1. Image image = new Image(g"icon.png");
  2. ToggleButton tb = new ToggleButton ("Press me", new ImageView(image));

setText()方法可以将文本设置为ToggleButton，以及setGraphic()方法可以将图像安装到ToggleButton。

切换按钮组

切换组不强制选择至少一个按钮。单击所选的切换按钮可取消选择切换按钮。

  1. import javafx.application.Application;
  2. import javafx.beans.value.ChangeListener;
  3. import javafx.beans.value.ObservableValue;
  4. import javafx.event.EventHandler;
  5. import javafx.geometry.Insets;
  6. import javafx.scene.Group;
  7. import javafx.scene.Scene;
  8. import javafx.scene.control.*;
  9. import javafx.scene.effect.DropShadow;
  10. import javafx.scene.image.Image;
  11. import javafx.scene.image.ImageView;
  12. import javafx.scene.input.MouseEvent;
  13. import javafx.scene.layout.HBox;
  14. import javafx.scene.layout.StackPane;
  15. import javafx.scene.layout.VBox;
  16. import javafx.stage.Stage;
  18. public class Main extends Application {
  20.     public static void main(String[] args) {
  21.         Application.launch(args);
  22.     }
  24.     @Override
  25.     public void start(Stage stage) {
  26.         Group root = new Group();
  27.         Scene scene = new Scene(root);
  28.         stage.setWidth(250);
  29.         stage.setHeight(150);
  31.         ToggleGroup group = new ToggleGroup();
  33.         ToggleButton tb1 = new ToggleButton("High");
  34.         tb1.setToggleGroup(group);
  35.         tb1.setSelected(true);
  37.         ToggleButton tb2 = new ToggleButton("Medium");
  38.         tb2.setToggleGroup(group);
  40.         ToggleButton tb3 = new ToggleButton("Low");
  41.         tb3.setToggleGroup(group);
  43.         HBox hbox = new HBox();
  44.         VBox vbox = new VBox();
  46.         vbox.getChildren().add(tb1);
  47.         vbox.getChildren().add(tb2);
  48.         vbox.getChildren().add(tb3);
  49.         vbox.setSpacing(10);
  51.         hbox.getChildren().add(vbox);
  52.         hbox.setSpacing(50);
  53.         hbox.setPadding(new Insets(20, 10, 10, 20));
  55.         root.getChildren().add(hbox);
  56.         stage.setScene(scene);
  57.         stage.show();
  58.     }
  59. }

image.png

ToggleButton行为

setUserData()方法将用户值与切换按钮相关联。ChangeListener对象检查组中选定的切换。如果没有选择任何开关按钮，则输出默认值。
如果选择其中一个切换按钮，getSelectedToggle和getUserData方法返回用户定义的值。

  3. import javafx.application.Application;
  4. import javafx.beans.value.ChangeListener;
  5. import javafx.beans.value.ObservableValue;
  6. import javafx.event.EventHandler;
  7. import javafx.geometry.Insets;
  8. import javafx.scene.Group;
  9. import javafx.scene.Scene;
  10. import javafx.scene.control.*;
  11. import javafx.scene.effect.DropShadow;
  12. import javafx.scene.image.Image;
  13. import javafx.scene.image.ImageView;
  14. import javafx.scene.input.MouseEvent;
  15. import javafx.scene.layout.HBox;
  16. import javafx.scene.layout.StackPane;
  17. import javafx.scene.layout.VBox;
  18. import javafx.stage.Stage;
  20. public class Main extends Application {
  22.     public static void main(String[] args) {
  23.         Application.launch(args);
  24.     }
  26.     @Override
  27.     public void start(Stage stage) {
  28.         Group root = new Group();
  29.         Scene scene = new Scene(root);
  30.         stage.setWidth(250);
  31.         stage.setHeight(150);
  33.         ToggleGroup group = new ToggleGroup();
  35.         ToggleButton tb1 = new ToggleButton("High");
  36.         tb1.setToggleGroup(group);
  37.         tb1.setSelected(true);
  39.         ToggleButton tb2 = new ToggleButton("Medium");
  40.         tb2.setToggleGroup(group);
  42.         ToggleButton tb3 = new ToggleButton("Low");
  43.         tb3.setToggleGroup(group);
  45.         tb1.setUserData("High");
  46.         tb2.setUserData("Medium");
  47.         tb3.setUserData("Low");
  49.         group.selectedToggleProperty().addListener(new ChangeListener<Toggle>() {
  50.             @Override
  51.             public void changed(ObservableValue<? extends Toggle> observable, Toggle oldValue, Toggle newValue) {
  52.                 if (newValue == null)
  53.                     System.out.println("default value");
  54.                 else
  55.                     System.out.println(group.getSelectedToggle().getUserData());
  56.             }
  57.         });
  59.         HBox hbox = new HBox();
  60.         VBox vbox = new VBox();
  62.         vbox.getChildren().add(tb1);
  63.         vbox.getChildren().add(tb2);
  64.         vbox.getChildren().add(tb3);
  65.         vbox.setSpacing(10);
  67.         hbox.getChildren().add(vbox);
  68.         hbox.setSpacing(50);
  69.         hbox.setPadding(new Insets(20, 10, 10, 20));
  71.         root.getChildren().add(hbox);
  72.         stage.setScene(scene);
  73.         stage.show();
  74.     }
  75. }

样式切换按钮

可以将CSS样式应用于切换按钮。
首先，在myStyle.css文件中声明切换按钮的样式。

  1. .toggle-button1{
  2.     -fx-font: 30 arial; 
  3.     -fx-base: green;   
  4. }
  6. .toggle-button2{
  7.     -fx-font: 25 arial; 
  8.     -fx-base: blue;  
  9. }
  11. .toggle-button3{
  12.     -fx-font: 30 arial; 
  13.     -fx-base: red;   
  14. }

其次，在应用程序中安装样式。 

  1. scene.getStylesheets().add("myStyle.css");
  3. tb1.getStyleClass().add("toggle-button1");
  4. tb2.getStyleClass().add("toggle-button2");
  5. tb3.getStyleClass().add("toggle-button3");