为什么当不相关的组件对齐时，JavaFX TextFlow不会换行BASELINE_LEFT？

Question

所以，这很奇怪。

我的FXML看起来像这样：

（RichText基本上只是扩展TextFlow并添加了一些便捷方法，因此可以认为它与TextFlow相同。）

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

<?import javafx.geometry.Insets?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.control.ButtonBar?>
<?import javafx.scene.control.ToggleButton?>
<?import javafx.scene.image.ImageView?>
<?import javafx.scene.layout.BorderPane?>
<?import javafx.scene.layout.FlowPane?>
<?import javafx.scene.layout.HBox?>
<?import javafx.scene.text.Text?>
<?import javafx.scene.text.Font?>
<?import javafx.scene.layout.Border?>

<?import org.trypticon.prototype.RichText?>

<HBox xmlns="http://javafx.com/javafx/8.0.121"
      xmlns:fx="http://javafx.com/fxml/1"
      fx:controller="org.trypticon.prototype.ListEntryCellController"
      spacing="12">
    <ImageView fx:id="accountIcon" fitWidth="48" fitHeight="48"/>
    <BorderPane HBox.hgrow="ALWAYS">
        <top>
            <HBox alignment="BASELINE_LEFT">
                <RichText fx:id="accountDisplayName" HBox.hgrow="ALWAYS">
                    <font>
                        <Font size="15"/>
                    </font>
                </RichText>
                <!-- todo ellipsis for account names but not time -->
                <Text fx:id="statusTime" opacity="0.5" textAlignment="RIGHT">
                    <font>
                        <Font size="15"/>
                    </font>
                </Text>
            </HBox>
        </top>
        <center>
            <RichText fx:id="content">
                <font>
                    <Font size="15"/>
                </font>
                <padding>
                    <Insets top="8" bottom="8"/>
                </padding>
            </RichText>
        </center>
        <bottom>
            <HBox> <!-- Makes buttons align to the left -->
                <ButtonBar>
                    <buttons>
                        <!-- TODO: Wait, what about localisation? -->
                        <Button fx:id="reply" text="Reply" style="-fx-background-color: transparent;"/>
                        <ToggleButton fx:id="reblog" text="Reblog" style="-fx-background-color: transparent;"/>
                        <ToggleButton fx:id="favourite" text="Favourite" style="-fx-background-color: transparent;"/>
                    </buttons>
                </ButtonBar>
            </HBox>
        </bottom>
    </BorderPane>
</HBox>

这在ListCell内呈现，使宽度约束到列表的宽度。但是当我渲染它时，<center>中的组件会将单元格向右打碎，这样我就看不到其他组件了：

奇怪的是，如果我从alignment="BASELINE_LEFT"组件中移除<top>，则<center>组件会突然正确包装。

首先，顶部组件甚至不应影响中心组件。但即使它确实如此，仅仅设置组件的对齐肯定不应该影响不相关组件的布局吗？

这里发生了什么，我该如何避免呢？

我做想要前两个文本区域的基线对齐，因为按基线布置文本很重要。我实际上不确定为什么JavaFX没有将它作为默认值。这是2017年，我认为我们现在已经学会了如何正确对齐组件，但显然JavaFX的开发人员还没有。

Answer 1

您需要为文本流和文本流中的其他对象设置最大宽度

还需要 setWrapText(true);到文本流内的每个视图