FXML এর সাথে কাজ

FXML হল একটি XML ফাইল ফরম্যাট যা JavaFX অ্যাপ্লিকেশনগুলির UI (User Interface) ডিজাইন করার জন্য ব্যবহৃত হয়। এটি একটি markup language যা JavaFX উপাদানগুলির সজ্জা এবং লেআউট পরিচালনা করতে ব্যবহৃত হয়। FXML ব্যবহার করে UI ডেভেলপমেন্ট করার একটি বড় সুবিধা হল যে, এতে আপনি UI ডিজাইন এবং অ্যাপ্লিকেশনের লজিককে আলাদা রাখতে পারেন, যা কোডিংকে পরিষ্কার এবং পরিচালনা করা সহজ করে তোলে।

FXML ফাইলগুলি সাধারণত JavaFX Scene Builder দিয়ে ডিজাইন করা হয়, তবে আপনি টেক্সট এডিটর দিয়ে হাতেও FXML কোড লিখতে পারেন। এটি JavaFX অ্যাপ্লিকেশন তৈরির একটি জনপ্রিয় উপায়।

FXML এর সাথে কাজ করার জন্য প্রয়োজনীয় ধাপ:

1. FXML ফাইল তৈরি করা: প্রথমে, JavaFX UI ডিজাইন করার জন্য একটি FXML ফাইল তৈরি করতে হবে। এখানে JavaFX উপাদানগুলির (যেমন বোতাম, লেবেল, টেক্সট ফিল্ড ইত্যাদি) ডেক্লারেশন থাকবে।
2. FXML ফাইল লোড করা: Java কোডে FXML ফাইল লোড করার জন্য FXMLLoader ক্লাস ব্যবহার করা হয়। এই ফাইলটি লোড করার পর, UI উপাদানগুলো Java কোডের মধ্যে ব্যবহার করা যায়।
3. Controller ক্লাস তৈরি করা: FXML ফাইলের UI উপাদানগুলোর সাথে ইন্টারঅ্যাক্ট করতে একটি Controller ক্লাস তৈরি করতে হয়। এই ক্লাসটি Java কোডের মধ্যে UI উপাদানগুলোর কার্যকারিতা (যেমন বোতাম ক্লিক, টেক্সট সেট করা) পরিচালনা করে।

উদাহরণ:

১. FXML ফাইল তৈরি করা (UI ডিজাইন)

<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.layout.StackPane?>

<StackPane xmlns:fx="http://javafx.com/fxml/1" fx:controller="sample.Controller">
    <Label fx:id="myLabel" text="Hello, JavaFX!" />
    <Button fx:id="myButton" text="Click Me" onAction="#handleButtonAction"/>
</StackPane>

ব্যাখ্যা:

• এখানে, একটি Label এবং একটি Button তৈরি করা হয়েছে।
• fx:id অ্যাট্রিবিউট ব্যবহার করে UI উপাদানগুলির জন্য একটি আইডি নির্ধারণ করা হয়েছে, যাতে Java কোডে তাদের অ্যাক্সেস করা যায়।
• onAction="#handleButtonAction" ব্যবহার করা হয়েছে যাতে বোতামটি ক্লিক করলে handleButtonAction() মেথডটি কল হয়।

২. Controller ক্লাস তৈরি করা (Java কোড)

package sample;

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

public class Controller {

    @FXML
    private Label myLabel;

    @FXML
    private Button myButton;

    // বোতাম ক্লিক হলে লেবেলটিকে আপডেট করা
    @FXML
    private void handleButtonAction() {
        myLabel.setText("Button Clicked!");
    }
}

ব্যাখ্যা:

• @FXML অ্যানোটেশন ব্যবহার করে Label এবং Button উপাদানগুলির রেফারেন্স আনা হয়েছে, যেগুলি FXML ফাইলে ডিফাইন করা হয়েছে।
• handleButtonAction() মেথডটি বোতাম ক্লিক হলে কল হবে এবং এটি লেবেলের টেক্সট পরিবর্তন করবে।

৩. Main Application Class

package sample;

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{
        // FXML ফাইল লোড করা
        Parent root = FXMLLoader.load(getClass().getResource("sample.fxml"));
        
        primaryStage.setTitle("FXML Example");
        primaryStage.setScene(new Scene(root, 300, 275));
        primaryStage.show();
    }

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

ব্যাখ্যা:

• FXMLLoader.load(getClass().getResource("sample.fxml")) ফাংশনটি FXML ফাইলটি লোড করে।
• Parent root এর মাধ্যমে UI উপাদান লোড করা হয় এবং সেটি Scene হিসেবে সেট করা হয়, যা Stage-এ প্রদর্শিত হয়।

FXML এর অন্যান্য বৈশিষ্ট্য:

1. FXML এবং Java কোডের মধ্যে যোগাযোগ:
   • FXML ফাইলগুলি UI তৈরি করে, এবং Controller ক্লাস Java কোডের লজিক পরিচালনা করে। fx:id এবং @FXML অ্যানোটেশন ব্যবহার করে FXML এবং Java ক্লাসের মধ্যে যোগাযোগ স্থাপন করা হয়।
2. Event Handling:
   • FXML ফাইলের মধ্যে বিভিন্ন UI উপাদানের জন্য ইভেন্ট হ্যান্ডলিং করা যেতে পারে। উদাহরণস্বরূপ, onAction ইভেন্ট ব্যবহারের মাধ্যমে বোতাম ক্লিক ইভেন্ট হ্যান্ডেল করা হয়।
3. FXML এর মাধ্যমে লেআউট এবং স্টাইলিং:
   • FXML ফাইলের মধ্যে বিভিন্ন লেআউট কন্ট্রোল যেমন VBox, HBox, GridPane, StackPane ব্যবহার করা যায়।
   • CSS ব্যবহার করে FXML ফাইলের উপাদানগুলোর স্টাইলিং করা সম্ভব।

4. FXML এবং CSS:

   • JavaFX FXML ফাইলের জন্য স্টাইলিং CSS দিয়ে করা যেতে পারে। JavaFX এর মাধ্যমে একটি CSS ফাইল যোগ করে UI উপাদানগুলোর ডিজাইন পরিবর্তন করা যায়।

   উদাহরণ:

   /* Sample CSS for JavaFX */
   .button {
       -fx-background-color: #4CAF50;
       -fx-text-fill: white;
   }
   

   এই CSS ফাইলটি FXML ফাইলে অ্যাসোসিয়েট করা যাবে এবং এতে বোতামের ডিজাইন পরিবর্তন করা যাবে।

Scene Builder এর মাধ্যমে FXML তৈরি করা:

JavaFX Scene Builder ব্যবহার করে আপনি সহজেই FXML ফাইল তৈরি করতে পারেন। Scene Builder হল একটি GUI টুল যা ড্র্যাগ-এন্ড-ড্রপ ইন্টারফেস দিয়ে UI তৈরি করার সুবিধা দেয়। এটি JavaFX UI উপাদানগুলি সহজেই সাজাতে এবং তাদের ইন্টারঅ্যাকশন যুক্ত করতে সাহায্য করে।

FXML এবং JavaFX ব্যবহার করার সুবিধা:

1. UI এবং লজিক আলাদা করা: UI ডিজাইন এবং অ্যাপ্লিকেশনের লজিক আলাদা রাখা যায়, যা কোড ক্লিন এবং পরিচালনাযোগ্য করে।
2. Scene Builder এর মাধ্যমে দ্রুত UI ডিজাইন: UI উপাদানগুলোকে দ্রুত এবং সহজে ডিজাইন করা যায়।
3. FXML এর মাধ্যমে কোডের পরিপূর্ণ ব্যবস্থাপনা: আপনি UI উপাদানগুলোর কার্যকারিতা Java কোডের মাধ্যমে ইন্টিগ্রেট করতে পারেন।

সারাংশ:

• FXML হল একটি powerful টুল যা JavaFX অ্যাপ্লিকেশন UI ডিজাইন করার জন্য ব্যবহৃত হয়।
• FXML ফাইলগুলি FXMLLoader দিয়ে লোড করা হয় এবং Java কোডের মধ্যে তাদের সাথে ইন্টারঅ্যাক্ট করা হয়।
• FXML এবং Controller ক্লাসের মধ্যে UI উপাদানগুলোর কার্যকারিতা পরিচালনা করা হয়।
• FXML এর মাধ্যমে UI এবং লজিকের মধ্যে ক্লিন আলাদা করে কাজ করা সম্ভব।

JavaFX এবং FXML ব্যবহার করার মাধ্যমে Java অ্যাপ্লিকেশন ডেভেলপমেন্ট আরো দ্রুত, সহজ এবং মডুলার করা সম্ভব।

FXML হল একটি XML ভিত্তিক মার্কআপ ভাষা যা JavaFX অ্যাপ্লিকেশনগুলির UI (User Interface) ডিজাইন করার জন্য ব্যবহৃত হয়। FXML মূলত একটি UI ডিজাইন ভাষা যা JavaFX-এর মাধ্যমে ব্যবহারকারীর ইন্টারফেস (UI) তৈরি করতে সাহায্য করে, আর Java কোড এবং UI ডিজাইনকে আলাদা করে কাজ করার সুবিধা দেয়।

FXML এর ভূমিকা:

1. UI এবং লজিক আলাদা করা: FXML-এর সবচেয়ে বড় সুবিধা হল এটি UI এবং লজিক আলাদা করতে সাহায্য করে। আপনি Java কোডের মাধ্যমে ব্যবসায়িক লজিক এবং ডেটা প্রসেসিং করতে পারেন, এবং FXML ব্যবহার করে UI ডিজাইন করতে পারেন। এতে অ্যাপ্লিকেশনটির ডিজাইন এবং কোড আরও পরিষ্কার এবং সহজে রক্ষণাবেক্ষণযোগ্য হয়।
2. ডিজাইন এবং কোড আলাদা করা: FXML-এর মাধ্যমে আপনি JavaFX GUI তৈরি করতে পারেন, এবং পরে আপনি এই UI উপাদানগুলির সাথে ইন্টারঅ্যাক্ট করার জন্য Java কোড লিখতে পারেন। এতে UI ডিজাইন করার সময় অর্থনৈতিকভাবে UI ডেভেলপমেন্ট এবং বিজনেস লজিক ডেভেলপমেন্ট আলাদা করা সম্ভব।
3. গ্রাফিকাল ডিজাইন টুল: FXML সহ JavaFX সাধারণত Scene Builder নামে একটি গ্রাফিকাল টুল ব্যবহার করে UI তৈরি করতে পারে। এই টুলটি ব্যবহারকারীদের Drag-and-drop পদ্ধতিতে UI উপাদানগুলিকে ডিজাইন করার সুযোগ দেয়, যা পরে FXML ফাইলে এক্সপোর্ট করা হয়।
4. XML ভিত্তিক ডিজাইন: FXML XML ফরম্যাটে লেখা হয়, যার ফলে এটি সহজেই পার্স করা যায় এবং অন্যান্য টুলসের সাথে ইন্টিগ্রেট করা যায়। XML-এ UI উপাদানগুলি সরাসরি লেখা যায় এবং তারপরে Java কোডের মাধ্যমে এই উপাদানগুলির সাথে ইন্টারঅ্যাক্ট করা হয়।

FXML কিভাবে কাজ করে:

FXML ব্যবহার করার জন্য, আপনাকে একটি FXML ফাইল তৈরি করতে হয় যা UI উপাদানগুলির গঠন এবং তাদের প্যারামিটারগুলির মধ্যে সম্পর্ক বর্ণনা করে। এর পরে, আপনি একটি Controller Class তৈরি করেন, যা FXML ফাইলের সাথে যুক্ত থাকে এবং UI উপাদানগুলির ইন্টারঅ্যাকশন এবং কার্যক্রম পরিচালনা করে।

FXML ফাইলের একটি সাধারণ উদাহরণ:

<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.layout.StackPane?>
<?import javafx.scene.Scene?>
<?import javafx.stage.Stage?>

<StackPane xmlns:fx="http://javafx.com/fxml" fx:controller="sample.Controller">
    <Button text="Say 'Hello World'" onAction="#handleButtonAction"/>
</StackPane>

ব্যাখ্যা:

1. XML Tags:
   • StackPane, Button, ইত্যাদি হল JavaFX UI উপাদান।
   • fx:controller অ্যাট্রিবিউটটি Controller ক্লাসের সাপেক্ষে ব্যবহার করা হয়। এতে Java কোড এবং FXML ফাইলের মধ্যে যোগাযোগ হয়।
   • onAction="#handleButtonAction" অ্যাট্রিবিউটটি বোতামের ক্লিক করার পর একটি মেথড কল করার নির্দেশনা দেয়। এখানে handleButtonAction() হল মেথড যা Controller ক্লাসে থাকবে।
2. Controller Class: FXML ফাইলের সাথে যুক্ত Controller ক্লাসে ইন্টারঅ্যাকশন লজিক রাখা হয়, যেমন বাটনে ক্লিক ইভেন্ট হ্যান্ডলিং।

Controller Class উদাহরণ:

package sample;

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

public class Controller {

    @FXML
    private Button button;

    @FXML
    private void handleButtonAction(ActionEvent event) {
        System.out.println("Hello World!");
    }
}

Controller ব্যাখ্যা:

• @FXML অ্যানোটেশনটি JavaFX-কে জানায় যে, এই মেথড বা ফিল্ডটি FXML ফাইলের সাথে সম্পর্কিত।
• handleButtonAction মেথডটি বাটনে ক্লিক করার সময় কল হয় এবং এটি একটি "Hello World!" বার্তা কনসোলে প্রিন্ট করবে।

FXML এর সুবিধাসমূহ:

1. গ্রাফিকাল ইউজার ইন্টারফেস ডিজাইন করা সহজ:
   • FXML কোড লেখার পরিবর্তে গ্রাফিক্যাল টুল (যেমন JavaFX Scene Builder) ব্যবহার করে ডিজাইন করা সহজ হয়।
2. কোড এবং UI এর মধ্যে পরিষ্কার পার্থক্য:
   • Java কোডে শুধুমাত্র বিজনেস লজিক এবং ইভেন্ট হ্যান্ডলিং করা হয়, UI ডিজাইন FXML ফাইলে থাকে।
3. Scene Builder ব্যবহার:
   • JavaFX Scene Builder টুলটি ব্যবহারকারীদের ড্র্যাগ-এন্ড-ড্রপ পদ্ধতিতে UI তৈরি করতে সাহায্য করে এবং এটি FXML ফরম্যাটে এক্সপোর্ট করে।
4. সহজে রক্ষণাবেক্ষণযোগ্য:
   • UI এর পরিবর্তনগুলি FXML ফাইলে করা যায় এবং Java কোডের কোন পরিবর্তন করতে হয় না, ফলে রক্ষণাবেক্ষণ সহজ হয়।

FXML এর ব্যবহার:

1. JavaFX অ্যাপ্লিকেশনগুলিতে UI তৈরি করার জন্য।
2. গ্রাফিক্যাল ইউজার ইন্টারফেস ডিজাইন: Scene Builder সহ UI ডিজাইন করা যায়।
3. UI এবং বিজনেস লজিক আলাদা করা: Java কোড এবং UI ডিজাইন কোড আলাদা করা সম্ভব।

সারাংশ:

FXML হল JavaFX-এর একটি অত্যন্ত শক্তিশালী বৈশিষ্ট্য যা UI ডিজাইন এবং বিজনেস লজিক আলাদা করতে সাহায্য করে। FXML ব্যবহারের মাধ্যমে, UI এর ডিজাইন অংশ এবং Java কোডের কার্যক্রম অংশ একে অপর থেকে আলাদা থাকে, যা অ্যাপ্লিকেশন রক্ষণাবেক্ষণ এবং উন্নয়নকে সহজ করে তোলে। FXML টেমপ্লেটের মাধ্যমে UI উপাদানগুলি তৈরি করা এবং Scene Builder এর মাধ্যমে গ্রাফিক্যালভাবে ডিজাইন করা সম্ভব।

JavaFX-এ, FXML একটি XML ভিত্তিক markup ভাষা যা UI ডিজাইন করতে ব্যবহৃত হয়। FXML ফাইলের মাধ্যমে, UI কম্পোনেন্টগুলিকে ডিক্লেয়ার করা হয় এবং সেই UI কোড Java কোড থেকে আলাদা করা হয়। এই পদ্ধতি UI এবং লজিকের মধ্যে separation of concerns নিশ্চিত করে, এবং এটি UI ডিজাইনারদের Java কোড থেকে আলাদা করে কাজ করতে সক্ষম করে।

FXML ফাইল তৈরি এবং ব্যবহার করতে হলে, JavaFX অ্যাপ্লিকেশন তৈরির জন্য কিছু নির্দিষ্ট পদক্ষেপ অনুসরণ করতে হয়। নিচে একটি উদাহরণ দেওয়া হলো যা আপনাকে FXML ফাইল ব্যবহার করার প্রক্রিয়া দেখাবে।

ধাপ ১: JavaFX অ্যাপ্লিকেশন তৈরি করা

আমরা JavaFX অ্যাপ্লিকেশন তৈরি করব যেখানে FXML ফাইল থেকে UI লোড করা হবে এবং Java কোডের সাথে তা যুক্ত করা হবে।

উদাহরণ: JavaFX অ্যাপ্লিকেশন - FXML ফাইল ব্যবহার

১. FXML ফাইল তৈরি করুন:

FXML ফাইল সাধারণত .fxml এক্সটেনশন নিয়ে থাকে। নিচে একটি সাধারণ FXML ফাইলের উদাহরণ দেওয়া হল:

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

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

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

ব্যাখ্যা:

• StackPane: UI কম্পোনেন্টগুলিকে স্ট্যাক করার জন্য ব্যবহৃত একটি লেআউট।
• Button: একটি বাটন তৈরি করা হয়েছে যার টেক্সট হল "Click Me!" এবং এর onAction অ্যাট্রিবিউট সেট করা হয়েছে একটি মেথডের জন্য (#handleButtonAction)।
• fx:controller: FXML ফাইলের জন্য Java কন্ট্রোলার ক্লাস নির্দিষ্ট করে, যাতে সেই ক্লাস থেকে কন্ট্রোল করা যেতে পারে।

২. Java Controller ক্লাস তৈরি করুন:

এখন আমাদের একটি Java Controller ক্লাস তৈরি করতে হবে যা FXML ফাইলের UI উপাদানগুলোর সাথে ইন্টারঅ্যাক্ট করবে। এখানে, handleButtonAction মেথডের মাধ্যমে বাটন ক্লিক করার পর একটি সেম্পল অ্যাকশন হ্যান্ডেল করা হবে।

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

public class MainController {

    @FXML
    private Button myButton;

    // এই মেথডটি FXML ফাইলের button এর onAction এর সাথে সংযুক্ত
    @FXML
    private void handleButtonAction() {
        System.out.println("Button clicked!");
        myButton.setText("You clicked me!");
    }
}

ব্যাখ্যা:

• @FXML অ্যানোটেশন দিয়ে Java ফিল্ড এবং মেথডগুলোকে FXML ফাইলের সাথে সম্পর্কিত করা হয়।
• handleButtonAction() মেথড বাটন ক্লিক হলে কল হবে এবং এটি কনসোলে একটি বার্তা প্রিন্ট করবে এবং বাটনের টেক্সট পরিবর্তন করবে।

৩. JavaFX অ্যাপ্লিকেশন (Main Application Class):

এখন আমাদের একটি Main অ্যাপ্লিকেশন ক্লাস তৈরি করতে হবে যা FXML ফাইল লোড করবে এবং JavaFX অ্যাপ্লিকেশনটি চালু করবে।

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

public class MainApplication extends Application {

    @Override
    public void start(Stage primaryStage) {
        try {
            // FXML ফাইল লোড করা
            FXMLLoader loader = new FXMLLoader(getClass().getResource("main.fxml"));
            StackPane root = loader.load();
            
            // দৃশ্য তৈরি করা
            Scene scene = new Scene(root, 300, 250);
            primaryStage.setTitle("FXML Example");
            primaryStage.setScene(scene);
            primaryStage.show();
        } catch (Exception e) {
            e.printStackTrace();
        }
    }

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

ব্যাখ্যা:

• FXMLLoader ক্লাস ব্যবহার করে আমরা FXML ফাইল লোড করছি।
• getClass().getResource("main.fxml"): এটি FXML ফাইলটি লোড করতে ব্যবহৃত হয় (এই উদাহরণে main.fxml ফাইলটি একই প্যাকেজে রয়েছে)।
• StackPane এর মধ্যে FXML ফাইলের UI উপাদানগুলো লোড করা হবে এবং দৃশ্য (Scene) সেট করা হবে।

ধাপ ২: প্রোজেক্ট স্ট্রাকচার

আপনার প্রোজেক্টের ফোল্ডার স্ট্রাকচার এভাবে থাকতে পারে:

/src
    /MainApplication.java        (JavaFX অ্যাপ্লিকেশন ক্লাস)
    /MainController.java         (FXML কন্ট্রোলার ক্লাস)
    /main.fxml                   (FXML ফাইল)

ধাপ ৩: প্রোজেক্ট কম্পাইল এবং রান করা

1. FXML ফাইল সংযুক্ত করা: JavaFX অ্যাপ্লিকেশন রান করার সময় নিশ্চিত করুন যে FXML ফাইলটি সঠিকভাবে Java ক্লাসের সাথে সংযুক্ত হয়েছে।
2. FXML লোডিং: FXML ফাইলটি লোড করার সময় FXMLLoader ব্যবহার করে Java ক্লাসের সাথে সংযুক্ত করুন।
3. FXML ফাইল চালানো: আপনার JavaFX অ্যাপ্লিকেশন ক্লাস চালানোর পর, JavaFX UI আপনার FXML ফাইল থেকে লোড হবে এবং Java কন্ট্রোলার থেকে ইন্টারঅ্যাক্ট করবে।

FXML ফাইল JavaFX অ্যাপ্লিকেশনের UI ডিজাইন করতে একটি শক্তিশালী এবং সুবিধাজনক উপায়। Java কোড এবং UI ডিজাইনকে আলাদা করে রেখে UI এবং লজিকের মধ্যে separation of concerns নিশ্চিত করা হয়। FXML ফাইলের মাধ্যমে ইউজার ইন্টারফেস ডিজাইন করা সহজ এবং এটি JavaFX অ্যাপ্লিকেশনের উন্নয়নকে আরও সুবিধাজনক ও পরিষ্কার করে তোলে।

JavaFX তে UI (User Interface) তৈরি করার জন্য FXML একটি XML ভিত্তিক ফাইল ফরম্যাট, যা আপনাকে ইউজার ইন্টারফেস আলাদা করে ডিজাইন করতে দেয়। FXML দিয়ে UI ডিজাইন করা এবং FXMLLoader ব্যবহার করে তা JavaFX অ্যাপ্লিকেশন থেকে লোড করা হয়। এটি কোড এবং UI ডিজাইন আলাদা রাখার জন্য উপকারী, ফলে অ্যাপ্লিকেশনটির রক্ষণাবেক্ষণ সহজ হয়।

FXML এর সুবিধাসমূহ:

1. UI ডিজাইন আলাদা করা: FXML দিয়ে UI ডিজাইন এবং Java কোড আলাদা করা যায়, যা কোডের পরিষ্কারতা বাড়ায়।
2. ডিজাইনার টুল ব্যবহার: আপনি JavaFX Scene Builder ব্যবহার করে FXML ফাইলটি গ্রাফিক্যালভাবে ডিজাইন করতে পারেন এবং পরবর্তীতে সেই FXML ফাইলকে Java অ্যাপ্লিকেশনে লোড করতে পারেন।
3. কোডের পুনঃব্যবহারযোগ্যতা: একই UI কম্পোনেন্টগুলো বিভিন্ন জায়গায় ব্যবহার করা সম্ভব।

FXML লোড করার জন্য FXMLLoader ব্যবহার:

FXMLLoader ক্লাসটি FXML ফাইলটি লোড করতে ব্যবহৃত হয় এবং এটি JavaFX অ্যাপ্লিকেশন এ UI উপাদানগুলিকে যুক্ত করে। FXMLLoader দ্বারা FXML ফাইল লোড করার জন্য কিছু পদক্ষেপ রয়েছে, যেগুলো নিচে ব্যাখ্যা করা হলো।

ধাপ ১: FXML ফাইল তৈরি করা

প্রথমে, একটি FXML ফাইল তৈরি করতে হবে, যেখানে UI ডিজাইন থাকবে। আপনি Scene Builder ব্যবহার করে FXML ফাইলটি ডিজাইন করতে পারেন, অথবা হাত দিয়েও এটি লিখতে পারেন।

উদাহরণ: sample.fxml (FXML ফাইল)

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

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

<StackPane xmlns:fx="http://javafx.com/fxml" fx:controller="sample.Controller">
    <Button text="Click Me" onAction="#handleButtonClick"/>
</StackPane>

এখানে:

• StackPane: একটি লেআউট কন্টেইনার যা UI উপাদানগুলি স্তূপ আকারে সাজায়।
• Button: একটি বাটন উপাদান যা Click Me টেক্সট সহ দেখাবে এবং বাটনে ক্লিক করলে একটি মেথড কল হবে।
• fx:controller: এই অ্যাট্রিবিউটটি নির্দেশ করে যে এই FXML ফাইলটি কোন কন্ট্রোলারের সাথে যুক্ত থাকবে।

ধাপ ২: Controller ক্লাস তৈরি করা

FXML ফাইলের সাথে একটি কন্ট্রোলার ক্লাস যুক্ত করতে হয়। এটি Java ক্লাস যা UI উপাদানগুলির সাথে ইন্টারঅ্যাকশন হ্যান্ডেল করে।

উদাহরণ: Controller.java (Controller ক্লাস)

package sample;

import javafx.event.ActionEvent;
import javafx.fxml.FXML;
import javafx.scene.control.Alert;
import javafx.scene.control.Alert.AlertType;

public class Controller {

    // এই মেথডটি FXML ফাইলের Button এর সাথে যুক্ত
    @FXML
    private void handleButtonClick(ActionEvent event) {
        // বাটনে ক্লিক করলে একটি Alert দেখাবে
        Alert alert = new Alert(AlertType.INFORMATION);
        alert.setTitle("Information");
        alert.setHeaderText(null);
        alert.setContentText("Button clicked!");
        alert.showAndWait();
    }
}

এখানে:

• handleButtonClick(): এই মেথডটি বাটনে ক্লিক হলে কল হয় (এই মেথডটি FXML ফাইলের onAction="#handleButtonClick" এর মাধ্যমে যুক্ত করা হয়েছে)।
• Alert: বাটন ক্লিক করার পরে একটি ইনফরমেশন অ্যালার্ট শো হবে।

ধাপ ৩: FXMLLoader দিয়ে FXML লোড করা

এখন, আমাদের Java কোডে FXMLLoader ব্যবহার করে FXML ফাইলটি লোড করতে হবে। FXML ফাইল লোড করার জন্য FXMLLoader ক্লাসের load() মেথড ব্যবহার করা হয়।

উদাহরণ: Main.java (Java অ্যাপ্লিকেশন)

package sample;

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

import java.io.IOException;

public class Main extends Application {

    @Override
    public void start(Stage primaryStage) {
        try {
            // FXML ফাইল লোড করা
            FXMLLoader loader = new FXMLLoader(getClass().getResource("sample.fxml"));
            StackPane root = loader.load();

            // Scene তৈরি করা
            Scene scene = new Scene(root, 300, 250);

            // স্টেজ সেট করা
            primaryStage.setTitle("JavaFX FXML Example");
            primaryStage.setScene(scene);
            primaryStage.show();

        } catch (IOException e) {
            e.printStackTrace();
        }
    }

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

এখানে:

• FXMLLoader ব্যবহার করে sample.fxml ফাইলটি লোড করা হয়েছে।
• loader.load() মেথডে FXML ফাইল লোড হয়ে StackPane রুট এলিমেন্টে যুক্ত হয়।
• Scene তৈরি করা হয় এবং Stage এ সেট করা হয়।

ধাপ ৪: প্রকল্পের কাঠামো

প্রকল্পের কাঠামো নিম্নরূপ হতে পারে:

JavaFXFXMLExample/
│
├── src/
│   └── sample/
│       ├── Controller.java
│       ├── Main.java
│       └── sample.fxml
└── lib/
    └── javafx-sdk-xx/lib/

ধাপ ৫: প্রকল্প রান করা

1. JavaFX SDK ডাউনলোড করুন এবং সঠিকভাবে সেটআপ করুন।
2. FXMLLoader দ্বারা FXML ফাইলটি লোড করতে Java কোড লিখুন।
3. Main.java ক্লাস রান করুন।

FXML এবং FXMLLoader ব্যবহার করে JavaFX অ্যাপ্লিকেশন তৈরি করা UI এবং লজিকের মধ্যে আলাদা রেখেই উন্নত, পরিষ্কার এবং রক্ষণাবেক্ষণযোগ্য কোড লিখতে সাহায্য করে। FXML একটি সহজ XML ফরম্যাটে UI উপাদানগুলো ডিজাইন করার সুযোগ দেয়, এবং FXMLLoader দ্বারা তা JavaFX অ্যাপ্লিকেশনে লোড করা হয়।

FXML হল একটি XML ভিত্তিক মার্কআপ ভাষা যা JavaFX অ্যাপ্লিকেশনে ইউজার ইন্টারফেস (UI) তৈরি করার জন্য ব্যবহৃত হয়। FXML এর মাধ্যমে UI ডিজাইন করা হয় এবং Controller এর মাধ্যমে UI উপাদানগুলির কার্যকারিতা (events, actions, etc.) নিয়ন্ত্রণ করা হয়।

FXML এবং Controller এর মধ্য দিয়ে UI থেকে Logic এবং UI কন্ট্রোল এর মধ্যে বিভাজন তৈরি হয়, যা অ্যাপ্লিকেশনটিকে পরিষ্কার, সংগঠিত এবং মেইনটেনেবল রাখে।

FXML এর মাধ্যমে Controller এবং Events Binding:

1. FXML ফাইল: UI উপাদানগুলি XML মার্কআপ ফাইল হিসেবে সংজ্ঞায়িত হয়। FXML ফাইলের মধ্যে UI কন্ট্রোলের বৈশিষ্ট্য, লেআউট, এবং স্টাইল সংজ্ঞায়িত করা হয়।
2. Controller ক্লাস: Controller ক্লাসটি UI উপাদানগুলির সাথে ইন্টারঅ্যাক্ট করে। এটি FXML ফাইলের সাথে সংযুক্ত থাকে এবং UI উপাদানগুলির ইভেন্ট হ্যান্ডলিং করে।
3. Events Binding: FXML ফাইলের মধ্যে UI উপাদানগুলোর ইভেন্ট (যেমন, বাটনে ক্লিক, কিবোর্ড ইনপুট) controller ক্লাসের মেথডের সাথে বাইন্ড করা হয়।

ধাপ 1: FXML ফাইল তৈরি করা:

sample.fxml (FXML ফাইল):

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

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

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

ব্যাখ্যা:

• এখানে একটি Button তৈরি করা হয়েছে যার টেক্সট "Click Me!"।
• onAction="#handleButtonClick" এটিতে Button এর ক্লিক ইভেন্ট handleButtonClick মেথডের সাথে বাইন্ড করা হয়েছে। এই মেথডটি controller ক্লাসে উপস্থিত থাকবে।
• fx:controller="sample.Controller" দ্বারা Controller ক্লাসের অবস্থান উল্লেখ করা হয়েছে, যা FXML ফাইলটি হ্যান্ডেল করবে।

ধাপ 2: Controller ক্লাস তৈরি করা:

Controller.java (Controller ক্লাস):

package sample;

import javafx.event.ActionEvent;
import javafx.fxml.FXML;
import javafx.scene.control.Alert;
import javafx.scene.control.Alert.AlertType;

public class Controller {

    // Button click event handler method
    @FXML
    private void handleButtonClick(ActionEvent event) {
        // Display an alert when the button is clicked
        Alert alert = new Alert(AlertType.INFORMATION);
        alert.setTitle("Button Clicked");
        alert.setHeaderText("You clicked the button!");
        alert.setContentText("Hello, JavaFX!");
        alert.showAndWait();
    }
}

ব্যাখ্যা:

• @FXML অ্যানোটেশনটি নির্দেশ করে যে handleButtonClick মেথডটি FXML ফাইল থেকে কল হবে।
• Button Click Event Handler: handleButtonClick() মেথডটি Button এর ক্লিক ইভেন্ট হ্যান্ডেল করবে এবং একটি Alert ডায়লগ দেখাবে।

ধাপ 3: Main Application Class:

Main.java (Main Application ক্লাস):

package sample;

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

public class Main extends Application {

    @Override
    public void start(Stage primaryStage) throws Exception{
        // Load FXML file
        FXMLLoader loader = new FXMLLoader(getClass().getResource("sample.fxml"));
        primaryStage.setTitle("FXML Example");
        primaryStage.setScene(new Scene(loader.load(), 300, 250));
        primaryStage.show();
    }

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

ব্যাখ্যা:

• FXMLLoader ব্যবহার করে FXML ফাইলটি লোড করা হয়।
• primaryStage.setScene(new Scene(loader.load(), 300, 250)) - ফাইলটি লোড করার পর, UI-টি একটি নতুন Scene হিসেবে স্টেজে সেট করা হয়।
• launch(args) এর মাধ্যমে অ্যাপ্লিকেশনটি চালু হয়।

ধাপ 4: প্রোজেক্ট কাঠামো:

project-folder/
|-- src/
|   |-- sample/
|       |-- Main.java
|       |-- Controller.java
|       |-- sample.fxml
|-- lib/
|-- bin/

আউটপুট:

• অ্যাপ্লিকেশন চালু হলে একটি উইন্ডো প্রদর্শিত হবে যা একটি বাটন "Click Me!" ধারণ করবে।
• যখন আপনি বাটনে ক্লিক করবেন, একটি Alert ডায়লগ "You clicked the button!" প্রদর্শিত হবে।

FXML এবং Controller এর মাধ্যমে Events Binding এর সুবিধা:

1. Separation of Concerns: FXML ব্যবহার করলে UI এবং লজিকের মধ্যে একটি পরিষ্কার বিভাজন থাকে। UI (FXML) এবং লজিক (Controller) আলাদা হয়ে যায়, যা কোড মেইনটেনেন্স এবং ডিবাগিং সহজ করে।
2. Declarative UI Design: FXML ব্যবহার করে UI ডিজাইন করা declarative ভাষায় হয়, যা অনেক সহজ এবং পরিচিত (HTML এর মতো)।
3. Event Handling: ইভেন্ট হ্যান্ডলিং সোজা এবং পরিষ্কার, কারণ আপনি FXML ফাইলের মাধ্যমে ইভেন্ট হ্যান্ডলারকে Controller ক্লাসের মেথডের সাথে বাইন্ড করতে পারেন।

অতিরিক্ত ধারণা:

• FXML ফাইল থেকে Controller ক্লাসে ডেটা পাস: আপনি FXML ফাইল থেকে Controller ক্লাসে ডেটা পাস করতে পারেন এবং UI উপাদানগুলির মাধ্যমে তা দেখাতে পারেন।
• FXML Loader এর মাধ্যমে ডায়নামিক লোডিং: আপনি একাধিক Scene বা UI কন্ট্রোল FXML ফাইলের মাধ্যমে ডায়নামিকভাবে লোড করতে পারেন।

এভাবে JavaFX এর FXML এবং Controller ক্লাসের মাধ্যমে events binding করা হয়, যা অ্যাপ্লিকেশন ডিজাইনে পরিষ্কারতা এবং কার্যকারিতা বৃদ্ধি করে।