如何在 JavaFX 中创建 SplitPane?

javafxobject oriented programmingprogramming更新于 2025/4/13 19:52:17

SplitPane 是一个 UI 组件,它包含两个或多个侧面,中间有一个分隔符。此分隔符是可移动的;您可以使用它来减少/增加侧面的面积。您可以通过实例化 javafx.scene.control.SplitPane 类来创建拆分窗格。

SplitPane 的侧面可以水平或垂直排列。默认情况下,创建的 SpliPane 是水平的,您可以使用 setOrientation() 方法更改其方向。

示例

以下示例演示了如何创建 SplitPane

import java.io.FileInputStream;
import java.io.FileNotFoundException;
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.SplitPane;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.AnchorPane;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;
public class SplitPaneExample extends Application {
   public void start(Stage stage) throws FileNotFoundException {
      //创建 ImageView 对象 1
      Image img1 = new Image(new FileInputStream("D:\images\elephant.jpg"));
      ImageView view1 = new ImageView(img1);
      view1.setFitWidth(250);
      view1.setFitHeight(150);
      //创建 ImageView 对象 2
      Image img2 = new Image(new FileInputStream("D:\images\boy.jpg"));
      ImageView view2 = new ImageView(img2);
      view2.setFitWidth(250);
      view2.setFitHeight(150);
      //创建 SplitPane
      SplitPane splitPane = new SplitPane();
      //创建包含 ImageView 对象的堆栈窗格
      StackPane stackPane1 = new StackPane(view1);
      StackPane stackPane2 = new StackPane(view2);
      //将堆栈窗格添加到拆分窗格
      splitPane.getItems().addAll(stackPane1, stackPane2);
      //将锚窗格设置为布局
      AnchorPane pane = new AnchorPane();
      AnchorPane.setTopAnchor(splitPane, 15.0);
      AnchorPane.setRightAnchor(splitPane, 15.0);
      AnchorPane.setBottomAnchor(splitPane, 15.0);
      AnchorPane.setLeftAnchor(splitPane, 15.0);
      pane.getChildren().addAll(splitPane);
      pane.setStyle("-fx-background-color: BEIGE");
      //设置舞台
      Scene scene = new Scene(pane, 595, 300);
      stage.setTitle("Split Pane");
      stage.setScene(scene);
      stage.show();
   }
   public static void main(String args[]){
      launch(args);
   }
}

输出


相关文章