JavaFX CSS
JavaFX - CSS

JavaFX - 滑塊

滑塊是一種 UI 控制元件，由一個軌道和一個滑塊組成，以及其他可選元素，如刻度線和刻度標籤。它允許使用者透過沿軌道拖動滑塊來從連續或離散的值範圍內選擇一個值。滑塊的常見應用可以在音訊或影片播放器、遊戲、亮度控制器等中看到。下圖顯示了兩個滑塊，一個是音量控制器，另一個是亮度控制器。

JavaFX 中的滑塊

在 JavaFX 中，滑塊由名為Slider的類表示。此類屬於包javafx.scene.control。透過例項化此類，我們可以在 JavaFX 中建立滑塊。Slider 類的建構函式如下所示：

Slider() - 這是預設建構函式。
Slider(double minVal, double maxVal, double currentVal) - 它建立一個新的滑塊，並指定初始值、最小值和最大值。

在 JavaFX 中建立滑塊的步驟

要在 JavaFX 中建立滑塊，請按照以下步驟操作。

步驟 1：例項化 Slider 類

在start()方法內例項化Slider類。此操作將在 JavaFX 應用程式中建立一個滑塊控制元件。

// creating a slider using default constructor
Slider slide = new Slider();

步驟 2：設定滑塊的最小值和最大值

每個滑塊都有最小值和最大值。要設定最小值，使用名為setMin()的內建方法，該方法接受一個雙精度值作為引數。類似地，使用setMax()方法設定最大值，該方法也需要雙精度值作為引數值。

// setting the minimum and maximum values
slide.setMin(0);
slide.setMax(100);

步驟 3：設定滑塊的方向

要設定滑塊的方向，我們使用名為setOrientation()的方法。它接受列舉值 VERTICAL 或 HORIZONTAL 作為引數。

// setting the orientation
slide.setOrientation(Orientation.VERTICAL);

步驟 4：滑塊的可選屬性

我們還可以設定滑塊的各種屬性，例如主刻度和次刻度的數量、刻度線和標籤。為此，請使用以下程式碼：

// major and minor tick marks
slide.setMajorTickUnit(10);
slide.setMinorTickCount(9);
slide.setShowTickMarks(true);
slide.setShowTickLabels(true);

步驟 5：啟動應用程式

建立並設定滑塊的屬性後，請按照以下步驟正確啟動應用程式：

首先，建立一個VBox來容納滑塊。
接下來，透過將 VBox 物件作為引數值傳遞給其建構函式以及應用程式螢幕的尺寸來例項化名為Scene的類。
然後，使用Stage類的setTitle()方法設定舞臺的標題。
現在，使用名為Stage的類的setScene()方法將 Scene 物件新增到舞臺。
使用名為show()的方法顯示場景的內容。
最後，使用launch()方法啟動應用程式。

示例

在以下示例中，我們將要在 JavaFX 應用程式中建立一個滑塊。將此程式碼儲存在名為SliderJavafx.java的檔案中。

import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.control.Slider;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;
import javafx.geometry.Orientation;
import javafx.geometry.Pos; 
public class SliderJavafx extends Application {
   @Override
   public void start(Stage stage) {
      // creating a slider using default constructor
      Slider slide = new Slider();
      // setting the minimum and maximum values
      slide.setMin(0);
      slide.setMax(100);
      // setting the orientation
      slide.setOrientation(Orientation.VERTICAL);
      // major and minor tick marks
      slide.setMajorTickUnit(10);
      slide.setMinorTickCount(9);
      slide.setShowTickMarks(true);
      slide.setShowTickLabels(true);
      // creating a label to display the slider value
      Label valueLabel = new Label("Value: " + slide.getValue());
      // creating a listener to update the label when the slider value changes
      slide.valueProperty().addListener((observable, oldValue, newValue) -> {
         valueLabel.setText("Value: " + newValue.intValue());
      });
      // creating a VBox to hold the slider and the label
      VBox root = new VBox();
      root.setAlignment(Pos.CENTER); 
      root.setPadding(new Insets(10));
      root.setSpacing(10);
      root.getChildren().addAll(slide, valueLabel);
      // create a scene and stage
      Scene scene = new Scene(root, 400, 300);
      stage.setTitle("Slider in JavaFX");
      stage.setScene(scene);
      stage.show();
   }
   public static void main(String[] args) {
      launch(args);
   }
}

要從命令提示符編譯並執行儲存的 Java 檔案，請使用以下命令：

javac --module-path %PATH_TO_FX% --add-modules javafx.controls SliderJavafx.java
java --module-path %PATH_TO_FX% --add-modules javafx.controls SliderJavafx

輸出

當我們執行上述程式碼時，它將生成以下輸出。

使用其引數化建構函式在 JavaFX 中建立滑塊

我們都知道，在 JavaFX 中建立滑塊有兩種方法：一種是使用 Slider 類的預設建構函式，另一種是使用其引數化建構函式。在下一個示例中，我們將使用 Slider 類的引數化建構函式在 JavaFX 中建立滑塊。將此程式碼儲存在名為JavafxSlider.java的檔案中。

示例

import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.control.Slider;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;
import javafx.geometry.Orientation;
import javafx.geometry.Pos;
public class JavafxSlider extends Application {
   @Override
   public void start(Stage stage) {
      // creating a Slider with a range of 0 to 100
      Slider slide = new Slider(0, 100, 50);
      // setting the orientation to horizontal
      slide.setOrientation(Orientation.HORIZONTAL);
      // setting the major tick unit to 10
      slide.setMajorTickUnit(10);
      // to show the tick marks and labels
      slide.setShowTickMarks(true);
      slide.setShowTickLabels(true);
      // Label to display the value of the Slider
      Label label = new Label("Value: " + slide.getValue());
      // listener to show the value of Slider
      slide.valueProperty().addListener((observable, oldValue, newValue) -> {
         // Update the Label with the new value
         label.setText("Value: " + newValue);
      });
      // creating a VBox 
      VBox root = new VBox(10);
      root.setAlignment(Pos.CENTER); 
      root.setPadding(new Insets(10));
      root.getChildren().addAll(slide, label);
      // creating a Scene and Stage
      Scene scene = new Scene(root, 400, 300);
      stage.setTitle("Slider in JavaFX");
      stage.setScene(scene);
      stage.show();
   }
   public static void main(String[] args) {
      launch(args);
   }
}

透過使用以下命令從命令提示符編譯並執行儲存的 Java 檔案：

javac --module-path %PATH_TO_FX% --add-modules javafx.controls JavafxSlider.java
java --module-path %PATH_TO_FX% --add-modules javafx.controls JavafxSlider

輸出

執行上述程式碼後，它將生成以下輸出。

列印頁面