Gluon AppBar保留在视图中

Question

我正在尝试使用顶部的App Bar构建一个消息窗口

此屏幕由顶部的Gluon App Bar和底部的VBox组成，其中剩余的元素显示在屏幕上。

问题是当我点击文本区域输入文本时，App Bar超出范围。

有没有办法让App Bar始终位于最佳状态？

Answer 1

如果您要在Android上部署应用，则TextField和TextArea控件会包含内置check：当这些输入控件聚焦时，如果需要，场景会向上移动防止软件键盘隐藏控件。

这些翻译影响整个场景，因此其中的所有节点（View，VBox，TextField，TextArea，AppBar，... ），也将被翻译。

因此，如果您希望AppBar节点始终可见且处于相同的顶部位置，则可能的修复方法可能会在发生任何情况时抵消该转换。

如果你有一个BasicView（Gluon IDE插件 - ＆gt;单一视图项目），在视图底部有一个TextField控件：

public BasicView() {

    Label label = new Label("Hello JavaFX World!");

    Button button = new Button("Change the World!");
    button.setGraphic(new Icon(MaterialDesignIcon.LANGUAGE));
    button.setOnAction(e -> label.setText("Hello JavaFX Universe!"));

    VBox controls = new VBox(15.0, label, button, new TextField());
    controls.setAlignment(Pos.BOTTOM_CENTER);
    controls.setPadding(new Insets(20));

    setCenter(controls);
}

你可以像这样修改它：

public BasicView() {

    ...

    setOnShown(e -> {
        MobileApplication.getInstance().getAppBar().translateYProperty()
                .bind(controls.getScene().getRoot().translateYProperty().multiply(-1));
    });
}

确保在添加此绑定时已将视图添加到场景中（以防止NPE）。

现在，当文本字段获得焦点时，整个场景将向上移动，并且appBar将向下移动相同的数量：