如何手动设置 TitlePane 高度或使其适应其内容

【问题标题】：How to manually set TitlePane height or make it adapt to its content如何手动设置 TitlePane 高度或使其适应其内容
【发布时间】：2021-08-04 19:09:29
【问题描述】：

我想要这样的布局：

多个标题窗格，每个窗格都有不同的内容。

问题是，默认情况下，titledPane 中的所有元素都不是可见的（ScreenShot1，带有 ChoiceBox、Label 和 Spinner 的 HBox 不可见），如果我尝试为 TitledPane 指定 prefHeight（即docs 不推荐）关闭标题窗格时会保留一个空格（ScreenShot2）。

如何使标题窗格适应其内容或指定preferredHeight 而不会在关闭时创建空格？

代码如下：

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.geometry.Insets?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.control.ChoiceBox?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.control.ScrollPane?>
<?import javafx.scene.control.Spinner?>
<?import javafx.scene.control.SplitPane?>
<?import javafx.scene.control.TableColumn?>
<?import javafx.scene.control.TableView?>
<?import javafx.scene.control.TitledPane?>
<?import javafx.scene.layout.AnchorPane?>
<?import javafx.scene.layout.HBox?>
<?import javafx.scene.layout.StackPane?>
<?import javafx.scene.layout.VBox?>
<?import javafx.scene.text.Font?>

<StackPane prefHeight="989.0" prefWidth="1240.0" xmlns="http://javafx.com/javafx/16" xmlns:fx="http://javafx.com/fxml/1">
   <children>
      <AnchorPane StackPane.alignment="TOP_LEFT">
         <children>
            <SplitPane dividerPositions="0.55" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
              <items>
                <AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="160.0" prefWidth="100.0">
                     <children>
                        <ScrollPane fitToWidth="true" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
                           <content>
                              <VBox>
                                 <children>
                                  <TitledPane alignment="TOP_LEFT" contentDisplay="TOP" nodeOrientation="LEFT_TO_RIGHT" text="TITLED PANE 1">
                                       <content>
                                          <AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="180.0" prefWidth="200.0">
                                             <children>
                                                <VBox prefHeight="200.0" prefWidth="100.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0">
                                                   <children>
                                                      <TableView minHeight="200.0" prefHeight="171.0" prefWidth="297.0">
                                                         <columns>
                                                            <TableColumn prefWidth="87.0" text="C1" />
                                                            <TableColumn minWidth="0.0" prefWidth="63.0" text="C2" />
                                                         </columns>
                                                      </TableView>
                                                      <HBox prefHeight="100.0" prefWidth="200.0">
                                                         <children>
                                                            <ChoiceBox prefWidth="150.0" />
                                                            <Label text="some label" />
                                                            <Spinner />
                                                         </children>
                                                      </HBox>
                                                   </children>
                                                </VBox>
                                             </children>
                                          </AnchorPane>
                                       </content>
                                  </TitledPane>
                                  <TitledPane alignment="TOP_LEFT" contentDisplay="TOP" nodeOrientation="LEFT_TO_RIGHT" text="TITLED PANE 2">
                                       <content>
                                          <AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="180.0" prefWidth="200.0">
                                             <children>
                                                <TableView layoutX="14.0" layoutY="14.0" prefHeight="171.0" prefWidth="297.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0">
                                                   <columns>
                                                      <TableColumn prefWidth="87.0" text="C1" />
                                                      <TableColumn minWidth="0.0" prefWidth="63.0" text="C2" />
                                                   </columns>
                                                </TableView>
                                             </children>
                                          </AnchorPane>
                                       </content>
                                  </TitledPane>
                                  <TitledPane alignment="TOP_LEFT" contentDisplay="TOP" nodeOrientation="LEFT_TO_RIGHT" text="TITLED PANE 3">
                                       <content>
                                          <AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="180.0" prefWidth="200.0">
                                             <children>
                                                <TableView layoutX="14.0" layoutY="14.0" prefHeight="171.0" prefWidth="297.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0">
                                                   <columns>
                                                      <TableColumn prefWidth="87.0" text="C1" />
                                                      <TableColumn minWidth="0.0" prefWidth="63.0" text="C2" />
                                                   </columns>
                                                </TableView>
                                             </children>
                                          </AnchorPane>
                                       </content>
                                  </TitledPane>
                                    <TitledPane alignment="TOP_LEFT" contentDisplay="TOP" nodeOrientation="LEFT_TO_RIGHT" text="TITLED PANE 4">
                                       <content>
                                          <AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="180.0" prefWidth="480.0">
                                             <children>
                                                <TableView layoutX="14.0" layoutY="14.0" prefHeight="171.0" prefWidth="297.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0">
                                                   <columns>
                                                      <TableColumn prefWidth="87.0" text="C1" />
                                                      <TableColumn minWidth="0.0" prefWidth="63.0" text="C2" />
                                                   </columns>
                                                </TableView>
                                             </children>
                                          </AnchorPane>
                                       </content>
                                    </TitledPane>
                                 </children>
                              </VBox>
                           </content>
                        </ScrollPane>
                     </children>
                  </AnchorPane>
                <AnchorPane minHeight="0.0" minWidth="0.0" />
              </items>
            </SplitPane>
         </children>
         <padding>
            <Insets bottom="80.0" />
         </padding>
      </AnchorPane>
      <VBox alignment="CENTER" maxHeight="80.0" style="-fx-background-color: grey;" StackPane.alignment="BOTTOM_CENTER">
         <children>
            <Button mnemonicParsing="false" text="FIXED BUTTON">
               <font>
                  <Font size="24.0" />
               </font>
            </Button>
         </children>
      </VBox>
   </children>
</StackPane>

【问题讨论】：

  • 我的猜测是在TableView 上设置了最高高度。

标签： user-interface javafx layout scenebuilder


【解决方案1】：

我认为你只需要将VBox 作为第一个TitledPane 的内容节点。在 Scene Buider 中右键单击 AnchorPane 并选择 “Unwrap”。 FXML 的部分应该如下所示：

<TitledPane alignment="TOP_LEFT" contentDisplay="TOP" nodeOrientation="LEFT_TO_RIGHT" text="TITLED PANE 1">
    <content>
          <VBox prefHeight="200.0" prefWidth="100.0"> <!-- VBox direct content node instead of AnchorPane -->
              <children>
                  <TableView minHeight="200.0" prefHeight="171.0" prefWidth="297.0">
                      <columns>
                          <TableColumn prefWidth="87.0" text="C1" />
                          <TableColumn minWidth="0.0" prefWidth="63.0" text="C2" />
                      </columns>
                  </TableView>
                  <HBox prefHeight="100.0" prefWidth="200.0">
                      <children>
                          <ChoiceBox prefWidth="150.0" />
                          <Label text="some label" />
                          <Spinner />
                      </children>
                  </HBox>
              </children>
          </VBox>
    </content>
</TitledPane>

【讨论】：

  • 没想到这么简单。谢谢！
【解决方案2】：

我将所有东西都设置为USE_COMPUTER_SIZE，然后将TableViews max-width 设置为MAX_VALUE，将 max-height 设置为 200。我希望这对你有用！


<?import javafx.geometry.Insets?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.control.ChoiceBox?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.control.ScrollPane?>
<?import javafx.scene.control.Spinner?>
<?import javafx.scene.control.SplitPane?>
<?import javafx.scene.control.TableColumn?>
<?import javafx.scene.control.TableView?>
<?import javafx.scene.control.TitledPane?>
<?import javafx.scene.layout.AnchorPane?>
<?import javafx.scene.layout.HBox?>
<?import javafx.scene.layout.StackPane?>
<?import javafx.scene.layout.VBox?>
<?import javafx.scene.text.Font?>

<StackPane prefHeight="989.0" prefWidth="1240.0" xmlns="http://javafx.com/javafx/15.0.1" xmlns:fx="http://javafx.com/fxml/1">
   <children>
      <AnchorPane StackPane.alignment="TOP_LEFT">
         <children>
            <SplitPane dividerPositions="0.55" minWidth="-Infinity" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
              <items>
                <AnchorPane>
                     <children>
                        <ScrollPane fitToWidth="true" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
                           <content>
                              <VBox>
                                 <children>
                                  <TitledPane alignment="TOP_LEFT" contentDisplay="TOP" nodeOrientation="LEFT_TO_RIGHT" text="TITLED PANE 1">
                                       <content>
                                          <AnchorPane>
                                             <children>
                                                <VBox alignment="CENTER" spacing="2.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0">
                                                   <children>
                                                      <TableView maxHeight="200.0" maxWidth="1.7976931348623157E308">
                                                         <columns>
                                                            <TableColumn maxWidth="1.7976931348623157E308" prefWidth="87.0" text="C1" />
                                                            <TableColumn maxWidth="1.7976931348623157E308" minWidth="0.0" prefWidth="63.0" text="C2" />
                                                         </columns>
                                                      </TableView>
                                                      <HBox alignment="CENTER_LEFT" spacing="2.0">
                                                         <children>
                                                            <ChoiceBox prefWidth="150.0" />
                                                            <Label text="some label" />
                                                            <Spinner />
                                                         </children>
                                                         <VBox.margin>
                                                            <Insets />
                                                         </VBox.margin>
                                                      </HBox>
                                                   </children>
                                                </VBox>
                                             </children>
                                          </AnchorPane>
                                       </content>
                                  </TitledPane>
                                  <TitledPane alignment="TOP_LEFT" contentDisplay="TOP" nodeOrientation="LEFT_TO_RIGHT" text="TITLED PANE 2">
                                       <content>
                                          <AnchorPane>
                                             <children>
                                                <TableView layoutX="14.0" layoutY="14.0" maxHeight="200.0" maxWidth="1.7976931348623157E308" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0">
                                                   <columns>
                                                      <TableColumn prefWidth="87.0" text="C1" />
                                                      <TableColumn minWidth="0.0" prefWidth="63.0" text="C2" />
                                                   </columns>
                                                </TableView>
                                             </children>
                                          </AnchorPane>
                                       </content>
                                  </TitledPane>
                                  <TitledPane alignment="TOP_LEFT" contentDisplay="TOP" nodeOrientation="LEFT_TO_RIGHT" text="TITLED PANE 3">
                                       <content>
                                          <AnchorPane>
                                             <children>
                                                <TableView layoutX="14.0" layoutY="14.0" maxHeight="200.0" maxWidth="1.7976931348623157E308" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0">
                                                   <columns>
                                                      <TableColumn prefWidth="87.0" text="C1" />
                                                      <TableColumn minWidth="0.0" prefWidth="63.0" text="C2" />
                                                   </columns>
                                                </TableView>
                                             </children>
                                          </AnchorPane>
                                       </content>
                                  </TitledPane>
                                    <TitledPane alignment="TOP_LEFT" contentDisplay="TOP" nodeOrientation="LEFT_TO_RIGHT" text="TITLED PANE 4">
                                       <content>
                                          <AnchorPane>
                                             <children>
                                                <TableView layoutX="14.0" layoutY="14.0" maxHeight="200.0" maxWidth="1.7976931348623157E308" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0">
                                                   <columns>
                                                      <TableColumn prefWidth="87.0" text="C1" />
                                                      <TableColumn minWidth="0.0" prefWidth="63.0" text="C2" />
                                                   </columns>
                                                </TableView>
                                             </children>
                                          </AnchorPane>
                                       </content>
                                    </TitledPane>
                                 </children>
                              </VBox>
                           </content>
                        </ScrollPane>
                     </children>
                  </AnchorPane>
                <AnchorPane />
              </items>
            </SplitPane>
         </children>
         <padding>
            <Insets bottom="80.0" />
         </padding>
      </AnchorPane>
      <VBox alignment="CENTER" maxHeight="80.0" style="-fx-background-color: grey;" StackPane.alignment="BOTTOM_CENTER">
         <children>
            <Button mnemonicParsing="false" text="FIXED BUTTON">
               <font>
                  <Font size="24.0" />
               </font>
            </Button>
         </children>
      </VBox>
   </children>
</StackPane>

【讨论】：

  • 谢谢！它有效，但 Anko 的回答更简洁，因为我只需要删除一个节点。
猜你喜欢
  • 2014-09-12
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2014-09-04
  • 1970-01-01
  • 2016-06-13
  • 2022-01-23
  • 2011-06-11
相关资源
最近更新 更多
热门标签
Java Python linux javascript Mysql C# Docker 算法 前端 SpringBoot Redis Vue spring 设计模式 .net core .net kubernetes c++ 数据库 数据结构 大数据 js 机器学习 微服务 Android Go 程序员 面试 JVM ASP.net core 云原生 人工智能 后端 PHP git CSS golang k8s Nginx Django mybatis 深度学习 多线程 React 架构 devops 爬虫 云计算 Spring Boot LeetCode