الكلاس Slider في javafx

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

شرح  الكلاس Slider

الكلاس Slider يستخدم لإضافة Slider في واجهة المستخدم.


بناء الكلاس Slider

public class Slider
extends Control


مصطلحات تقنية Slider

ركز على المصطلحات التالية لأنك ستحتاج معرفتها عند التعامل مع الـ Slider.

javafx slider

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

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

الكونستركتور مع تعريفه
public Slider() ينشئ كائن من الكلاس Slider يمثل Slider قيمته الأولية تساوي 0.0.
public Slider(double min, double max, double value) ينشئ كائن من الكلاس Slider يمثل Slider مع تحديد أصغر و أكبر قيمة فيه, بالإضافة للقيمة الأولية التي ستظهر مختارة فيه.

  • مكان الباراميتر min نضع أصغر قيمة يمكن اختيارها في الـ Slider.

  • مكان الباراميتر max نضع أكبر قيمة يمكن اختيارها في الـ Slider.

  • مكان الباراميتر value نضع القيمة التي نريدها مختارها بشكل إفتراضي في الـ Slider عند تشغيل البرنامج.

دوال الكلاس Slider

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

الدالة مع تعريفها
public final void setMinValue(double value) تستخدم لتحديد أصغر قيمة في كائن الـ Slider الذي قام بإستدعائها.
مكان الباراميتر value نضع القيمة و التي يجب أن تكون منطقياً أصغر من أكبر قيمة يمكن إختيارها.
public final double getMinValue() ترجع أصغر قيمة يمكن إختيارها في كائن الـ Slider الذي قام بإستدعائها.
ترجعها كـ double.
public final void setMax(double value) تستخدم لتحديد أكبر قيمة في كائن الـ Slider الذي قام بإستدعائها.
مكان الباراميتر value نضع القيمة و التي يجب أن تكون منطقياً أكبر من أصغر قيمة يمكن إختيارها.
public final double getMaxValue() ترجع أكبر قيمة يمكن إختيارها في كائن الـ Slider الذي قام بإستدعائها.
ترجعها كـ double.
public final void setValue(double value) تستخدم لتحديد قيمة كائن الـ Slider الذي قام بإستدعائها.
مكان الباراميتر value نضع القيمة الجديدة و التي يجب أن تكون بين أصغر و أكبر قيمة يمكن أن يحتويها كائن الـ Slider.
public final double getValue() ترجع قيمة كائن الـ Slider الذي قام بإستدعائها كرقم نوعه double.
public final void setShowTickLabels(boolean value) تستخدم لإظهار أو إخفاء قيم الـ Major Ticks في كائن الـ Slider الذي قام باستدعائها.
مكان الباراميتر value نضع true إذا أردنا جعل قيم الـ Major Ticks ظاهرة. و نضع false في حال أردنا إخفائهم.
public final void setShowTickMarks(boolean value) تستخدم لإظهار أو إخفاء خطوط الـ Major Ticks و الـ Minor Ticks في كائن الـ Slider الذي قام باستدعائها.
مكان الباراميتر value نضع true إذا أردنا جعل خطوط الـ Major Ticks و الـ Minor Ticks ظاهرة. و نضع false في حال أردنا إخفائهم.
public final void setMajorTickUnit(double value) تستخدم لتحديد فارق القيمة بين الـ Major Ticks في كائن الـ Slider الذي قام باستدعائها.
مكان الباراميتر value نضع رقم أكبر من صفر و يجب أن لا خارج عن المنطق.
فمثلاً, إذا كانت أصغر قيمة في الـ Slider هي 1 و أكبر قيمة فيه هي 10. يجب أن تضع مكان الباراميتر value رقم بين هذا المدى 0 > value < 10 حتى تظهر الـ Major Ticks.
public final void setMinorTickCount(double value) تستخدم لتحديد فارق القيمة بين الـ Minor Ticks في كائن الـ Slider الذي قام باستدعائها.
مكان الباراميتر value نضع رقم أكبر من صفر و يجب أن لا خارج عن المنطق.
فمثلاً, إذا كانت أصغر قيمة في الـ Slider هي 1 و أكبر قيمة فيه هي 10. يجب أن تضع مكان الباراميتر value رقم بين هذا المدى 0 > value < 10 حتى تظهر الـ Minor Ticks.
public final void setBlockIncrement(double value) تستخدم لتحديد كم وحدة سيتم زيادة أو إنقاص قيمة كائن الـ Slider الذي قام باستدعائها في حال قام المستخدم بتغيير قيمته بالنقر على الأسهم ⯅ ⯆ ⯈ ⯇ الموجودة في لوحدة المفاتيح.
مكان الباراميتر value نضع رقم أكبر من صفر و بين أصغر و أكبر قيمة موجودة في الـ Slider.
public final DoubleProperty valueProperty() ترجع كائن من الكلاس DoubleProperty يحتوي على قيمة كائن الـ Slider الذي قام بإستدعائها.
بناءاً على الكائن الذي ترجعه هذه الدالة يمكنك إستدعاء دالة إسمها addListener() لتحدد ما سيحدث عند تغيير قيمة الـ Slider.
لا تقلق إذا لم تفهم المقصود لأننا وضعنا مثال حول هذا الأمر.
public final void setTranslateX(double value) تستخدم لتحديد مكان كائن الـ Slider الذي قام باستدعائها أفقياً.
مكان الباراميتر value نضع رقم يمثل كم Pixel سيتم إزاحته من اليسار إلى اليمين.
public final void setTranslateY(double value) تستخدم لتحديد مكان كائن الـ Slider الذي قام باستدعائها عامودياً.
مكان الباراميتر value نضع رقم يمثل كم Pixel سيتم إزاحته من الأعلى إلى الأسفل.
public void setPrefSize(double prefWidth, double prefHeight) تستخدم لتحديد حجم كائن الـ Slider الذي قام باستدعائها.

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

  • مكان الباراميتر prefHeight نضع رقم يمثل طول الـ Slider بالـ Pixel.
public final void setDisable(boolean value) تستخدم لجعل نص كائن الـ Slider الذي قام باستدعائها يبدو غير مفعّل, أي يصبح لونه باهتاً و غير قابل للنقر عليه.
مكان الباراميتر value نضع القيمة true لجعله غير مفعّل.
public final void setStyle(String value) تستخدم لتعديل تصميم كائن الـ Slider الذي قام بإستدعائها.
مكان الباراميتر value يمكنك تمرير إسم و قيمة أي خاصية تريد تعديلها في كائن الـ Slider بأسلوب لغة CSS لإظهاره بالشكل الذي تريده.

أمثلة شاملة في Slider


 طريقة إنشاء كائن من الكلاس Slider و إضافته في النافذة

المثال التالي يعلمك طريقة إنشاء كائن من الكلاس Slider و إضافته في النافذة.

مثال

Main.java 
      import javafx.application.Application;
      import javafx.scene.Group;
      import javafx.scene.Scene;
      import javafx.scene.control.Slider;
      import javafx.stage.Stage;

      public class Main extends Application {

      @Override
      public void start(Stage stage) {

      // الذي نريد إضافته في النافذة Slider  يمثل الـ Slider هنا قمنا بإنشاء كائن من الكلاس
      Slider slider = new Slider();

      // في النافذة slider هنا قمنا بتحديد مكان ظهور الكائن
      slider.setTranslateX(100);
      slider.setTranslateY(100);

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

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

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

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

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

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

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

      }

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

      }

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

طريقة إنشاء كائن من الكلاس Slider و إضافته في النافذة


 طريقة إنشاء Slider أفقي

المثال التالي يعلمك طريقة إنشاء Slider أفقي مع تحديد أصغر و أكبر قيمة فيه, بالإضافة إلى إظهار خطوط تحته.

مثال

Main.java 
      import javafx.application.Application;
      import javafx.scene.Group;
      import javafx.scene.Scene;
      import javafx.scene.control.Slider;
      import javafx.stage.Stage;

      public class Main extends Application {

      @Override
      public void start(Stage stage) {

      // الذي نريد إضافته في النافذة Slider  يمثل الـ Slider هنا قمنا بإنشاء كائن من الكلاس
      Slider slider = new Slider();

      slider.setMin(0);                  // slider هنا قمنا بتحديد أصغر قيمة في الكائن
      slider.setMax(100);                // slider هنا قمنا بتحديد أكبر قيمة في الكائن
      slider.setValue(40);               // slider هنا قمنا بتحديد القيمة التي ستظهر مختارة بشكل إفتراضي في الكائن
      slider.setShowTickLabels(true);    // slider في الكائن Tick هنا قمنا بإظهار قيمة كل
      slider.setShowTickMarks(true);     // slider في الكائن Tick هنا قمنا بإظهار كل
      slider.setMajorTickUnit(20);       // (Major Tick) سيتم إظهار خط كبير slider هنا حددنا أنه بعد كل 20 وحدة في الكائن
      slider.setMinorTickCount(5);       // (Minor Tick) سيتم إظهار خط صغير slider هنا حددنا أنه بعد كل 5 وحدات في الكائن
      slider.setBlockIncrement(10);      // من الأسهم الموجودة في لوحة المفاتيح سيتم زيادة أو إنقاص 10 في كل نقرة slider هنا حددنا أنه في حال قام المستخدم بتغيير قيمة الكائن

      // في النافذة slider هنا قمنا بتحديد مكان ظهور الكائن
      slider.setTranslateX(100);
      slider.setTranslateY(100);

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

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

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

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

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

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

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

      }

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

      }

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

طريقة إنشاء Slider أفقي


 طريقة إنشاء Slider عامودي 

المثال التالي يعلمك طريقة إنشاء Slider عامودي مع تحديد أصغر و أكبر قيمة فيه, بالإضافة إلى إظهار خطوط بجانبه.

مثال

Main.java 
      import javafx.application.Application;
      import javafx.geometry.Orientation;
      import javafx.scene.Group;
      import javafx.scene.Scene;
      import javafx.scene.control.Slider;
      import javafx.stage.Stage;

      public class Main extends Application {

      @Override
      public void start(Stage stage) {

      // الذي نريد إضافته في النافذة Slider  يمثل الـ Slider هنا قمنا بإنشاء كائن من الكلاس
      Slider slider = new Slider();

      slider.setMin(0);                  // slider هنا قمنا بتحديد أصغر قيمة في الكائن
      slider.setMax(100);                // slider هنا قمنا بتحديد أكبر قيمة في الكائن
      slider.setValue(40);               // slider هنا قمنا بتحديد القيمة التي ستظهر مختارة بشكل إفتراضي في الكائن
      slider.setShowTickLabels(true);    // slider في الكائن Tick هنا قمنا بإظهار قيمة كل
      slider.setShowTickMarks(true);     // slider في الكائن Tick هنا قمنا بإظهار كل
      slider.setMajorTickUnit(20);       // (Major Tick) سيتم إظهار خط كبير slider هنا حددنا أنه بعد كل 20 وحدة في الكائن
      slider.setMinorTickCount(5);       // (Minor Tick) سيتم إظهار خط صغير slider هنا حددنا أنه بعد كل 5 وحدات في الكائن
      slider.setBlockIncrement(10);      // من الأسهم الموجودة في لوحة المفاتيح سيتم زيادة أو إنقاص 10 في كل نقرة slider هنا حددنا أنه في حال قام المستخدم بتغيير قيمة الكائن

      // سيظهر بشكل عامودي عند إضافته في النافذة slider هنا قمنا بتحديد أن الكائن
      slider.setOrientation(Orientation.VERTICAL);

      // في النافذة slider هنا قمنا بتحديد مكان ظهور الكائن
      slider.setTranslateX(190);
      slider.setTranslateY(25);

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

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

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

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

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

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

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

      }

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

      }

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

طريقة إنشاء Slider عامودي


 طريقة تنفيذ أوامر في كل مرة يتم فيها تغيير قيمة الـ Slider

المثال التالي يعلمك طريقة تنفيذ أوامر في كل مرة يتم فيها تغيير قيمة الـ Slider.
في كل مرة يقوم فيها المستخدم بتغيير قيمة الـ Slider سيتم عرضها بداخل TextField.

مثال

Main.java 
      import javafx.application.Application;
      import javafx.beans.value.ObservableValue;
      import javafx.scene.Group;
      import javafx.scene.Scene;
      import javafx.scene.control.Label;
      import javafx.scene.control.Slider;
      import javafx.scene.control.TextField;
      import javafx.stage.Stage;

      public class Main extends Application {

      @Override
      public void start(Stage stage) {

      // هنا قمنا بإنشاء جميع الأشياء التي سنضيفها في النافذة
      Label label = new Label("Selected Value");
      TextField textField = new TextField("0");
      Slider slider = new Slider();

      // slider هنا قمنا بتحديد خصائص الكائن
      slider.setMin(0);                  // slider هنا قمنا بتحديد أصغر قيمة في الكائن
      slider.setMax(100);                // slider هنا قمنا بتحديد أكبر قيمة في الكائن
      slider.setValue(0);                // slider هنا قمنا بتحديد القيمة التي ستظهر مختارة بشكل إفتراضي في الكائن
      slider.setShowTickLabels(true);    // slider في الكائن Tick هنا قمنا بإظهار قيمة كل
      slider.setShowTickMarks(true);     // slider في الكائن Tick هنا قمنا بإظهار كل
      slider.setMajorTickUnit(20);       // (Major Tick) سيتم إظهار خط كبير slider هنا حددنا أنه بعد كل 20 وحدة في الكائن
      slider.setMinorTickCount(5);       // (Minor Tick) سيتم إظهار خط صغير slider هنا حددنا أنه بعد كل 5 وحدات في الكائن
      slider.setBlockIncrement(10);      // من الأسهم الموجودة في لوحة المفاتيح سيتم زيادة أو إنقاص 10 في كل نقرة slider هنا حددنا أنه في حال قام المستخدم بتغيير قيمة الكائن

      // غير قابلة للتعديل بشكل مباشر textField هنا جعلنا قيمة الكائن
      textField.setEditable(false);

      // هنا قمنا بتحديد حجم الأشياء التي سنضيفها في النافذة
      slider.setPrefSize(200, 40);
      label.setPrefSize(100, 20);
      textField.setPrefSize(40, 20);

      // هنا قمنا بتحديد مكان ظهور الأشياء التي سنضيفها في النافذة
      slider.setTranslateX(100);
      slider.setTranslateY(90);
      label.setTranslateX(140);
      label.setTranslateY(170);
      textField.setTranslateX(240);
      textField.setTranslateY(170);

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

      // root هنا قمنا بإضافة جميع الأشياء في الكائن
      root.getChildren().add(slider);
      root.getChildren().add(label);
      root.getChildren().add(textField);

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

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

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

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

      // slider هنا قمنا بتحديد ما سيحدث عند تغيير قيمة الكائن
      slider.valueProperty().addListener(
      (ObservableValue<? extends Number> ov, Number old_val, Number new_val) -> {
      // textField ثم سيتم وضعها كنص للكائن int لقيمة نوعها slider سيتم تحويل قيمة الكائن
      textField.setText(""+new_val.intValue());
      }
      );

      }

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

      }

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

طريقة تنفيذ أوامر في كل مرة يتم فيها تغيير قيمة الـ Slider

افضل موقع  تعلم javaFX

تعديل المقال