تعلم javafx

شرح الكلاس ScrollPane في javafx

صورة
صدام العويري
اخر تحديث :

شرح الكلاس  ScrollPane

الكلاس ScrollPane يستخدم لإنشاء حاوية يضافة لها شرط تمرير ( ScrollBar ) بشكل تلقائي عند الحاجة لجعل المستخدم قادر على رؤية كل ما تحتويه النافذة مهما كان حجم شاشة الجهاز الذي يستخدمه.
هذه الحاوية يمكنها أن تحتوي على شيء واحد فقط. مع الإشارة إلى أن هذا الشيء يمكن أن يكون زر, صورة, حاوية أخرى إلخ..

إفتراضياً, الشيء الذي تضيفه في كائن الـ ScrollPane يظهر في الأعلى من جهة اليسار و لكنك تستطيع تحديد مكان ظهوره.


بناء الكلاس ScrollPane

@DefaultProperty(value="content")
public class ScrollPane
extends Control

كونستركتورات الكلاس ScrollPane

الجدول التالي يحتوي على كونستركتورات الكلاس ScrollPane.

الكونستركتور مع تعريفه
ScrollPane() ينشئ كائن من الكلاس ScrollPane يمثل حاوية فارغة.
ScrollPane(Node content) ينشئ كائن من الكلاس ScrollPane يمثل حاوية مع تحديد الشيء الذي نريد وضعه فيها.
مكان الباراميتر content نمرر الشيء الذي نريد وضعه فيها.

دوال الكلاس ScrollPane

الجدول التالي يحتوي على دوال الكلاس ScrollPane الأكثر إستخداماً.

الدالة مع تعريفها
public void setPrefSize(double prefWidth, double prefHeight) تستخدم لتحديد حجم كائن الـ ScrollPane الذي قام باستدعائها.

  • مكان الباراميتر prefWidth نضع رقم يمثل عرض الـ ScrollPane بالـ Pixel.

  • مكان الباراميتر prefHeight نضع رقم يمثل طول الـ ScrollPane بالـ Pixel.
public final void setTranslateX(double value) تستخدم لتحديد مكان كائن الـ ScrollPane الذي قام باستدعائها أفقياً.
مكان الباراميتر value نضع رقم يمثل كم Pixel سيتم إزاحته من اليسار إلى اليمين.
public final void setTranslateY(double value) تستخدم لتحديد مكان كائن الـ ScrollPane الذي قام باستدعائها عامودياً.
مكان الباراميتر value نضع رقم يمثل كم Pixel سيتم إزاحته من الأعلى إلى الأسفل.
public final void setBackground(Background value) تستخدم لوضع لون أو صورة كخلفية لكائن الـ ScrollPane الذي قام بإستدعائها.
مكان الباراميتر value نضع كائن من الكلاس Background يشير إلى درجة اللون أو الصورة التي سيتم وضعها كخلفية.
public final void setStyle(String value) تستخدم لتعديل تصميم كائن الـ ScrollPane الذي قام بإستدعائها.
مكان الباراميتر value يمكنك تمرير إسم و قيمة أي خاصية تريد تعديلها في كائن الـ ScrollPane بأسلوب لغة CSS لإظهاره بالشكل الذي تريده.
public final void setContent(Node value) تستخدم لتحديد الشيء الذي سيتم وضعه بداخل كائن الـ ScrollPane الذي قام بإستدعائها.
مكان الباراميتر value نمرر الشيء الذي نريد وضعه فيه.

أمثلة شاملة للتعامل مع الكلاس  ScrollPane

 طريقة إنشاء كائن من الكلاس ScrollPane 

المثال التالي يعلمك طريقة إنشاء كائن من الكلاس ScrollPane و وضعه كـ Root Node.


مثال

Main.java 
      import javafx.application.Application;
      import javafx.scene.Scene;
      import javafx.stage.Stage;
      import javafx.scene.control.Button;
      import javafx.scene.control.ScrollPane;

      public class Main extends Application {

      @Override
      public void start(Stage stage) {

      // في النافذة Root Node و الذي ننوي جعله الـ ScrollPane هنا قمنا بإنشاء كائن من الكلاس
      ScrollPane root = new ScrollPane();

      // root يمثل الزر الذي سنضعه بداخل الكائن Button هنا قمنا بإنشاء كائن من الكلاس
      Button button = new Button("Button");

      // button هنا قمنا بتحديد حجم الكائن
      button.setPrefSize(300, 200);

      // root في الكائن button هنا قمنا بإضافة الكائن
      root.setContent(button);

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

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

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

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

      }

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

      }

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

طريقة إنشاء كائن من الكلاس ScrollPane


•ببطئ قم بتصغير حجم النافذة بواسطة الفأرة لترى كيف سيتم إظهار شريط تمرير عند الحاجة ( ScrollBar ) حتى تظل قادراً على رؤية كل محتوى النافذة مهما كان حجمها.



 طريقة تحديد حجم و مكان ظهور الأشياء التي نضيفها في ScrollPane

المثال التالي يعلمك طريقة تحديد حجم و مكان ظهور الأشياء التي نضيفها في ScrollPane.
لإظهار محتوى الـ ScrollPane في وسطه, سنضع فيه StackPane, و بداخله سنضيف الشيئ الذي نريد وضعه.


مثال

Main.java 
      import javafx.application.Application;
      import javafx.scene.Scene;
      import javafx.stage.Stage;
      import javafx.scene.control.Button;
      import javafx.scene.control.ScrollPane;
      import javafx.scene.layout.StackPane;
      import javafx.beans.binding.Bindings;

      public class Main extends Application {

      @Override
      public void start(Stage stage) {

      // في النافذة Root Node و الذي ننوي جعله الـ ScrollPane هنا قمنا بإنشاء كائن من الكلاس
      ScrollPane root = new ScrollPane();

      // root لأننا ننوي وضعه في الكائن StackPane هنا قمنا بإنشاء كائن من الكلاس
      StackPane stackPane = new StackPane();

      // root يمثل الزر الذي سنضعه بداخل الكائن Button هنا قمنا بإنشاء كائن من الكلاس
      Button button = new Button("Button");

      // button هنا قمنا بتحديد حجم الكائن
      button.setPrefSize(300, 200);

      // و بالتالي سيساوي عرض النافذة بحد ذاتها root يساوي عرض الكائن stackPane هنا جعلنا عرض الكائن
      stackPane.minWidthProperty().bind(Bindings.createDoubleBinding(() -> 
      root.getViewportBounds().getWidth(), root.viewportBoundsProperty()));

      // و بالتالي سيساوي طول النافذة بحد ذاتها root يساوي طول الكائن stackPane هنا جعلنا طول الكائن
      stackPane.minHeightProperty().bind(Bindings.createDoubleBinding(() -> 
      root.getViewportBounds().getHeight(), root.viewportBoundsProperty()));

      // stackPane في الكائن button هنا قمنا بإضافة الكائن
      stackPane.getChildren().add(button);

      // root في الكائن stackPane هنا قمنا بإضافة الكائن
      root.setContent(stackPane);

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

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

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

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

      }

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

      }

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

طريقة تحديد حجم و مكان ظهور الأشياء التي نضيفها في ScrollPane


•ببطئ قم بتصغير حجم النافذة بواسطة الفأرة لترى كيف سيتم إظهار شريط تمرير عند الحاجة ( ScrollBar ) حتى تظل قادراً على رؤية كل محتوى النافذة مهما كان حجمها.



 طريقة عرض صورة بدخل ScrollPane

المثال التالي يعلمك طريقة عرض صورة بدخل ScrollPane .

ملاحظة: عليك إنشاء مجلد و وضع الصورة التي تريد عرضها بداخل الـ ScrollPane كما في الصورة التالية.

الصورة توضح أننا أضفنا مجلد إسمه images و وضعنا فيه صورة إسمها space.jpg.



مثال

Main.java 
      import javafx.application.Application;
      import javafx.scene.Scene;
      import javafx.stage.Stage;
      import javafx.scene.image.Image;
      import javafx.scene.image.ImageView;
      import javafx.scene.control.ScrollPane;

      public class Main extends Application {

      @Override
      public void start(Stage stage) {

      // في النافذة Root Node و الذي ننوي جعله الـ ScrollPane هنا قمنا بإنشاء كائن من الكلاس
      ScrollPane root = new ScrollPane();

      // space.jpg و الذي سنعرض عليه الصورة ImageView هنا قمنا بإنشاء كائن من الكلاس
      ImageView imageView = new ImageView(new Image(getClass().getResourceAsStream("/images/space.jpg")));

      // root في الكائن imageView هنا قمنا بإضافة الكائن
      root.setContent(imageView);

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

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

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

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

      }

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

      }

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

طريقة عرض صورة بدخل ScrollPane


•ببطئ قم بتصغير حجم النافذة بواسطة الفأرة لترى كيف سيتم إظهار شريط تمرير عند الحاجة ( ScrollBar ) حتى تظل قادراً على رؤية كل محتوى النافذة مهما كان حجمها.

كورس تعلم javaFX ب اللغة العربية 


تعديل المقال
الأقسام

مقالات قد تهمك