مقدمة عن تقنية Silverlight 2 (مترجم ) - نسخة قابلة للطباعة +- منتدى فيجوال بيسك لكل العرب | منتدى المبرمجين العرب (http://vb4arb.com/vb) +-- قسم : قسم لغات البرمجة الاخرى (http://vb4arb.com/vb/forumdisplay.php?fid=4) +--- قسم : قسم البرمجة بتقنية WPF (http://vb4arb.com/vb/forumdisplay.php?fid=86) +--- الموضوع : مقدمة عن تقنية Silverlight 2 (مترجم ) (/showthread.php?tid=5370) |
مقدمة عن تقنية Silverlight 2 (مترجم ) - RaggiTech - 07-10-12 كاتب الموضوع : DreamNet
درس مترجم مهم لكل من يريد القاء أول نظرة على تقنية ميكروسفت Silverlightبسم الله الرحمن الرحيم عناصر الدرس: 1-مقدمة: 2-انشاء مشروع Silverlight 3-التعامل مع عناصر الHTML داخل صفحة وب 4- التخاطب مع برامج وب أخرى 1.4 استقبال رسائل XML عن طريق HTTP 2.4 Silverlight وخدمات الوب وفي الأخير سنرى تطبيق عملي لانشاء شات عادي باستعمال هذه التقنية 1-مقدمة: Silverlight تقنية جديدة ولدت عند ميكروسفت بواسطتها يمكن انشاء تطبيقات وب غنية بالتأثيرات وحتى الألعاب بعض الأمثلة http://www.tafiti.com/ يمنك الحصول أيضا على عدة أمثلة من الموقع الرسمي http://www.silverlight.net Silverlight متوفرة حاليا باصدارين: 1.0 تسمح بانشاء تطبيقات جهة عميل client-side كاملة بالجافاسكريبت 2.0 (سابقا 1.1 ) تم دمج الفريمورك مع CLR يتم تنفيذ فيه كود vb أو سي شارب في هذا الدرس سنستعمل الاصدار 2.0 2-انشاء مشروع Silverlight نفتح مشروع جديد من النوع Silverlight Project سيتم انشاء عدة ملفات مع المشروع Page.xaml يحوي كود xaml للواجهة Page.xaml.cs يحوي كود behind للواجهة المنشئة TestPage.html صفحة تحوي اداة الsilvertlight TestPage.html.js تحوي كود Javascript يسمح بانشاء اداة Silverlight Silverlight.js كود جافا سكريبت أيضا يقوم بالتأكد من تثبيت Silverlight في جهة العميل client 3--التعامل مع عناصر الHTML داخل صفحة وب في هذه الفقرة سنرى كيف نتعامل مع عناصر HTML موجودة على صفحتنا عن طريق الكود المسير من طرف برنامجنا كما رأينا في الفقرة السابقة نقوم بانشاء تطبيق Silverlight وفي الملف TestPage.html نقوم باضافة عناصر HTML لاضافة زر وصندوق نص كود : [color=#000080]<div>[/color] [color=#ff8000]<input type=[COLOR=#0000ff]"text"[/color] id=[color=#0000ff]"name"[/color] />[/COLOR] [color=#ff8000]<input type=[COLOR=#0000ff]"button"[/color] id=[color=#0000ff]"send"[/color] value=[color=#0000ff]"Send"[/color] />[/COLOR] [color=#000080]</div>[/color] كود : [color=#000000][COLOR=#0000bb][/color][color=#007700]public [/color][color=#0000bb]partial [/color][color=#007700]class [/color][color=#0000bb]Page [/color][color=#007700]: [/color][COLOR=#0000bb]Canvas بالكود: كود : [color=#000000][COLOR=#0000bb][/color][color=#007700]public [/color][color=#0000bb]partial [/color][color=#007700]class [/color][color=#0000bb]Page [/color][color=#007700]: [/color][COLOR=#0000bb]Canvas بعد الانتهاء يمكننا ان نشغل الصفحة اما مباشرة أو بالضغط على F5
نكمل في المرة القادمة ان شاء الله مقدمة عن تقنية Silverlight 2 (مترجم ) - RaggiTech - 07-10-12 4- التخاطب مع برامج وب أخرى: كما قلنا فيما سبق فان هذه التقنية تسمح بتنفيذ برامج تحت منصة الدوت نت هذا يعني أننا نستطيع التخاطب مع برامج وب أخرى لكن من الصعب أن نتخاطب مع التطبيقات موجودة على خوادم أخرى مباشرة ومع الكائن HttpWebRequest أسهل طريقة هي المرور بخدمة وب web Service تعمل على نفس الخادم الموجود به تطبيق Silverlight 1.4 استقبال رسائل XML عن طريق HTTP قبل كل شئ ننشئ Blank solution
نضيف تطبيق خدمة وب للمشروع
في ملف Service1.asmx المنشئ نقوم باستبدال الدالة HelloWorld بالتالية
كود : [color=#000000][COLOR=#0000bb][/color][color=#007700][[/color][color=#0000bb]WebMethod[/color][COLOR=#007700]] نضيف للملف web.config من أجل السماح باستعمال الدالة GET على المتصفح واعطائها قيمة وذلك قبل httpHandlers كود : [color=#000000][COLOR=#0000bb] [/color][color=#007700]<[/color][color=#0000bb]webServices[/color][COLOR=#007700]> نقوم بالضعط على F5 لتشغيل الخدمة بادراج المتغير لعنوان الصفحة مثلا http://localhost:50436/Service1.asmx...orld?input=Sky سيتم عرض النتيجة التالية Hello World Sky لقد أكملنا انشاء الخدمة بقي لنا انشاء تطبيقنا silverlight مقدمة عن تقنية Silverlight 2 (مترجم ) - RaggiTech - 07-10-12
اليوم ننشئ تطبيق SilverLight لمشروعنا
كما رأينا في النقطة 2 نقوم باضافة تطبيق Silverlight بعدها نقوم باضافة LABEL نسميه Helloworld مثلا للصفحة Page.xaml من أجل عرض نتيجة خدمة الوب التي سنتصل بها في صفحة الكود Page.xaml.cs نقوم بكتابة الكود اللازم لعرض النتيجة داخل الLABEL عن طريق الHttpRequest كود : [color=#000000][COLOR=#0000bb][/color][color=#007700]public [/color][color=#0000bb]partial [/color][color=#007700]class [/color][color=#0000bb]Page [/color][color=#007700]: [/color][COLOR=#0000bb]Canvas المفروض كل شئ أصبح جاهز لكن ليس بعد , فعند استعراض الصفحة تحدث مشكلة فيعرض لنا النص التالي: اقتباس: [TABLE="width: 100%"] [TR] [TD="class: alt2"]Cross domain calls are not supported by BrowserHttpWebRequest [/TD] [/TR] [/TABLE] لكننا نشغل الخدمة على نفس الخادم المستعمل للSilverlight المشكل حدث لاننا لا نشغلها على نفس المنفذ من أجل حل هذه المشكلة نذهب إلى تطبيق الWeb Service الذي انشأناه بالزر الأيمن نضغط على Add Silverlight Link ونضيف تطبيق الsilverlight الذي أنشاناه بذلك يتم اضافة مرجع لتطبيق الSilverlight داخل خدمة الوب ويقوم بنسخ الصفحة Page.xaml داخل مجلد مشروع خدمة الوب المنشئ ولاننسى أيضا نسخ TestPage.html, TestPage.html.js ايضا الأن نستعرض الملف TestPage.html الموجود حاليا في مجلد خدمة الوب وبذلك يتم تشغيل الصفحة بدون مشاكل في المرة القادمة سنرى طريقة أخرى للتعامل مع خدمات الوب مع تطبيقات Silverlight
|