JFoenix 的标准对话框按钮样式

Question

我正在制作 javafx 应用程序并使用 Jfoenix 库。

Window 包含关于 table 中项目的特定信息，通过此代码打开：

@FXML
public void showEditPolicyDialog() {
    Policy selectedPolicy = policyTable.getSelectionModel().getSelectedItem();
    int selectedPolicyIndex = policyTable.getSelectionModel().getSelectedIndex();

    if (selectedPolicy == null) {
        Alert alert = new Alert(Alert.AlertType.INFORMATION);
        alert.setTitle("No Policy Selected");
        alert.setHeaderText(null);
        alert.setContentText("Please select Policy you want to edit.");
        alert.showAndWait();
        return;
    } else {
        selectedPolicy = Datasource.getInstance().getFullPolicyById(selectedPolicy.getId());
    }

    Dialog<ButtonType> dialog = new Dialog<>();

    dialog.initOwner(mainWindowAnchorPane.getScene().getWindow());
    dialog.setTitle("Edit policy " + selectedPolicy.getNumber());
    FXMLLoader fxmlLoader = new FXMLLoader();
    fxmlLoader.setLocation(getClass().getResource("/ee/insa/views/PolicyDialogLayout.fxml"));

    try {
        dialog.getDialogPane().setContent(fxmlLoader.load());

    } catch (IOException e) {
        System.out.println("Couldn't load edit policy dialog");
        e.printStackTrace();
        return;
    }

    dialog.getDialogPane().getButtonTypes().add(ButtonType.OK);
    dialog.getDialogPane().getButtonTypes().add(ButtonType.CANCEL);

    Button okButton = (Button) dialog.getDialogPane().lookupButton(ButtonType.OK);
    okButton.setDefaultButton(false);

    dialog.getDialogPane().getStylesheets().add("ee/insa/CSS/PolicyWindowCSS.css");

    PolicyController policyController = fxmlLoader.getController();
    Policy fullPolicy = Datasource.getInstance().getFullPolicyById(selectedPolicy.getId());
    policyController.loadPolicyDataToForm(fullPolicy);

    Optional<ButtonType> result = dialog.showAndWait();

    if (result.isPresent() && result.get() == ButtonType.OK) {
        policyController.updatePolicyData(fullPolicy);
        Datasource.getInstance().updatePolicy(fullPolicy);
        Policy updatedPolicyForMainTable = Datasource.getInstance().getPolicyForMainTableById(fullPolicy.getId());
        policyTable.getItems().set(selectedPolicyIndex, updatedPolicyForMainTable);
        policyTable.getSelectionModel().select(selectedPolicyIndex);
        if (inClientSearch == false) {
            checkTableView();
        }
    }
}

如何将对话框按钮样式设置为 JFoenix？现在按钮具有标准 Windows 样式。

在CSS中我可以找到按钮所在的区域（粉红色）：

.dialog-pane > .button-bar > .container {
    -fx-background-color: deeppink;
}

但我找不到确切的那 2 个按钮。如果我开始设计风格

.dialog-pane > .button {
     -fx-background-color: deeppink;
}

然后重新设计所有按钮的样式。

更新：我尝试通过以下代码实现 JFXDialog：

    @FXML
public void showEditPolicyDialog(){
    Policy selectedPolicy = policyTable.getSelectionModel().getSelectedItem();
    selectedPolicy = Datasource.getInstance().getFullPolicyById(selectedPolicy.getId());

    try {
        Parent parent = FXMLLoader.load(getClass().getResource("/ee/insa/views/PolicyDialogLayout.fxml"));
        JFXDialogLayout dialogLayout = new JFXDialogLayout();
        dialogLayout.setBody(parent);
        JFXDialog dialog = new JFXDialog( mainWindowStackPane, dialogLayout, JFXDialog.DialogTransition.BOTTOM);
        dialog.show();
    } catch (IOException e) {
        e.printStackTrace();
    }
}

但问题是它不是单独的 window，它仅显示在主要 window 的 space 中。

Answer 1

尝试使用 JFoenix JFXDialog 而不是默认的 JavaFX `Dialog:

JFXDialog<ButtonType> dialog = new JFXDialog<>();

Answer 2

我找到了解决方案。使用此代码

for(ButtonType bt : dialog.getDialogPane().getButtonTypes()){
        Button button = (Button) dialog.getDialogPane().lookupButton(bt);
        button.getStyleClass().add("dialogButton");
}

我只能将 CSS class 应用到那两个按钮。

.dialogButton {
-fx-background-color: -fx-primary;
-fx-text-fill: -fx-primatytext;
-fx-font-size: 12pt;
-fx-background-radius: 0;
-fx-border-width: 1px;
-fx-border-color: -fx-secondary;
}
.dialogButton:hover {
    -fx-background-color: -fx-secondary;
}

现在看起来不错。

JFoenix 的标准对话框按钮样式

Standart dialog button style to JFoenix

java

css

javafx

dialog

jfoenix