3

我得到了一个SegmentedButton包含 3 个“仅字形”的文件ToggleButtons,如下所示:

<SegmentedButton maxWidth="Infinity" prefWidth="Infinity">
    <buttons>
        <fx:define>
            <ToggleGroup fx:id="albumViewToggleGroup"/>
        </fx:define>
        <ToggleButton maxWidth="Infinity" fx:id="tagCloudToggle" mnemonicParsing="false" selected="true" toggleGroup="$albumViewToggleGroup">
            <graphic>
                <Glyph fontFamily="FontAwesome" icon="TAGS"></Glyph>
            </graphic>
        </ToggleButton>
        <ToggleButton maxWidth="Infinity" fx:id="gridFlowToggle" mnemonicParsing="false" toggleGroup="$albumViewToggleGroup" >
            <graphic>
                <Glyph fontFamily="FontAwesome" icon="TH"></Glyph>
            </graphic>
        </ToggleButton>
        <ToggleButton maxWidth="Infinity" fx:id="coverFlowToggle" mnemonicParsing="false" toggleGroup="$albumViewToggleGroup">
            <graphic>
                <Glyph fontFamily="FontAwesome" icon="ELLIPSIS_H"></Glyph>
            </graphic>
            <VBox.margin>
                <Insets top="10.0"/>
            </VBox.margin>
        </ToggleButton>
    </buttons>
</SegmentedButton>

SegmenedtButton 会占用整个宽度(由红线表示),但 ToggleButtons 不会。我通过设置背景颜色检查了这一点。

在此处输入图像描述

我希望 ToggleButtons 被拉伸,以便它们每个是 SegmentedButton 宽度的 1/3。我怎样才能做到这一点?

4

2 回答 2

3

根据文档,数学运算符可用于 fxml 绑定。

所以可以使用这样的东西:

<SegmentedButton fx:id="segButton" maxWidth="1.7976931348623157E308" >
    <buttons>
        <ToggleButton fx:id="option1" maxWidth="1.7976931348623157E308" prefWidth="${segButton.width / 4}" text="K3" />
        <ToggleButton fx:id="option1" maxWidth="1.7976931348623157E308" prefWidth="${segButton.width / 4}" text="K2" />
        <ToggleButton fx:id="option1" maxWidth="1.7976931348623157E308" prefWidth="${segButton.width / 4}" text="K1" />
        <ToggleButton fx:id="option1" maxWidth="1.7976931348623157E308" prefWidth="${segButton.width / 4}" text="K1,1" />
    </buttons>
</SegmentedButton>

可能不再需要,但希望对任何最终搜索此内容的人有用。

于 2016-12-23T08:23:52.887 回答
1

我怀疑你在这个问题上仍然需要帮助,但对于像我这样用谷歌搜索问题并来到这里的人来说,我是这样解决的:

button1.prefWidthProperty().bind(segmentedButtons.widthProperty().divide(2));
button2.prefWidthProperty().bind(segmentedButtons.widthProperty().divide(2));
segmentedButtons.getButtons().addAll(button1, button2);
segmentedButtons.setMaxWidth(Double.MAX_VALUE);

每个按钮占全宽度的 1/2

所以基本上,对于您添加到 SegmentedButton 的每个 ToggleButton,您将首选宽度绑定到 SegmentedButton 的实际宽度除以按钮数量。由于它是绑定的,宽度会在调整窗口大小时进行调整,因此您只需在创建时执行一次。如果你愿意,你可以用其他方式划分宽度,使一些按钮更大,一些更小。

于 2016-02-26T13:57:57.213 回答