JavaFX 按钮在第一次单击后缩小并丢失装饰

Question

我发生了一个奇怪的行为。我只是简单地将 Button 作为 HBox 的子项。当我第一次点击时，它缩小了它的尺寸并失去了它自己的装饰，就好像它变成了一个普通的 Label。这种行为发生在 Button 和那些继承它的人身上（比如 Jfoenix 的 JFXButton 也受到影响）。我将行为动画化如下：

似乎还有Toolbar下的Button在初始化时出现了这个故障状态，如下所示：

我使用的 FXML 如下：

<AnchorPane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" styleClass="page" xmlns="http://javafx.com/javafx/8.0.141" xmlns:fx="http://javafx.com/fxml/1">
  <stylesheets>
     <URL value="@../stylesheets/base.css" />
     <URL value="@../stylesheets/jfoenix.table.css" />
     <URL value="@../stylesheets/main.tasks.css" />
  </stylesheets>
  <children>
     <VBox styleClass="section" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
        <children>
           <Pane styleClass="section-header">
              <children>
                 <Label text="Görevler" />
              </children>
           </Pane>
           <TableView prefHeight="200.0" prefWidth="200.0" styleClass="task-table">
              <columns>
                 <TableColumn prefWidth="75.0" text="C1" />
                 <TableColumn prefWidth="75.0" text="C2" />
              </columns>
           </TableView>
           <HBox prefHeight="100.0" prefWidth="200.0">
              <children>
                 <!-- This is the buggy button. -->
                 <Button mnemonicParsing="false" text="Button" />
              </children>
           </HBox>
        </children>
     </VBox>
  </children>

这些是影响此 FXML 文件的规则：

.section {
    -fx-min-width: 1000px;
    -fx-min-height: 200px;
    /*-fx-pref-width: 1000px;*/
    /*-fx-pref-height: 200px;*/

    -fx-background-color: #fff;
    -fx-effect: dropshadow(three-pass-box, #999, 10, 0.2, 0, 0);
    -fx-padding: 20px;
    -fx-spacing: 10px;
}

.section > .section-header {
    -fx-pref-height: 40px;
    -fx-max-height: 120px;
}

.section > .section-header > .label {
    -fx-font-size: 24px;
    -fx-text-fill: #666;
}

/** I've also used jfx-table-view.css of JFoenix library. **/
/** https://github.com/jfoenixadmin/JFoenix/wiki/Table-View **/

我不知道是什么影响了 even plain Button。是什么导致了这个故障？

提前致谢。

环境

Java 1.8.0 162
SceneBuilder 8.4.1
Windows 10

Maven 依赖项

org.kordamp.ikonli:ikonli-javafx:2.1.1
com.jfoenix:jfoenix:8.0.3
org.controlsfx:controlsfx:8.40.14

Answer 1

由于 jfoenix.table.css

中的这条规则，会产生这种效果

:focused {
    -fx-background-color: -fx-table-color, -fx-box-border, -fx-control-inner-background;
    -fx-background-insets: -1.4, 0, 1;
    -fx-background-radius: 1.4, 0, 0;
    /*....*/
    -fx-padding: 1; /* 0.083333em; */
}

它实际上按预期工作，因为当您单击控件时控件会获得焦点。两个按钮会让效果更清晰：

JavaFX 按钮在第一次单击后缩小并丢失装饰

JavaFX Button Shrinks and Loses Decoration After First Click

javafx

fxml

scenebuilder

环境

Maven 依赖项