Question

我遇到TooBar的问题，当其中一个包含的ToggleButtons获得/失去焦点或被检查/取消选中时 - 它们的视觉外观会稍微变大/变小几个像素，但工具栏会相应调整其宽度。

当我点击其他一些UI元素时 - ＆＃34;对象按钮＆＃34;损失焦点，变小，工具栏宽度减小。工具栏大小一直在变化，这让人很烦恼。此外，第二个按钮与第一个按钮不对齐。

这里可以做什么来保持所有按钮始终保持对齐，无论其当前状态如何并且工具栏宽度是否已固定？

垂直工具栏的代码是：

<HBox fx:id="leftPanelSwitchPanel">
        <ToolBar orientation="VERTICAL" style="-fx-base: #d1ffd3;">
            <Group>
                <ToggleButton fx:id="objectListPanelSwitch" rotate="-90.0" text="Objects">
                    <graphic>
                        <MaterialIconView glyphName="FORMAT_LIST_BULLETED" />
                    </graphic>
                </ToggleButton>
            </Group>
            <Group>
                <ToggleButton fx:id="objectPropertiesPanelSwitch" rotate="-90.0" text="Properties">
                    <graphic>
                        <MaterialIconView glyphName="SETTINGS_APPLICATIONS" />
                    </graphic>
                </ToggleButton>
            </Group>
        </ToolBar>
    </HBox>

Answer 1

您可以更改聚焦按钮/切换按钮css：

.button:focused {
  -fx-background-color: -fx-outer-border, -fx-inner-border, #d5e1f2;
  -fx-background-insets: 0, 1, 2;
  -fx-background-radius: 5, 4, 3;
} 
.toggle-button:focused {
  -fx-background-color: -fx-outer-border, -fx-inner-border, #d5e1f2;
  -fx-background-insets: 0, 1, 2;
  -fx-background-radius: 5, 4, 3;
}

详见：How to get rid of focus highlighting in JavaFX

JavaFX - 如何防止工具栏更改按钮状态更改的宽度

1 个答案: