首次点击后,JavaFX按钮会缩小和丢失装饰

时间:2018-03-27 10:06:53

标签: javafx fxml scenebuilder

一个奇怪的行为发生在我身上。我只是把Button作为HBox的孩子。当我第一次点击时,它缩小了它的大小并失去了它自己的装饰,好像它变成了一个普通的LabelButton会出现这种情况,并且继承它的那些行为(如Jfoenix的JFXButton也会受到影响)。我对下面的行为进行了动画处理:

javafx button loses decoration

Button下的Toolbar似乎在初始化时出现这种故障状态,如下所示:

javafx button glitches under toolbar

我正在使用的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 **/

我不知道影响甚至普通Button的是什么。造成这种故障的原因是什么?

提前致谢。

环境

  • Java 1.8.0 162
  • SceneBuilder 8.4.1
  • Windows 10

Maven Dependencies

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

1 个答案:

答案 0 :(得分:3)

由于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; */
}

它实际上按预期工作,因为当您点击它们时控件会聚焦。两个按钮可以使效果更清晰:

Two button focused rule effect