شرح الكلاس button
الكلاس Button يستخدم لإضافة زر ( Button ) في واجهة المستخدم.
محتوى هذا الزر يمكن أن يكون: نص, أيقونة, نص و أيقونة بجانبه.
بنية الكلاس Button
public class Button extends ButtonBase
كونستركتورات الكلاس Button في javafx
الجدول التالي يحتوي على كونستركتورات الكلاس الـButton.
| الكونستركتور مع تعريفه | |
|---|---|
|
|
public Button(String text)
ينشئ كائن من الكلاس Button يمثل زر عليه نص.مكان الباراميتر text نمرر النص الذي نريد وضعه على الزر. |
|
public Button(String text, Node graphic)
ينشئ كائن من الكلاس Button يمثل زر عليه نص و أيقونة معاً.
|
|
دوال الكلاس Button في جافا fx
الجدول التالي يحتوي على دوال الكلاس Button الأكثر إستخداماً.
الدالة مع تعريفها |
|
|---|---|
|
|
public void setText(String text)
تستخدم لتبديل نص كائن الـ Button الذي قام بإستدعائها.مكان الباراميتر text نضع النص الجديد. |
|
public final void setTextFill(Paint value)تستخدم لتحديد لون نص كائن الـ Button الذي قام بإستدعائها.مكان الباراميتر value نضع كائن من إحدى الكلاسات التي ترث من الكلاس Paint و التي يمكن إستخدامها لتحديد درجة اللون. |
|
public final void setBackground(Background value) تستخدم لوضع لون أو صورة كخلفية لكائن الـ Button الذي قام بإستدعائها.مكان الباراميتر value نضع كائن من الكلاس Background يشير إلى درجة اللون أو الصورة التي سيتم وضعها كخلفية. |
|
public final void setFont(Font newFont)تستخدم لتحديد حجم و نوع خط كائن الـ Button الذي قام بإستدعائها.مكان الباراميتر newFont نضع كائن من الكلاس Font يمثل خصائص الخط الجديد. |
|
public final void setUnderline(boolean value)
تستخدم لوضع خط تحت نص كائن الـ Button الذي قام بإستدعائها.مكان الباراميتر value نضع القيمة true لإظهار خط تحت النص. |
|
public final void setRotate(double degree)
تستخدم لإدارة نص كائن الـ Button الذي قام بإستدعائها.مكان الباراميتر degree نضع رقم يمثل درجة الدوران. |
|
public final void setWrapText(boolean value)
تستخدم لجعل نص كائن الـ Button الذي قام بإستدعائها ينزل على سطر جديد في حال كان لا يسع في سطر واحد.مكان الباراميتر value نضع القيمة true لجعل الأحرف تظهر على سطر جديد عند الحاجة. |
|
public final void setLineSpacing(double value)تستخدم لتحديد المسافة بين كل سطرين في نص كائن الـ Button الذي قام باستدعائها.مكان الباراميتر value نضع رقم يمثل المسافة بين كل سطرين بالـ Pixel. |
|
public final void setPadding(Insets value)تستخدم لإضافة هامش ( مسافة فارغة ) حول نص كائن الـ Button الذي قام باستدعائها.مكان الباراميتر value نضع كائن من الكلاس Insets يمثل حجم الهامش حول النص من كل الجهات. |
|
public final void setScaleX(double value) تستخدم لتمطيط كائن الـ Button الذي قام باستدعائها بشكل أفقي.مكان الباراميتر value نضع رقم يمثل كم مرة سيتم مضاعفة حجمه أفقياً. |
|
public final void setScaleY(double value)تستخدم لتمطيط كائن الـ Button الذي قام باستدعائها بشكل عامودي.مكان الباراميتر value نضع رقم يمثل كم مرة سيتم مضاعفة حجمه عامودياً. |
|
public final void setTranslateX(double vتستخدم لتحديد مكان كائن الـ Button الذي قام باستدعائها أفقياً.مكان الباراميتر value نضع رقم يمثل كم Pixel سيتم إزاحته من اليسار إلى اليمين. |
|
public final void setTranslateY(double value)تستخدم لتحديد مكان كائن الـ Button الذي قام باستدعائها عامودياً.مكان الباراميتر value نضع رقم يمثل كم Pixel سيتم إزاحته من الأعلى إلى الأسفل. |
|
public void setPrefSize(double prefWidth, double prefHeight)تستخدم لتحديد حجم كائن الـ Button الذي قام باستدعائها.
|
|
public final void setContentDisplay(ContentDisplay value)
تستخدم لتحديد مكان ظهور الأيقونة التي تم إضافتها لكائن الـ Button الذي قام باستدعائها.مكان الباراميتر value نضع إحدى ثوابت الكلاس ContentDisplay:
|
|
تستخدم لجعل نص كائن الـ |
|
public final void setOnAction(EventHandler<ActionEvent> e)تستخدم لتنفيذ أوامر معينة عند النقر على كائن الـ Button الذي قام بإستدعائها. |
|
public final void setStyle(String value)
تستخدم لتعديل تصميم الـ Button الذي قام بإستدعائها.مكان الباراميتر value يمكنك تمرير إسم و قيمة أي خاصية تريد تعديلها في كائن الـ Button بأسلوب لغة CSS لإظهاره بالشكل الذي تريده. |
|
أمثلة شاملة في الكلاس button في JavaFX
طريقة إنشاء Button و إضافته في النافذة
المثال التالي يعلمك طريقة إنشاء كائن من الكلاس Button و إضافته في النافذة.
مثال
import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.stage.Stage;
public class Main extends Application {
@Override
public void start(Stage stage) {
// يمثل الزر الذي نريد إضافته في النافذة Button هنا قمنا بإنشاء كائن من الكلاس
Button button = new Button("Simple Button");
// في النافذة button هنا قمنا بتحديد مكان ظهور الكائن
button.setTranslateX(145);
button.setTranslateY(100);
// button هنا قمنا بتحديد حجم الكائن
button.setPrefSize(110, 40);
// في النافذة Root Node لأننا ننوي جعله الـ Group هنا قمنا بإنشاء كائن من الكلاس
Group root = new Group();
// root في الكائن button هنا قمنا بإضافة الكائن
root.getChildren().add(button);
// فيها و تحديد حجمها Node كأول root هنا قمنا بإنشاء محتوى النافذة مع تعيين الكائن
Scene scene = new Scene(root, 400, 250);
// هنا وضعنا عنوان للنافذة
stage.setTitle("JavaFX Button");
// أي وضعنا محتوى النافذة الذي قمنا بإنشائه للنافذة .stage في كائن الـ scene هنا وضعنا كائن الـ
stage.setScene(scene);
// هنا قمنا بإظهار النافذة
stage.show();
}
// هنا قمنا بتشغيل التطبيق
public static void main(String[] args) {
launch(args);
}
}
•ستظهر لك النافذة التالية عند التشغيل.
طريقة تغيير حجم و لون خط الـ Button
المثال التالي يعلمك طريقة تغيير حجم و لون خط الـ Button.
مثال
import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.paint.Color;
import javafx.scene.text.Font;
import javafx.stage.Stage;
public class Main extends Application {
@Override
public void start(Stage stage) {
// يمثل الزر الذي نريد إضافته في النافذة Button هنا قمنا بإنشاء كائن من الكلاس
Button button = new Button("Red Button");
// في النافذة button هنا قمنا بتحديد مكان ظهور الكائن
button.setTranslateX(135);
button.setTranslateY(100);
// button هنا قمنا بتغيير نوع و حجم خط الكائن
button.setFont(new Font("Arial", 20));
// button هنا قمنا بتغيير لون خط الكائن
button.setTextFill(Color.RED);
// في النافذة Root Node لأننا ننوي جعله الـ Group هنا قمنا بإنشاء كائن من الكلاس
Group root = new Group();
// root في الكائن button هنا قمنا بإضافة الكائن
root.getChildren().add(button);
// فيها و تحديد حجمها Node كأول root هنا قمنا بإنشاء محتوى النافذة مع تعيين الكائن
Scene scene = new Scene(root, 400, 250);
// هنا وضعنا عنوان للنافذة
stage.setTitle("JavaFX Button");
// أي وضعنا محتوى النافذة الذي قمنا بإنشائه للنافذة .stage في كائن الـ scene هنا وضعنا كائن الـ
stage.setScene(scene);
// هنا قمنا بإظهار النافذة
stage.show();
}
// هنا قمنا بتشغيل التطبيق
public static void main(String[] args) {
launch(args);
}
}
•ستظهر لك النافذة التالية عند التشغيل.
طريقة تغيير لون خلفية الـ Button
المثال التالي يعلمك طريقة تغيير لون خلفية الـ Button.
مثال
import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.Background;
import javafx.scene.layout.BackgroundFill;
import javafx.scene.layout.CornerRadii;
import javafx.scene.paint.Color;
import javafx.scene.text.Font;
import javafx.stage.Stage;
public class Main extends Application {
@Override
public void start(Stage stage) {
// يمثل الزر الذي نريد إضافته في النافذة Button هنا قمنا بإنشاء كائن من الكلاس
Button button = new Button("Black Button");
// في النافذة button هنا قمنا بتحديد مكان ظهور الكائن
button.setTranslateX(130);
button.setTranslateY(100);
// button هنا قمنا بتغيير نوع و حجم خط الكائن
button.setFont(new Font("Arial", 20));
// button هنا قمنا بتغيير لون خط الكائن
button.setTextFill(Color.CYAN);
// button هنا قمنا بتغيير لون خلفية الكائن
button.setBackground(new Background(new BackgroundFill(Color.BLACK, new CornerRadii(5), Insets.EMPTY)));
// في النافذة Root Node لأننا ننوي جعله الـ Group هنا قمنا بإنشاء كائن من الكلاس
Group root = new Group();
// root في الكائن button هنا قمنا بإضافة الكائن
root.getChildren().add(button);
// فيها و تحديد حجمها Node كأول root هنا قمنا بإنشاء محتوى النافذة مع تعيين الكائن
Scene scene = new Scene(root, 400, 250);
// هنا وضعنا عنوان للنافذة
stage.setTitle("JavaFX Button");
// أي وضعنا محتوى النافذة الذي قمنا بإنشائه للنافذة .stage في كائن الـ scene هنا وضعنا كائن الـ
stage.setScene(scene);
// هنا قمنا بإظهار النافذة
stage.show();
}
// هنا قمنا بتشغيل التطبيق
public static void main(String[] args) {
launch(args);
}
}
•ستظهر لك النافذة التالية عند التشغيل.
طريقة إضافة أيقونة للـ Button مع تحديد مكان ظهورها
المثال التالي يعلمك طريقة إضافة أيقونة للـ Button مع تحديد مكان ظهورها.
ملاحظة: عليك إنشاء مجلد و وضع الأيقونة التي تريد وضعها لكل Button كما في الصورة التالية.
الصورة توضح أننا أضفنا مجلد إسمه images و وضعنا فيه صورة إسمها smily-face.png.
مثال
import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.control.ContentDisplay;
import javafx.scene.control.Button;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.stage.Stage;
public class Main extends Application {
@Override
public void start(Stage stage) {
// يمثل الصورة التي سنضعها كأيقونة Image هنا قمنا بإنشاء كائن من الكلاس
Image image = new Image(getClass().getResourceAsStream("/images/smily-face.png"));
// مع وضع نص و أيقونة لكل كائن منهم Button هنا قمنا بإنشاء 7 كائنات من الكلاس
Button button_1 = new Button("Button 1", new ImageView(image));
Button button_2 = new Button("Button 2", new ImageView(image));
Button button_3 = new Button("Button 3", new ImageView(image));
Button button_4 = new Button("Button 4", new ImageView(image));
Button button_5 = new Button("Button 5", new ImageView(image));
Button button_6 = new Button("Button 6", new ImageView(image));
Button button_7 = new Button("Button 7", new ImageView(image));
// قمنا بإنشائه Button هنا قمنا بتحديد مكان ظهور الأيقونة بالنسبة لكل
button_1.setContentDisplay(ContentDisplay.LEFT); // هنا وضعنا الصورة يسار النص
button_2.setContentDisplay(ContentDisplay.RIGHT); // هنا وضعنا الصورة يمين النص
button_3.setContentDisplay(ContentDisplay.GRAPHIC_ONLY); // هنا قمنا بإظهار الصورة فقط
button_4.setContentDisplay(ContentDisplay.TOP); // هنا وضعنا الصورة فوق النص
button_5.setContentDisplay(ContentDisplay.BOTTOM); // هنا وضعنا الصورة تحت النص
button_6.setContentDisplay(ContentDisplay.CENTER); // هنا وضعنا النص على الصورة
button_7.setContentDisplay(ContentDisplay.TEXT_ONLY); // هنا بإظهار النص فقط
// في النافذة button_1 هنا قمنا بتحديد مكان ظهور الكائن
button_1.setTranslateX(30);
button_1.setTranslateY(50);
// في النافذة button_2 هنا قمنا بتحديد مكان ظهور الكائن
button_2.setTranslateX(170);
button_2.setTranslateY(50);
// في النافذة button_3 هنا قمنا بتحديد مكان ظهور الكائن
button_3.setTranslateX(310);
button_3.setTranslateY(50);
// في النافذة button_4 هنا قمنا بتحديد مكان ظهور الكائن
button_4.setTranslateX(30);
button_4.setTranslateY(130);
// في النافذة button_5 هنا قمنا بتحديد مكان ظهور الكائن
button_5.setTranslateX(120);
button_5.setTranslateY(130);
// في النافذة button_6 هنا قمنا بتحديد مكان ظهور الكائن
button_6.setTranslateX(210);
button_6.setTranslateY(130);
// في النافذة button_7 هنا قمنا بتحديد مكان ظهور الكائن
button_7.setTranslateX(300);
button_7.setTranslateY(130);
// في النافذة Root Node لأننا ننوي جعله الـ Group هنا قمنا بإنشاء كائن من الكلاس
Group root = new Group();
// root في الكائن Buttons هنا قمنا بإضافة جميع الـ
root.getChildren().add(button_1);
root.getChildren().add(button_2);
root.getChildren().add(button_3);
root.getChildren().add(button_4);
root.getChildren().add(button_5);
root.getChildren().add(button_6);
root.getChildren().add(button_7);
// فيها و تحديد حجمها Node كأول root هنا قمنا بإنشاء محتوى النافذة مع تعيين الكائن
Scene scene = new Scene(root, 400, 250);
// هنا وضعنا عنوان للنافذة
stage.setTitle("JavaFX Button");
// أي وضعنا محتوى النافذة الذي قمنا بإنشائه للنافذة .stage في كائن الـ scene هنا وضعنا كائن الـ
stage.setScene(scene);
// هنا قمنا بإظهار النافذة
stage.show();
}
// هنا قمنا بتشغيل التطبيق
public static void main(String[] args) {
launch(args);
}
}
•ستظهر لك النافذة التالية عند التشغيل.
طريقة تنفيذ أوامر عند تمرير الفأرة فوق الـ Button
المثال التالي يعلمك طريقة تنفيذ أوامر عند تمرير الفأرة فوق الـ Button.
فعلياً, عند تمرير الفأرة فوق الـ Button سيتم إظهار ظل لونه أحمر حوله.
مثال
import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.effect.DropShadow;
import javafx.scene.input.MouseEvent;
import javafx.scene.paint.Color;
import javafx.scene.text.Font;
import javafx.stage.Stage;
public class Main extends Application {
@Override
public void start(Stage stage) {
// يمثل الزر الذي نريد إضافته في النافذة Button هنا قمنا بإنشاء كائن من الكلاس
Button button = new Button("Put the mouse Over Me!");
// في النافذة button هنا قمنا بتحديد مكان ظهور الكائن
button.setTranslateX(90);
button.setTranslateY(110);
// button هنا قمنا بتغيير نوع و حجم خط الكائن
button.setFont(new Font("Arial", 18));
// في النافذة Root Node لأننا ننوي جعله الـ Group هنا قمنا بإنشاء كائن من الكلاس
Group root = new Group();
// root في الكائن button هنا قمنا بإضافة الكائن
root.getChildren().add(button);
// فيها و تحديد حجمها Node كأول root هنا قمنا بإنشاء محتوى النافذة مع تعيين الكائن
Scene scene = new Scene(root, 400, 250);
// هنا وضعنا عنوان للنافذة
stage.setTitle("JavaFX Button");
// أي وضعنا محتوى النافذة الذي قمنا بإنشائه للنافذة .stage في كائن الـ scene هنا وضعنا كائن الـ
stage.setScene(scene);
// هنا قمنا بإظهار النافذة
stage.show();
// يمثل ظل حجمه 10 بيكسل و لونه أحمر DropShadow هنا قمنا بإنشاء كائن من الكلاس
DropShadow shadow = new DropShadow(10, Color.RED);
// button هنا قمنا بتحديد ماذا سيحدث عند تمرير الفأرة فوق الكائن
button.addEventHandler(MouseEvent.MOUSE_ENTERED, (MouseEvent e) -> {
button.setEffect(shadow);
});
// button هنا قمنا بتحديد ماذا سيحدث عند إبعاد الفأرة من فوق الكائن
button.addEventHandler(MouseEvent.MOUSE_EXITED, (MouseEvent e) -> {
button.setEffect(null);
});
}
// هنا قمنا بتشغيل التطبيق
public static void main(String[] args) {
launch(args);
}
}
•ستظهر لك النافذة التالية عند التشغيل.
طريقة تنفيذ أوامر عند النقر على الـ Button
المثال التالي يعلمك طريقة تنفيذ أوامر عند النقر على الـ Button.
فعلياً, عند النقر على الـ Button سيتم إظهار نافذة جديدة.
مثال
import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.stage.Stage;
public class Main extends Application {
@Override
public void start(Stage stage) {
// يمثل الزر الذي نريد إضافته في النافذة Button هنا قمنا بإنشاء كائن من الكلاس
Button button = new Button("Open Window");
// في النافذة button هنا قمنا بتحديد مكان ظهور الكائن
button.setTranslateX(150);
button.setTranslateY(110);
// في النافذة button هنا قمنا بتحديد مكان ظهور الكائن
Stage stage2 = new Stage();
stage2.setTitle("Second Window");
stage2.setMaxWidth(400);
stage2.setMaxHeight(250);
// stage في النافذة Root Node لأننا ننوي جعله الـ Group هنا قمنا بإنشاء كائن من الكلاس
Group root = new Group();
// root في الكائن button هنا قمنا بإضافة الكائن
root.getChildren().add(button);
// فيها و تحديد حجمها Node كأول root مع تعيين الكائن stage هنا قمنا بإنشاء محتوى النافذة
Scene scene = new Scene(root, 400, 250);
// stage هنا وضعنا عنوان للنافذة
stage.setTitle("First Window");
// stage أي وضعنا محتوى النافذة الذي قمنا بإنشائه للنافذة .stage في كائن الـ scene هنا وضعنا كائن الـ
stage.setScene(scene);
// stage هنا قمنا بإظهار النافذة
stage.show();
// button هنا قمنا بتحديد ماذا سيحدث عند النقر على الكائن
button.setOnAction((ActionEvent e) -> {
// عند النقر على الزر سيتم إظهار النافذة الثانية فقط
stage2.show();
});
}
// هنا قمنا بتشغيل التطبيق
public static void main(String[] args) {
launch(args);
}
}
•ستظهر لك النافذة التالية عند التشغيل.
&&&////////////////////&&&/////////////////&&&