تعلم JavaFx ..مقال20_ واجهة المستخدم الرسومية _ الكلاس WebView
صفحة 1 من اصل 1 • شاطر
تعلم JavaFx ..مقال20_ واجهة المستخدم الرسومية _ الكلاس WebView
أهلا بكم
الكلاس WebView :
هو عبارة متصفح برمجي مفتوح المصدر يدعم CSS و JavaScript و DOM و HTML5 مضمن كحزمة من حزم javafx بحث تمكن المطورين من تنفيذ المهام التالية في تطبيقات JavaFX الخاصة بك:
إذاً نستخدم هذا الكلاس فقط لحجز مساحة في النافذة بهدف عرض محتوى صفحة ويب بداخلها.
الكلاس WebEngine
يستخدم لرسم صفحة الويب بداخل الـ WebView الذي نضعه واجهة المستخدم و يفعل كل المهام التي يفعلها المتصفح العادي. فهو يدعم تفاعل المستخدم مثل التنقل في الارتباطات وإرسال نماذج HTML ، كما يضيف شريط تمرير (Scroll Bar) بشكل تلقائي عند الحاجة. كما أنه يتيح لك التحكم بطريقة ظهور شريط التمرير.
كيفية فتح صفحة ويب باستخدام WebView
1_إستيراد الحزمة web ومنها تحديد الكلاس WebView و الكلاس WebEngine
2_إنشاء كائن جديد من الكلاس WebView و اضافتها للنافذة
3_إنشاء كائن WebEngine على النحو التالى :
4_تمرير صفحة الويبب المراد فتحها على النحو التالى :
و الشفرة الكاملة لفتح صفحة ويب على النحو التالى :
و النتيجة على النحو التالى :
طريقة فتح صفحة ويب بداخل WebView عند النقر على Hyperlink
لمثال التالي يعلمك طريقة فتح صفحة ويب بداخل WebView عند النقر على Hyperlink.
ملاحظة: عليك إنشاء مجلد و وضع الأيقونات التي تريد وضعها لكل Hyperlink كما في الصورة التالية.
الصورة توضح أننا أضفنا مجلد إسمه images و وضعنا فيه أربع صور.
النتيجة على النحو التالى :
الكلاس WebView :
هو عبارة متصفح برمجي مفتوح المصدر يدعم CSS و JavaScript و DOM و HTML5 مضمن كحزمة من حزم javafx بحث تمكن المطورين من تنفيذ المهام التالية في تطبيقات JavaFX الخاصة بك:
- فتح صفحات الويب HTML من عناوين URL المحلية والبعيدة
- تنفيذ أوامر JavaScript
- إدارة النوافذ المنبثقة على شبكة الإنترنت
- تطبيق التأثيرات على المتصفح المضمن
- تشغيل الوسائط
- دعم ميزات لغة HTML5
إذاً نستخدم هذا الكلاس فقط لحجز مساحة في النافذة بهدف عرض محتوى صفحة ويب بداخلها.
الكلاس WebEngine
يستخدم لرسم صفحة الويب بداخل الـ WebView الذي نضعه واجهة المستخدم و يفعل كل المهام التي يفعلها المتصفح العادي. فهو يدعم تفاعل المستخدم مثل التنقل في الارتباطات وإرسال نماذج HTML ، كما يضيف شريط تمرير (Scroll Bar) بشكل تلقائي عند الحاجة. كما أنه يتيح لك التحكم بطريقة ظهور شريط التمرير.
كيفية فتح صفحة ويب باستخدام WebView
1_إستيراد الحزمة web ومنها تحديد الكلاس WebView و الكلاس WebEngine
- الكود:
import javafx.scene.web.WebEngine;
import javafx.scene.web.WebView;
2_إنشاء كائن جديد من الكلاس WebView و اضافتها للنافذة
- الكود:
WebView browser = new WebView();
3_إنشاء كائن WebEngine على النحو التالى :
- الكود:
WebEngine webEngine = browser.getEngine();
4_تمرير صفحة الويبب المراد فتحها على النحو التالى :
- الكود:
webEngine.load("http://eclipse.com");
و الشفرة الكاملة لفتح صفحة ويب على النحو التالى :
- الكود:
import javafx.application.Application;
import javafx.collections.ObservableList;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.web.WebEngine;
import javafx.scene.web.WebView;
import javafx.stage.Stage;
public class JavaFX7 extends Application {
@Override
public void start(Stage primaryStage) {
WebView browser = new WebView();
WebEngine webEngine = browser.getEngine();
webEngine.load("http://google.com");
Group root = new Group();
ObservableList list = root.getChildren();
list.add(browser);
Scene scene = new Scene(root, 300, 250);
primaryStage.setTitle("Hello World!");
primaryStage.setScene(scene);
primaryStage.show();
}
public static void main(String[] args) {
launch(args);
}
}
و النتيجة على النحو التالى :
طريقة فتح صفحة ويب بداخل WebView عند النقر على Hyperlink
لمثال التالي يعلمك طريقة فتح صفحة ويب بداخل WebView عند النقر على Hyperlink.
ملاحظة: عليك إنشاء مجلد و وضع الأيقونات التي تريد وضعها لكل Hyperlink كما في الصورة التالية.
الصورة توضح أننا أضفنا مجلد إسمه images و وضعنا فيه أربع صور.
- الكود:
import javafx.application.Application;
import javafx.collections.ObservableList;
import javafx.event.ActionEvent;
import javafx.geometry.Pos;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.control.ContentDisplay;
import javafx.scene.control.Hyperlink;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.paint.Color;
import javafx.scene.text.Font;
import javafx.scene.web.WebEngine;
import javafx.scene.web.WebView;
import javafx.stage.Stage;
public class Main extends Application {
@Override
public void start(Stage stage) {
// يمثلون الصور التي سنضعها كأيقونات للروابط Image هنا قمنا بإنشاء 4 كائنات من الكلاس
Image image_1 = new Image(getClass().getResourceAsStream("/images/google.png"));
Image image_2 = new Image(getClass().getResourceAsStream("/images/youtube.png"));
Image image_3 = new Image(getClass().getResourceAsStream("/images/facebook.png"));
Image image_4 = new Image(getClass().getResourceAsStream("/images/twitter.png"));
// يمثلون الروابط التي نريد إضافتها في النافذة Hyperlink هنا قمنا بإنشاء 4 كائنات من الكلاس
// نص و بجانبه أيقونة hyperlink وضعنا لكل كائن
Hyperlink link_1 = new Hyperlink("جوجل", new ImageView(image_1));
Hyperlink link_2 = new Hyperlink("يوتيوب", new ImageView(image_2));
Hyperlink link_3 = new Hyperlink("فيسبوك", new ImageView(image_3));
Hyperlink link_4 = new Hyperlink("تويتر", new ImageView(image_4));
// لأننا سنستخدمه لتحديد المكان الذي سنعرض فيه صفحات الويب في النافذة WebView هنا قمنا بإنشاء كائن من الكلاس
// و بالتالي أصبحنا نستطيع رسم محتوى أي صفحة ويب بداخل النافذة بواسطة هذا الكائن
// WebEngine في كائن من الكلاس webView بعدها قمنا بتخزين نوع محرك الويب الذي سيستخدمه الـ
WebView webView = new WebView();
WebEngine webEngine = webView.getEngine();
// هنا جعلنا الأيقونات التي وضعناها للروابط تظهر من ناحية اليمين
link_1.setContentDisplay(ContentDisplay.RIGHT);
link_2.setContentDisplay(ContentDisplay.RIGHT);
link_3.setContentDisplay(ContentDisplay.RIGHT);
link_4.setContentDisplay(ContentDisplay.RIGHT);
// هنا قمنا بتحديد مكان ظهور الأشياء التي سنضيفها في النافذة
link_1.setTranslateX(456);
link_1.setTranslateY(10);
link_2.setTranslateX(312);
link_2.setTranslateY(10);
link_3.setTranslateX(168);
link_3.setTranslateY(10);
link_4.setTranslateX(24);
link_4.setTranslateY(10);
webView.setTranslateX(0);
webView.setTranslateY(60);
// هنا قمنا بتحديد حجم الأشياء التي سنضيفها في النافذة
link_1.setPrefSize(120, 34);
link_2.setPrefSize(120, 34);
link_3.setPrefSize(120, 34);
link_4.setPrefSize(120, 34);
webView.setPrefSize(600, 440);
// hyperlink هنا قمنا بإخفاء الخط الذي يظهر بشكل إفتراضي عند تمرير الفأرة فوق أي كائن
link_1.setUnderline(false);
link_2.setUnderline(false);
link_3.setUnderline(false);
link_4.setUnderline(false);
// hyperlink هنا قمنا بتغيير نوع و حجم خط كائنات الـ
link_1.setFont(new Font("Tahoma", 16));
link_2.setFont(new Font("Tahoma", 16));
link_3.setFont(new Font("Tahoma", 16));
link_4.setFont(new Font("Tahoma", 16));
// أزرق فاتح hyperlink هنا جعلنا لون خط كائنات الـ
link_1.setTextFill(Color.DARKCYAN);
link_2.setTextFill(Color.DARKCYAN);
link_3.setTextFill(Color.DARKCYAN);
link_4.setTextFill(Color.DARKCYAN);
// يظهر من ناحي اليمين hyperlink هنا جعلنا نص كائنات الـ
link_1.setAlignment(Pos.CENTER_RIGHT);
link_2.setAlignment(Pos.CENTER_RIGHT);
link_3.setAlignment(Pos.CENTER_RIGHT);
link_4.setAlignment(Pos.CENTER_RIGHT);
Group root = new Group();
ObservableList list = root.getChildren();
list.add(link_1);
list.add(link_2);
list.add(link_3);
list.add(link_4);
list.add(webView);
Scene scene = new Scene(root, 600, 500);
// هنا وضعنا عنوان للنافذة
stage.setTitle("JavaFX Hyperlink & WebView");
stage.setScene(scene);
stage.show();
// عند تشغيل التطبيق webView هنا جعلنا موقع جوجل يفتح بشكل تلقائي مكان الـ
webEngine.load("https://google.com");
// link_1 هنا قمنا بتحديد ما سيحدث عند النقر على الكائن
link_1.setOnAction((ActionEvent e) -> {
// webView هنا قلنا أنه سيتم فتح موقع جوجل مكان الـ
webEngine.load("https://google.com");
});
// link_2 هنا قمنا بتحديد ما سيحدث عند النقر على الكائن
link_2.setOnAction((ActionEvent e) -> {
// webView هنا قلنا أنه سيتم فتح موقع يوتيوب مكان الـ
webEngine.load("https://youtube.com");
});
// link_3 هنا قمنا بتحديد ما سيحدث عند النقر على الكائن
link_3.setOnAction((ActionEvent e) -> {
// webView هنا قلنا أنه سيتم فتح موقع فيسبوك مكان الـ
webEngine.load("https://facebook.com");
});
// link_4 هنا قمنا بتحديد ما سيحدث عند النقر على الكائن
link_4.setOnAction((ActionEvent e) -> {
// webView هنا قلنا أنه سيتم فتح موقع تويتر مكان الـ
webEngine.load("https://twitter.com");
});
}
public static void main(String[] args) {
launch(args);
}
}
النتيجة على النحو التالى :
زهراء- ........
- تاريخ التسجيل : 18/02/2011
المساهمات : 438
النقاط : 769
التقيم : 67
الدولة :
الجنس :
رد: تعلم JavaFx ..مقال20_ واجهة المستخدم الرسومية _ الكلاس WebView
تحياتى و تقديرى لجهودك المخلصة لاثراء المحتوي العرب بالمقالات التقنية
ـــــــــــــــــــ التوقيع ــــــــــــــــــــ
NEXT- الادارة
- تاريخ التسجيل : 18/02/2011
المساهمات : 446
النقاط : 200660
التقيم : 28
الدولة :
الجنس :
رد: تعلم JavaFx ..مقال20_ واجهة المستخدم الرسومية _ الكلاس WebView
الله يوفك و يجزكي خير
ـــــــــــــــــــ التوقيع ــــــــــــــــــــ
سبحان الله وبحمدة .....سبحان الله العظيم
رد: تعلم JavaFx ..مقال20_ واجهة المستخدم الرسومية _ الكلاس WebView
شكرا لمروركم الكرام @أحمد مناع [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]
زهراء- ........
- تاريخ التسجيل : 18/02/2011
المساهمات : 438
النقاط : 769
التقيم : 67
الدولة :
الجنس :
| |
صفحة 1 من اصل 1
صلاحيات هذا المنتدى:
لاتستطيع الرد على المواضيع في هذا المنتدى
الثلاثاء مارس 26, 2024 6:26 pm من طرف moslema_r
» شركة تنظيف استراحات بالرياض
الأحد مارس 24, 2024 10:49 pm من طرف moslema_r
» كشف تسربات المياه في جدة
السبت مارس 23, 2024 7:23 pm من طرف gmalnagy
» خدمات كشف تسربات المياه بخصم 25% - اتصل الان
السبت مارس 23, 2024 7:22 pm من طرف gmalnagy
» شركة تنظيف ثريات بالرياض
الخميس مارس 21, 2024 7:23 pm من طرف moslema_r
» كهربائي منازل بالرياض
الأحد مارس 17, 2024 1:52 pm من طرف رانيا حماد
» افضل شركة نقل عفش بالرياض نقل باكستاني 40% خصم | موقع الانوار
الأحد مارس 17, 2024 1:25 pm من طرف رانيا حماد
» افضل معلم جبس بالرياض تركيب جبس بورد بالرياض 20% خصم اتصل الآن
الأحد مارس 17, 2024 1:09 pm من طرف رانيا حماد
» شراء اثاث مستعمل بالكويت بخصم 30%
الأحد مارس 17, 2024 12:54 pm من طرف رانيا حماد
» افضل فني كهربائي منازل بالرياض جودة 100% | اتصل الآن
الأحد مارس 17, 2024 12:36 pm من طرف رانيا حماد