主页 / user-28097154

TheOrnithologist's questions

Martin Hope
TheOrnithologist
Asked: 2024-12-13 03:47:21 +0800 CST
  • 5

我正在努力培养我的编程技能，并使用 JavaFX 构建 UI 应用程序，因为 Java 是我最擅长的语言。

不幸的是，我发现使用 FXML 构建 UI 非常繁琐。我决定将窗口设置为固定大小，因为我认为第一次构建无响应 UI 会更容易。

添加元素很容易，但要让它们调整到合适的大小却非常困难，尤其是当布局嵌套时（例如，TiledPane 位于 HBox 中）。我想我误解了子元素如何从父元素继承属性，反之亦然。

在我的应用程序中，我经常嵌套，因为提供给视图的数据可能需要几秒钟才能加载，并且我不想给用户带来频繁的加载屏幕的负担。

例如，这是根据您按下的按钮显示数据的屏幕的 FXML。我的窗口是 1600x900。我希望第二个 HBox 中的元素填满屏幕的其余部分，但我似乎无法调整它们。我还想调整其他元素的大小，但我认为一旦我理解了我所缺少的任何原则，这将变得更容易。

<VBox fx:id="detachmentView" visible="false">
                <HBox alignment="CENTER">
                    <Button fx:id="detachmentRules" text="Rules" styleClass="medium_button" onAction="#detachmentRulesButton"/>
                    <Button fx:id="detachmentStratagems" text="Stratagems" styleClass="medium_button" onAction="#detachmentStratagemButton"/>
                    <Button fx:id="detachmentEnhancements" text="Enhancements" styleClass="medium_button" onAction="#detachmentEnhancementButton"/>
                </HBox>
                <Separator/>
                <HBox>
                    <HBox maxWidth="666">
                        <VBox>
                            <Label text="Detachment Name:" styleClass="detachment_header"/>
                            <ListView fx:id="detachmentList" onMouseClicked="#detachmentListSelect" styleClass="detachment_list" prefWidth="333"/>
                        </VBox>
                        <VBox fx:id="stratagemHeader" visible="false" managed="false">
                            <Label text="Stratagem Name:"  styleClass="detachment_header"/>
                            <ListView fx:id="stratagemList" onMouseClicked="#stratagemListSelect" styleClass="detachment_list" prefWidth="333"/>
                        </VBox>
                        <VBox fx:id="enhancementHeader" visible="false" managed="false">
                            <Label text="Enhancement Name:" styleClass="detachment_header"/>
                            <ListView fx:id="enhancementList" onMouseClicked="#enhancementListSelect" styleClass="detachment_list" prefWidth="333"/>
                        </VBox>
                    </HBox>
                    <StackPane>
                        <StackPane fx:id="detachmentRulesView">
                            <VBox>
                                <Label fx:id="detachmentLabel" styleClass="detachment_header_big"/>
                                <VBox fx:id="dynamicVBox"/>
                            </VBox>
                        </StackPane>
                        <StackPane fx:id="detachmentStratagemView" visible="false">
                            <BorderPane>
                                <center>
                                    <VBox>
                                        <Label fx:id="stratagemID" styleClass="detachment_header"/>
                                        <Label fx:id="stratagemType" styleClass="detachment_header"/>
                                        <Label fx:id="stratagemCost" styleClass="detachment_header"/>
                                        <Label fx:id="stratagemPhase" styleClass="detachment_header"/>
                                        <WebView fx:id="stratagemRules" style="-fx-pref-height: 250;"/>
                                        <TextArea fx:id="stratagemLegend" wrapText="true" editable="false"/>
                                    </VBox>
                                </center>
                            </BorderPane>
                        </StackPane>
                        <StackPane fx:id="enhancementView" visible="false">
                            <BorderPane>
                                <center>
                                    <VBox>
                                        <Label fx:id="enhancementName" styleClass="detachment_header"/>
                                        <Label fx:id="enhancementCost" styleClass="detachment_header"/>
                                        <WebView fx:id="enhancementRules" style="-fx-pref-height: 250;"/>
                                        <TextArea fx:id="enhancementLegend" wrapText="true" editable="false"/>
                                    </VBox>
                                </center>
                            </BorderPane>
                        </StackPane>
                    </StackPane>
                </HBox>
            </VBox>

它产生如下结果： FXML 元素大小调整

我已阅读 JavaFX 文档、多个专门介绍 JavaFX 的网站、本论坛和 ChatGPT。我尝试在许多不同的父元素和子元素上为相关元素添加各种修饰符，如 prefHeight、maxHeight、minHeight、VBox.vgrow，但均无济于事。我在其他地方使用过这些修饰符，但效果不错，因此我不确定我做错了什么。

这也完全可能是构建 UI 的一种糟糕方式，我需要重构。

javafx