آموزش جامع JavaFX

مقدمه

JavaFX یک کتابخانه قدرتمند و مدرن برای ساخت برنامه‌های دسکتاپ و Rich Internet Applications (RIA) با استفاده از زبان برنامه‌نویسی جاوا است. JavaFX جایگزین Swing به عنوان کتابخانه پیش‌فرض رابط کاربری گرافیکی (GUI) برای جاوا شده است و امکانات گسترده‌ای برای ایجاد رابط‌های کاربری جذاب و پویا ارائه می‌دهد. در این آموزش، به بررسی کامل JavaFX از مفاهیم پایه تا پیشرفته می‌پردازیم.

مزایای JavaFX

رابط کاربری مدرن: JavaFX از المان‌های UI پیشرفته و انیمیشن‌های زیبا پشتیبانی می‌کند.
پشتیبانی از CSS: می‌توانید از CSS برای استایل‌دهی به المان‌های UI استفاده کنید.
پشتیبانی از FXML: FXML یک زبان نشانه‌گذاری برای تعریف رابط‌های کاربری است که جداسازی منطق برنامه از رابط کاربری را آسان می‌کند.
انعطاف‌پذیری: JavaFX از گرافیک‌های 2D و 3D، انیمیشن‌ها، ویدئو، صدا و وب‌ویو پشتیبانی می‌کند.
مستندات جامع: JavaFX دارای مستندات گسترده و جامعه‌ی فعالی از توسعه‌دهندگان است.

شروع کار با JavaFX

نصب JavaFX

برای شروع کار با JavaFX، ابتدا باید JDK (Java Development Kit) را نصب کنید. سپس، می‌توانید JavaFX SDK را از وب‌سایت رسمی Oracle دانلود کنید. اگر از Java 11 به بعد استفاده می‌کنید، JavaFX به صورت جداگانه ارائه می‌شود و باید آن را به پروژه خود اضافه کنید.

ایجاد اولین پروژه JavaFX

یک پروژه جدید در IDE مورد نظر خود (مانند IntelliJ IDEA یا Eclipse) ایجاد کنید.
کتابخانه‌های JavaFX را به پروژه خود اضافه کنید.
یک کلاس اصلی برای برنامه ایجاد کنید.

مثال ساده‌ای از یک برنامه JavaFX:

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 btn = new Button("Click Me!");
        btn.setOnAction(event -> System.out.println("Button Clicked!"));

        StackPane root = new StackPane();
        root.getChildren().add(btn);

        Scene scene = new Scene(root, 300, 200);

        primaryStage.setTitle("JavaFX Example");
        primaryStage.setScene(scene);
        primaryStage.show();
    }

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

در این مثال، یک پنجره ساده با یک دکمه ایجاد می‌شود که با کلیک روی آن، پیامی در کنسول چاپ می‌شود.

مفاهیم پایه‌ای JavaFX

Stage (صحنه)

Stage نمایانگر پنجره اصلی برنامه است. هر برنامه JavaFX حداقل یک Stage دارد.

Scene (صحنه)

Scene شامل تمام المان‌های UI است که در یک Stage نمایش داده می‌شوند. هر Stage می‌تواند یک Scene داشته باشد.

Node (گره)

Node پایه‌ترین کلاس برای تمام المان‌های UI در JavaFX است. دکمه‌ها، برچسب‌ها، و سایر کنترل‌ها همگی از Node ارث‌بری می‌کنند.

Layout (چیدمان)

Layoutها برای سازمان‌دهی المان‌های UI در Scene استفاده می‌شوند. برخی از Layoutهای رایج عبارتند از:

StackPane: المان‌ها را روی هم قرار می‌دهد.
VBox: المان‌ها را به صورت عمودی چیدمان می‌کند.
HBox: المان‌ها را به صورت افقی چیدمان می‌کند.
BorderPane: المان‌ها را در پنج ناحیه (بالا، پایین، چپ، راست، مرکز) چیدمان می‌کند.

مثال:

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

public class Main extends Application {

    @Override
    public void start(Stage primaryStage) {
        Button btn1 = new Button("Button 1");
        Button btn2 = new Button("Button 2");

        VBox root = new VBox();
        root.getChildren().addAll(btn1, btn2);

        Scene scene = new Scene(root, 300, 200);

        primaryStage.setTitle("VBox Example");
        primaryStage.setScene(scene);
        primaryStage.show();
    }

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

کار با FXML

FXML یک زبان نشانه‌گذاری مبتنی بر XML است که برای تعریف رابط‌های کاربری در JavaFX استفاده می‌شود. با استفاده از FXML، می‌توانید رابط کاربری را از منطق برنامه جدا کنید.

ایجاد فایل FXML

یک فایل FXML ساده (example.fxml):

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.control.Button?>
<?import javafx.scene.layout.StackPane?>

<StackPane xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1">
    <Button text="Click Me!" onAction="#handleButtonClick"/>
</StackPane>

Run HTML

بارگذاری FXML در برنامه

برای بارگذاری فایل FXML در برنامه، از کلاس FXMLLoader استفاده می‌کنیم:

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.stage.Stage;

public class Main extends Application {

    @Override
    public void start(Stage primaryStage) throws Exception {
        Parent root = FXMLLoader.load(getClass().getResource("example.fxml"));

        Scene scene = new Scene(root, 300, 200);

        primaryStage.setTitle("FXML Example");
        primaryStage.setScene(scene);
        primaryStage.show();
    }

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

کنترل‌کننده‌ها (Controllers)

برای مدیریت رویدادها و تعاملات کاربر، از کنترل‌کننده‌ها استفاده می‌شود. کنترل‌کننده‌ها کلاس‌های جاوا هستند که به فایل FXML متصل می‌شوند.

مثال کنترل‌کننده:

import javafx.fxml.FXML;
import javafx.scene.control.Button;

public class ExampleController {

    @FXML
    private Button myButton;

    @FXML
    private void handleButtonClick() {
        System.out.println("Button Clicked!");
    }
}

اتصال کنترل‌کننده به FXML:

<StackPane xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1" fx:controller="ExampleController">
    <Button fx:id="myButton" text="Click Me!" onAction="#handleButtonClick"/>
</StackPane>

Run HTML

کار با CSS در JavaFX

JavaFX از CSS برای استایل‌دهی به المان‌های UI پشتیبانی می‌کند. می‌توانید از فایل‌های CSS خارجی یا استایل‌های inline استفاده کنید.

افزودن CSS به Scene

Scene scene = new Scene(root, 300, 200);
scene.getStylesheets().add(getClass().getResource("styles.css").toExternalForm());

مثال فایل CSS (styles.css):

.button {
    -fx-background-color: #4CAF50;
    -fx-text-fill: white;
    -fx-font-size: 14px;
}

انیمیشن‌ها و جلوه‌های ویژه

JavaFX از انیمیشن‌ها و جلوه‌های ویژه پشتیبانی می‌کند. برای ایجاد انیمیشن، می‌توانید از کلاس‌هایی مانند TranslateTransition, RotateTransition, و FadeTransition استفاده کنید.

مثال انیمیشن ساده:

import javafx.animation.TranslateTransition;
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;
import javafx.util.Duration;

public class Main extends Application {

    @Override
    public void start(Stage primaryStage) {
        Button btn = new Button("Click Me!");

        StackPane root = new StackPane();
        root.getChildren().add(btn);

        Scene scene = new Scene(root, 300, 200);

        primaryStage.setTitle("Animation Example");
        primaryStage.setScene(scene);
        primaryStage.show();

        TranslateTransition transition = new TranslateTransition(Duration.seconds(2), btn);
        transition.setByX(100);
        transition.setCycleCount(4);
        transition.setAutoReverse(true);
        transition.play();
    }

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

جمع‌بندی

JavaFX یک کتابخانه قدرتمند و انعطاف‌پذیر برای ساخت برنامه‌های دسکتاپ با رابط کاربری مدرن است. در این آموزش، مفاهیم پایه‌ای JavaFX، کار با FXML، CSS، انیمیشن‌ها، و کنترل‌کننده‌ها را بررسی کردیم. با استفاده از این مفاهیم، می‌توانید برنامه‌های جذاب و کاربرپسند ایجاد کنید. JavaFX به دلیل پشتیبانی از ویژگی‌های پیشرفته و مستندات جامع، یکی از بهترین گزینه‌ها برای توسعه‌دهندگان جاوا است.