java - 使用 CSS 为 Javafx 设计样式

Question

我一直在使用 javafx，并开始设计表单的样式。我已经创建了一个程序，可以为您的文本创建弱加密，但还没有完全完成。

这是java代码-

public class encryption extends Application {

    private static StringBuffer password;
    private static int key;

    public void setValue(String value) {
        password = new StringBuffer(value);
    }

    public void encryption() {      
        RNG();

        for(int i = 0; i < password.length(); i++) {
            int cValue = (int)password.charAt(i);

            int nValue = cValue ^ key;

            password.setCharAt(i, (char)nValue);
        }   
        System.out.println(password);
        System.out.println("");
    }

    public void RNG() {
         Random rand = new Random();

            // nextInt is normally exclusive of the top value,
            // so add 1 to make it inclusive
            key = rand.nextInt(((222 - 8) + 1) + 8) ^ 26;

    }

    public void decryption() {
        for(int i = 0; i < password.length(); i++) {
            int nValue = key ^ password.charAt(i);

            password.setCharAt(i, (char)nValue);

        }
        System.out.println(password);
    }

    public void start(Stage arg0) throws Exception {

        StringBuffer eLabel = new StringBuffer();

        Scene scene;

        VBox container = new VBox();
        HBox root = new HBox();
        HBox rootA = new HBox();
        HBox rootB = new HBox();

        Label instructions;
        Button submit;
        Button reveal;
        PasswordField message;
        Label encryption;
        Label typed;

        instructions = new Label("Submit Label that you want to encrypt");  

        root.getChildren().add(instructions);

        message = new PasswordField();
        message.setOnKeyPressed(new EventHandler<KeyEvent>() {

            public void handle(KeyEvent e) {
                if(e.getCode() == KeyCode.ENTER) {
                    System.out.println(message.getText());
                    setValue(message.getText());
                    encryption();
                    decryption();
                }
            }

        });
        submit = new Button("Click to Submit");

        typed = new Label();
        typed.setId("value");

        rootA.getChildren().add(message);
        rootA.getChildren().add(submit);

        reveal = new Button("Show Text");
        reveal.setOnAction(new EventHandler<ActionEvent>() {

            public void handle(ActionEvent arg0) {
                typed.setText(message.getText());
            }

        });

        rootB.getChildren().add(reveal);
        rootB.getChildren().add(typed);

        container.getChildren().add(root);
        container.getChildren().add(rootA);
        container.getChildren().add(rootB);

        scene = new Scene(container, 1000, 500);

        String css = "encryption.css";
        scene.getStylesheets().add(css);

        Stage stage = new Stage();
        stage.setScene(scene);
        stage.setTitle("Javafx Encryption");

        stage.show();
    }


    public static void main(String[] args) {

        launch();
    }

}

这是 CSS -

.root {
    -fx-text-fill: rgb(49, 89, 23);
    -fx-background-color: #202020;
}

.button {
    -fx-background-color: red;
    -fx-text-fill: black;
}

.vbox {
    -fx-background-color: white;
    -fx-spacing: 10;
    -fx-height: 100%;
}

.hbox {
    -fx-background-color: #502576;
    -fx-spacing: 10;
}

#value {
    -fx-font-size: 12px;    
}

.label {
    -fx-font-size: 20px;
    -fx-text-fill: white;
}

hbox 没有与 vbox 一起获得应用的更改。

为什么 hbox 和 vbox 没有得到 css 的变化？

Answer 1

在大多数情况下，只有 Control 子类具有默认样式类。此外，场景的根获得样式类 root。

所以需要手动添加vbox和hbox样式类:

    VBox container = new VBox();
    container.getStyleClass().add("vbox");
    HBox root = new HBox();
    root.getStyleClass().add("hbox");
    HBox rootA = new HBox();
    rootA.getStyleClass().add("hbox");
    HBox rootB = new HBox();
    rootB.getStyleClass().add("hbox");