JavaFX - Dock效果模态框

时间:2021-03-29 17:02:35

效果

类似DOCK, 在主界面的右方弹出/收回,或者显示/隐藏
JavaFX - Dock效果模态框


思路

  • 新创建一个dock_stage
  • dock_stage的模态类型为NONE或者WINDOW_MODAL(否则会挡住主stage)
  • 在主stage的scene的x、y属性增加监听器
  • 监听器动作是更新dock_stage的X和Y坐标

不足

  • 移动主stage时,dock_stage有非常轻微的脱离感,或许有其他更好的方法?比如bind? 欢迎高手指点哈!


实现代码

// MainScene.fxml用于主舞台
// Dock_console.fxml用于子舞台

public class MainScene extends Application {

    private static Stage mainStage;
    private static Scene mainScene;
    private static Stage dockStage;

    private static DoubleProperty docker_X;
    private static DoubleProperty docker_Y;

    @Override
    public void start(Stage primaryStage) throws Exception {
        mainStage = primaryStage;
        final Parent root = FXMLLoader.load(getClass().getResource("MainScene.fxml"));
        mainScene = new Scene(root);
        mainStage.initStyle(StageStyle.DECORATED);
        mainStage.setScene(mainScene);
        mainStage.setTitle("NTT");
        mainStage.show();

        // 获取主stage的位置
        docker_X = new SimpleDoubleProperty( (mainScene.getWindow().getX() + 
        mainScene.getWidth())+2.0);
        docker_Y = new SimpleDoubleProperty(mainScene.getWindow().getY());
        // 绑定位置, DOCK跟随主stage
        mainScene.getWindow().xProperty().addListener(
        (ObservableValue<? extends Number> observable, 
        Number oldValue, Number newValue) -> {
            docker_X.set(docker_X.getValue() + newValue.doubleValue() - 
            oldValue.doubleValue());
            dockStage.setX(docker_X.getValue());
        });
        mainScene.getWindow().yProperty().addListener(
        (ObservableValue<? extends Number> observable, 
        Number oldValue, Number newValue) -> {
            docker_Y.set(docker_Y.getValue() + newValue.doubleValue() - 
            oldValue.doubleValue());
            dockStage.setY(docker_Y.getValue());
        });
    }

    @FXML
    void showOrClose() {

        if (dockStage != null && dockStage.isShowing()) {
            dockStage.close();
            return;
        }

        Parent root = null;
        try {
            root = FXMLLoader.load(getClass().getResource("Dock_console.fxml"));
            final Scene scene = new Scene(root);
            dockStage = new Stage();
            dockStage.initStyle(StageStyle.DECORATED);
            dockStage.initModality(Modality.NONE);  // 重要!

            dockStage.setX(docker_X.getValue());
            dockStage.setY(docker_Y.getValue());
            dockStage.setScene(scene);
            dockStage.setTitle("console");
            dockStage.show();

        } catch (IOException e) {
            e.printStackTrace();
        }
    }
}

友情提示 : 转摘请注明出处 , 谢谢!