>  기사  >  Java  >  Java 13의 새로운 JavaFX CSS 스타일시트로 사용자 인터페이스를 아름답게 만드세요.

Java 13의 새로운 JavaFX CSS 스타일시트로 사용자 인터페이스를 아름답게 만드세요.

WBOY
WBOY원래의
2023-07-30 14:49:191943검색

Java 13의 새로운 JavaFX CSS 스타일시트를 사용하여 사용자 인터페이스를 아름답게 만드세요

소개:
소프트웨어 개발에서 사용자 인터페이스의 아름다움과 사용 편의성은 사용자 경험을 개선하는 데 매우 중요합니다. JavaFX는 풍부한 UI 구성 요소와 기능을 제공하는 Java 플랫폼의 현대적이고 표현력이 풍부한 인터페이스 기술입니다. 사용자 인터페이스를 더욱 아름답게 만들기 위해 JavaFX는 인터페이스를 아름답게 만들고 사용자 정의할 수 있는 CSS 스타일 시트를 제공합니다. Java 13에서 JavaFX는 인터페이스 스타일을 보다 유연하고 쉽게 유지 관리 및 확장할 수 있도록 새로운 CSS 스타일 시트를 도입합니다. 이 기사에서는 Java 13의 새로운 JavaFX CSS 스타일 시트를 사용하여 사용자 인터페이스를 아름답게 만드는 방법을 소개하고 해당 코드 예제를 제공합니다.

1. CSS 스타일 시트 설정:
JavaFX에서는 CSS 스타일 시트를 설정하여 사용자 인터페이스를 아름답게 꾸밀 수 있습니다. Java 13에서는 더욱 강력한 기능과 함께 새로운 CSS 스타일시트 구문을 사용할 수 있습니다.

CSS 스타일 시트는 Scene 클래스의 setUserAgentStylesheet() 메서드를 통해 설정할 수 있습니다. 다음은 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. CSS 스타일 시트 작성:
JavaFX에서 CSS 스타일 시트는 선택기와 스타일의 구조로 HTML 및 CSS와 유사한 구문을 사용합니다.

다음은 간단한 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. CSS 스타일 시트를 사용하여 인터페이스 스타일 설정:
CSS 스타일 시트를 설정하면 인터페이스 요소의 스타일을 쉽게 변경할 수 있습니다. 위의 예에서는 버튼의 배경색, 텍스트 색상, 텍스트 크기, 패딩 및 모서리 반경을 설정하고 마우스 오버 상태에 대해 다른 배경색을 설정했습니다.

4. 사용자 정의 스타일:
내장된 CSS 스타일을 사용하는 것 외에도 스타일을 사용자 정의할 수도 있습니다. 사용자 정의 CSS 클래스를 설정한 다음 CSS 스타일시트에서 클래스 스타일을 지정하면 더 많은 사용자 정의 요구 사항을 충족할 수 있습니다.

다음은 CSS 클래스를 사용자 정의하고 스타일을 지정하는 예입니다.

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

그런 다음 Java 코드에서 해당 사용자 정의 클래스를 사용하여 버튼 스타일을 지정할 수 있습니다.

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

사용자 정의 CSS 클래스를 사용하면 인터페이스 사용자 정의에 응답할 수 있습니다. 좀 더 유연하게 필요합니다.

요약:
Java 13의 새로운 JavaFX CSS 스타일 시트는 더욱 강력한 인터페이스 미화 및 사용자 정의 기능을 제공합니다. CSS 스타일 시트를 사용하면 인터페이스 요소의 스타일을 쉽게 수정하고 보다 유연한 사용자 정의 요구 사항을 충족할 수 있습니다. JavaFX 애플리케이션을 개발할 때 이러한 기능을 활용하여 사용자 인터페이스의 미적 측면과 사용 편의성을 향상시켜 사용자 경험을 향상시킬 수 있습니다.

참고: 이 문서에 제공된 Java 코드 예제는 JavaFX 13 이상에 적합합니다. 다른 버전에서 실행하려면 해당 버전의 JavaFX API에 맞게 수정하시기 바랍니다.

위 내용은 Java 13의 새로운 JavaFX CSS 스타일시트로 사용자 인터페이스를 아름답게 만드세요.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.