JavaFX طريقة عرض رسائل بداخل Pagination

المثال التالي يعلمك طريقة وضع كل عنصر في الـ VBox الموضوع في كل صفحة بداخل VBox خاص.
ملاحظة: هذا الأسلوب يستخدم عند توفير خاصية البحث في التطبيق أو عند عرض الرسائل بشكل مرتب على عدة صفحات.


مثال

Main.java
import java.util.ArrayList;
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Hyperlink;
import javafx.scene.control.Label;
import javafx.scene.control.Pagination;
import javafx.stage.Stage;
import javafx.scene.layout.AnchorPane;
import javafx.scene.layout.VBox;

public class Main extends Application {
	
	// خصصناه لتخزين عدد العناصر التي نريد إظهارها في كل صفحة itemsPerPage المتغير
    int itemsPerPage = 3;
	
	// getSearchResult() وضعنا فيه جميع عناوين الرسائل التي سنظهرها في الصفحات و التي حصلنا عليها من الدالة Arrayعبارة عن dataالكائن
    ArrayList<String> data= getSearchResult();

	
	// Arrayهنا قمنا بتعريف دالة ترجع عناوين الرسائل ككائن نوعه
    public ArrayList<String> getSearchResult()
	{
		ArrayList<String> titles = new ArrayList();
        titles.add("Title 1");
        titles.add("Title 2");
        titles.add("Title 3");
        titles.add("Title 4");
        titles.add("Title 5");
        titles.add("Title 6");
        titles.add("Title 7");
        titles.add("Title 8");
        return titles;
    }
    
	// بناءاً على عدد الرسائل التي سنظهرها فيه Pagination هنا قمنا بتعريف دالة ترجع عدد الصفحات التي يجب أن تكون موجودة في الكائن
    public int getNumberOfPages()
	{
		// totalItems هنا قمنا بتخزين عدد عناوين الرسائل في المتغير
        double totalItems = dataList.size();
        
		// تساوي 0 totalItems ستكون قيمة dataإذا كان لا يوجد أي رسائل أصلاً في الكائن
		// pagination لهذا السبب سنرجع القيمة 1 حتى يتم إنشاء صفحة واحدة فقط في الكائن
        if(totalItems == 0)
            return 1;
        
		// الشرطين التاليين يرجعان عدد الصفحات التي يجب إنشائها نسبةً لعدد العناصر التي سيتم وضعها في كل صفحة
        if(totalItems%itemsPerPage == 0)
            return (int)(totalItems/itemsPerPage);
        else
            return (int)(totalItems/itemsPerPage) + 1;
    }
 
	
	// pagination هنا قمنا بإنشاء دالة خاصة لإنشاء و ترتيب محتوى كل صفحة سيتم إضافتها في الكائن
    public VBox createPage(int pageIndex)
	{
        // VBox محتوى كل صفحة سنعرضه بداخل حاوية نوعها
        VBox vBox = new VBox();
        
		// dataالعنوان التالي الذي يجب أن يتم جلبه من الكائن index سنستخدمه لمعرفة nextItemIndex المتغير
        int nextItemIndex = pageIndex * itemsPerPage;
        
		// لا يساوي بعد عدد العناصر التي نريد وضعها في كل صفحة vBox طالما أن عدد العناصر الموضوعة في الكائن
        while(vBox.getChildren().size() < itemsPerPage) {
            try {
				// من أجل عرض العنوان و النبذة عن كل رسالة فوق بعض مع تعديل تصميمه الإفتراضي VBox سيتم إنشاء كائن
				// من أجل إظهار خط لونه رمادي فاتح في أسفله و وضع هامش بين الأشياء التي نضيفها فيها بمقدار 5 بيكسل
                VBox elementBox = new VBox();
                elementBox.setStyle(
                        "-fx-border-width: 0 0 1 0;"
                        + "-fx-border-color: #f1f1f1;"
                        + "-fx-padding: 5px;"
                );
        
				// Label و النبذة عن الرسالة سنضعها بداخل كائن Hyperlink عنوان الرسالة سنضعه بداخل كائن
				// dataمن الكائن Label و Hyperlink و سيتم جلب النص الذي سيوضع على الكائنين
                Hyperlink link = new Hyperlink(dataList.get(nextItemIndex));
                Label text = new Label("Description for "+ link.getText());

				// vBox في الكائن elementBox و من ثم وضعنا الكائن elementBox في الكائن text و link هنا قمنا بوضع الكائنين
                elementBox.getChildren().addAll(link, text);
                vBox.getChildren().add(elementBox);

				// dataمن أجل جلب العنوان التالي من الكائن nextItemIndex هنا قمنا بإضافة 1 على قيمة المتغير
                nextItemIndex++;
            }
            catch(Exception e) {
                break;
            }
        }
		
		// الذي أصبح يحتوي على كل العناصر التي يجب عرضها في الصفحة vBox في الأخير سيتم إرجاع الكائن
        return vBox;
    }
 
    
    @Override
    public void start(Stage stage) {
        
        // في النافذة Root Node و الذي ننوي جعله الـ AnchorPane هنا قمنا بإنشاء كائن من الكلاس
        AnchorPane root = new AnchorPane();
		
        // root الذي نريد إضافته في الكائن Pagination يمثل الـ Pagination هنا قمنا بإنشاء كائن من الكلاس
        Pagination pagination = new Pagination();
		
		// التي سترجع عدد الصفحات التي يجب إنشاءها getNumberOfPages() و مررنا الدالة pagination هنا قمنا بتحديد عدد صفحات الكائن
		pagination.setPageCount(getNumberOfPages());
        
        // حتى تقوم بتوليد محتوى كل صفحة فيه createPage() و مررنا لها الدالة setPageFactory() هنا قمنا باستدعاء الدالة
        pagination.setPageFactory((Integer pageIndex) -> createPage(pageIndex));
        
        // أبيض و جعلنا لون حدوده رمادي فاتح pagination هنا جعلنا لون خلفية الكائن
        pagination.setStyle("-fx-background-color:white; -fx-border-color: lightgray;");
        
        // من كل الجهات بمقدار 20 بيكسل ( root الذي سيوضع بداخله ( أي الكائن AnchorPane عن كائن الـ pagination هنا قمنا بتحديد مكان بعد الكائن
        AnchorPane.setTopAnchor(pagination, 20.0);
        AnchorPane.setRightAnchor(pagination, 20.0);
        AnchorPane.setLeftAnchor(pagination, 20.0);
        AnchorPane.setBottomAnchor(pagination, 20.0);

        // root في الكائن pagination هنا قمنا بإضافة الكائن
        root.getChildren().add(pagination);
        
        // فيها و تحديد حجمها Node كأول root هنا قمنا بإنشاء محتوى النافذة مع تعيين الكائن
        Scene scene = new Scene(root, 350, 250);

        // هنا وضعنا عنوان للنافذة
        stage.setTitle("JavaFX Pagination");

        // أي وضعنا محتوى النافذة الذي قمنا بإنشائه للنافذة .stage في كائن الـ scene هنا وضعنا كائن الـ
        stage.setScene(scene);

        // هنا قمنا بإظهار النافذة
        stage.show();
        
    }

    // هنا قمنا بتشغيل التطبيق
    public static void main(String[] args) {
        launch(args);
    }

}
		

ستظهر لك النافذة التالية عند التشغيل.

طريقة عرض رسائل بداخل Pagination في javafx

الدورات

أدوات مساعدة

أقسام الموقع

دورات
مقالات كتب مشاريع أسئلة