更改Style-Class后,JavaFX Button未居中

时间:2017-07-13 07:28:27

标签: css javafx

在单击按钮之前,应用程序看起来像这样: Initial View

但是,当我单击其中一个按钮时,Button会通过更改其样式类来“突出显示”。然后这发生了: enter image description here 如您所见,该按钮不再居中。

创建按钮时,我设置这些值以确保它们的初始缩放:

b.setMaxWidth(Double.MAX_VALUE);
b.setPrefWidth(Control.USE_COMPUTED_SIZE);

并突出显示按钮:

public static void highlightButton(Button b){
    if(!(b.getParent() instanceof VBox)) return;

    VBox v = (VBox) b.getParent();

    ObservableList<Node> o = v.getChildren();
    Button tmp;
    for(Node n : o){
        if(n instanceof Button){
            tmp = (Button) n;
            tmp.getStyleClass().removeAll("selected-button");
            tmp.getStyleClass().add("button");
        }
    }

    b.getStyleClass().removeAll("button");
    b.getStyleClass().add("selected-button");
}

CSS格式:

.selected-button{
    -fx-padding: 5 22 5 22;

    -fx-border-color: transparent transparent transparent -fx-border;
    -fx-border-width: 2;

    -fx-background-color: transparent;

    -fx-font-family: "Segoe UI", Helvetica, Arial, sans-serif;
    -fx-font-size: 12pt;
    -fx-text-fill: -fx-base-2;
}

.button {
    -fx-padding: 5 22 5 22;

    -fx-border-color: -fx-border;
    -fx-border-width: 2;

    -fx-background-color: transparent;

    -fx-font-family: "Segoe UI", Helvetica, Arial, sans-serif;
    -fx-font-size: 12pt;
    -fx-text-fill: -fx-base-2;
}

感谢您提供任何帮助!

1 个答案:

答案 0 :(得分:1)

这适合我。

public static void highlightButton(final Button b) {
    if (!(b.getParent() instanceof VBox)) {
        return;
    }

    final VBox v = (VBox) b.getParent();

    final ObservableList<Node> o = v.getChildren();
    Button tmp;
    for (final Node n : o) {
        if (n instanceof Button) {
            tmp = (Button) n;
            tmp.pseudoClassStateChanged(PseudoClass.getPseudoClass("selected"), false);
        }
    }
    b.pseudoClassStateChanged(PseudoClass.getPseudoClass("selected"), true);
}

CSS格式:

.button {
-fx-padding: 5 22 5 22;
-fx-border-color: -fx-border;
-fx-border-width: 2;
-fx-background-color: transparent;
-fx-font-family: "Segoe UI", Helvetica, Arial, sans-serif;
-fx-font-size: 12pt;
-fx-text-fill: -fx-base-2k;
 }
.button:selected {
   -fx-border-color: transparent transparent transparent -fx-border;
 }