JavaFX - pagination:如何隐藏底部(控制)面板并用页面占据它的区域？

Question

在某些情况下，我需要完全隐藏分页控件中的页面更改按钮，但隐藏区域可能已被页面占用，即向下扩展。

在这个带有分页的窗口示例中，我想隐藏灰色区域并将天空色区域扩大到隐藏区域。

我该怎么做？

我试过这个:

package javafxpagination;

import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.scene.Node;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.Label;
import javafx.scene.control.Pagination;
import javafx.scene.layout.HBox;
import javafx.scene.layout.Pane;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;

public class TestPagination extends Application {
  public static void main(String[] args) {
    launch(args);
  }

  @Override
  public void start(Stage primaryStage) {
    primaryStage.setTitle("Test pagination");

    Pagination pagination = new Pagination();
    pagination.setPageCount(4);
    pagination.setMaxPageIndicatorCount(4);
    pagination.setCurrentPageIndex(0);

    pagination.setPageFactory((pageIndex) -> {

      Pane pagePane = new Pane();
      pagePane.setPrefWidth(600);
      pagePane.setPrefHeight(400);
      pagePane.setStyle("-fx-background-color: #DDF1F8;"); //sky color
      Button button = new Button("Hide/show page buttons");
      button.setOnAction(new EventHandler<ActionEvent>()
      {
        @Override
        public void handle(ActionEvent event)
        {
          HBox paginationHBox = (HBox)pagination.lookup(".control-box");
          Node paginationControl = pagination.lookup(".pagination-control");
          paginationControl.setStyle("-fx-background-color: gray;");
          paginationControl.setVisible(!paginationControl.isVisible()); //switch visibility
          paginationControl.setManaged(paginationControl.isVisible());
          paginationControl.minHeight(0.0);
          paginationControl.prefHeight(0.0);
          paginationControl.maxHeight(0.0);
        }
      });
      pagePane.getChildren().add(button);
      return pagePane;
    });

    VBox vBox = new VBox(pagination);
    Scene scene = new Scene(vBox, 800, 600);
    primaryStage.setScene(scene);
    primaryStage.show();
  }
}

但它没有隐藏灰色区域，也没有拉伸天空颜色的页面区域。

Answer 1

使用VBox布局管理器的解决方案

通过将此行添加到您的应用程序，分页控件将扩展以填充可用空间：

VBox.setVgrow(pagination, Priority.ALWAYS);

这回答了您问题的“如何占用”部分：“JavaFX - 分页：如何隐藏底部（控制）面板并用页面占据其区域？

对于隐藏，您已经在完成此操作，这是基于以下信息：

• JavaFX-setViable隐藏元素但不会重新排列相邻节点

随着查找的添加，

Node paginationControl = pagination.lookup(".pagination-control")

你已经在做了，加上这几行:

paginationControl.setVisible(!paginationControl.isVisible());
paginationControl.setManaged(paginationControl.isVisible());

不需要将分页控件的minHeight、prefHeight和maxHeight设置为0的行，我不建议保留它们。

布局管理器的背景

布局由布局管理器管理。这些布局管理器有一些默认行为，但有时需要配置它们或给它们提示以实现所需的布局行为。

您在VBox中拥有分页控件。如果您查看VBox留档，它会说：

如果 vbox 的大小大于其首选高度，则默认情况下，它将保留子级到其首选高度，而不使用额外的空间。如果应用程序希望为一个或多个子级分配该额外空间，则可以选择对子项设置 vgrow 约束。

因此，您正在使用的默认行为不是扩展托管内容以填充额外的可用空间（这就是您看到的）。

替代解决方案 - 替换分页控件

另一种实现是，在隐藏时，用要显示的面板替换分页控件，而不是隐藏分页控件。

例如，从父布局容器(vbox)中移除分页控件，并在其位置添加要直接显示到父布局容器中的面板。

要再次显示分页，您将执行相反的操作。

这可能是我更喜欢这种工作的解决方案。

对于这样的解决方案，您需要注意节点在任何时候都只能是单亲的子节点，并在您的实现中考虑到这一点。此外，之前关于布局管理器和在节点上设置V增长约束的信息仍然适用于此解决方案。