Embellissez votre interface utilisateur avec les nouvelles feuilles de style CSS JavaFX dans Java 13

Utilisez la nouvelle feuille de style CSS JavaFX dans Java 13 pour embellir l'interface utilisateur

Introduction :
Dans le développement de logiciels, la beauté et la facilité d'utilisation de l'interface utilisateur sont cruciales pour améliorer l'expérience utilisateur. JavaFX est une technologie d'interface moderne et expressive sur la plate-forme Java qui fournit des composants et des fonctions d'interface utilisateur riches. Afin de rendre l'interface utilisateur plus belle, JavaFX fournit des feuilles de style CSS pour embellir et personnaliser l'interface. Dans Java 13, JavaFX introduit une nouvelle feuille de style CSS pour rendre le style d'interface plus flexible, plus facile à maintenir et à développer. Cet article expliquera comment utiliser la nouvelle feuille de style CSS JavaFX dans Java 13 pour embellir l'interface utilisateur et fournira des exemples de code correspondants.

1. Définir la feuille de style CSS :
Dans JavaFX, vous pouvez embellir l'interface utilisateur en définissant la feuille de style CSS. Dans Java 13, une nouvelle syntaxe de feuille de style CSS est disponible avec des fonctionnalités plus puissantes.

La feuille de style CSS peut être définie via la méthode setUserAgentStylesheet() de la classe Scene. Voici un exemple de code pour définir une feuille de style CSS :

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;

public class Main extends Application {

    @Override
    public void start(Stage primaryStage) {
        // 创建按钮
        Button button = new Button("Click me!");

        // 创建布局并添加按钮
        StackPane root = new StackPane(button);

        // 创建场景并设置CSS样式表
        Scene scene = new Scene(root, 200, 200);
        scene.getStylesheets().add("style.css");

        // 设置场景并显示窗口
        primaryStage.setScene(scene);
        primaryStage.show();
    }

    public static void main(String[] args) {
        launch(args);
    }
}

2. Écriture de feuilles de style CSS :
Dans JavaFX, les feuilles de style CSS utilisent une syntaxe similaire à HTML et CSS, avec une structure de sélecteurs et de styles.

Ce qui suit est le contenu d'un simple fichier style.css :

.button {
    -fx-background-color: #4CAF50; /* 按钮背景颜色 */
    -fx-text-fill: white; /* 按钮文字颜色 */
    -fx-font-size: 14px; /* 按钮文字大小 */
    -fx-padding: 10px 20px; /* 按钮内边距 */
    -fx-border-radius: 5px; /* 按钮边角半径 */
}

.button:hover {
    -fx-background-color: #45A049; /* 鼠标悬停时按钮背景颜色 */
}

3. Utilisez la feuille de style CSS pour définir le style de l'interface :
En définissant la feuille de style CSS, nous pouvons facilement modifier le style des éléments de l'interface. Dans l'exemple ci-dessus, nous définissons la couleur d'arrière-plan du bouton, la couleur du texte, la taille du texte, le remplissage et le rayon des coins, et définissons une couleur d'arrière-plan différente pour l'état de survol.

4. Styles personnalisés :
En plus d'utiliser les styles CSS intégrés, nous pouvons également personnaliser les styles. Davantage de besoins de personnalisation peuvent être satisfaits en configurant une classe CSS personnalisée, puis en stylisant la classe dans une feuille de style CSS.

Voici un exemple où nous personnalisons une classe CSS et la stylisons :

.custom-button {
    -fx-background-color: #008CBA; /* 按钮背景颜色 */
    -fx-text-fill: white; /* 按钮文字颜色 */
    -fx-padding: 10px 20px; /* 按钮内边距 */
    -fx-border-radius: 5px; /* 按钮边角半径 */
}

Nous pouvons ensuite utiliser cette classe personnalisée dans du code Java pour styliser un bouton :

Button button = new Button("Click me!");
button.getStyleClass().add("custom-button");

en utilisant Avec des classes CSS personnalisées, nous pouvons répondre à la personnalisation de l'interface besoins avec plus de flexibilité.

Résumé :
La nouvelle feuille de style CSS JavaFX dans Java 13 nous offre des fonctions d'embellissement et de personnalisation d'interface plus puissantes. En utilisant des feuilles de style CSS, nous pouvons facilement modifier le style des éléments d'interface et répondre à des besoins de personnalisation plus flexibles. Lors du développement d'applications JavaFX, nous pouvons profiter de ces fonctionnalités pour améliorer l'esthétique et la facilité d'utilisation de l'interface utilisateur, améliorant ainsi l'expérience utilisateur.

Remarque : les exemples de code Java fournis dans cet article conviennent à JavaFX 13 et supérieur. Si vous souhaitez exécuter sur d'autres versions, veuillez apporter les modifications appropriées selon l'API JavaFX de la version correspondante.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!