السلام عليكم
في هذا الدرس سنستعرض إن شاء الله ملف تشفيل مشروع السيلفر ونحاول ان نفهم بعض الأمور المتعلقة به
بداية أحب أن أقول أنني لن أضع صور أو أفكار حول تركيب السيلفر لايت الداخلي وتواصل مكوناته لأن هذا لا يعنيني كثيرا
المهم الفكرة كما بأول درس
1- جافا سكريبت
2- زامل ( WPF )
3- أجاكس ( جافا سكريبت و XML )
4- مكتبة دوت نت ضخمة
5- أدوات ملحقة
1 و 3 مسؤولة عن التأثيرات الظاهرة امامنا ( الأحداث ) مثل حركة الماوس والنقر به واتصالها بالسيرفر
2 مسؤولة عن UI ( User Interface ) الشكل الظاهر
4 الإجراءات على الخادم
5 عرض الفيديو ، التعامل مع الصور تحميل البيانات .......
__________________________________________________________________________
__________________________________________________________________________
هناك عدة ملفات بالمشروع وسنحاول ان نفتح الملف
Silverlight.js
ستجد به اصدار بيئة تطوير السيلفر الحالية
انواع المتصفحات المدعومة ليفحصها أول
صورة السيلفر للمتصفحات الغير متوفر بها مشغل ورابط المشغل
وأمور لا تعنينا على الإطلاق
ولا داعي للتعديل عليها او حتى النظر لها
ثاني ملف وهو Scene.xaml مع كود الجافا سكريبت الخاص به وباحداثه سنعود له لاحقا ان شاء الله لان كل عملنا عليه
أهم ملف بكل العمل في النهاية هو الصفحة التي ستعرض أمام المستخدم وهي Default.Html
لنجرب أن ننظر لها ونرى ما بها
كود:
<div id="SilverlightPlugInHost">
<script type="text/javascript">
createSilverlight();
</script>
</div>
سكريبت جافا سكريبت يستدعي دالة باسم createSilverlight
الأمر جميل وبسيط وهذه الدالة بها كل ما يلزم
لنجرب أن نفتح الدالة ونرى ما بها
كود:
function createSilverlight()
{
var scene = new FirstLesson.Scene();
Silverlight.createObjectEx({
source: 'Scene.xaml',
parentElement: document.getElementById('SilverlightPlugInHost'),
id: 'SilverlightPlugIn',
properties: {
width: '400',
height: '400',
background:'#ffffff',
isWindowless: 'false',
version: '1.0'
},
events: {
onError: null,
onLoad: Silverlight.createDelegate(scene, scene.handleLoad)
},
context: null
});
}
الدالة بملف الجافا سكريبت الخلفي للصفحة
بها كلام بسيط
لنحاول ان نحلله
أول شي مصدر ملف الزامل
source: 'Scene.xaml',
ثم الديف الحاوي له
ثم المعرف الفريد الخاص بكائن السيلفر
id: 'SilverlightPlugIn
وبعدها الخصائص
الطول والعرض واللون والخلفية والإصدار وثم الشيء الجميل وهي الأحداث
events: {
onError: null,
عند حدوث خطأ
onLoad
عند بدء التحميل
بصفة عامة أمور جديدة ولا يجب حفظها لانها مكتوبة دائما
وايضا كل خاصية ساشرحها في الوقت الذي سنحتاجها عنده ان شاء الله
ولكن أليست مكونات السيلفر لايت بالنهاية كائن يظهر في الصفحة
وله خصائص أحيانا ما يلزمنا التعامل بها
كالفلاش مثلا
إذن هناك صيغة أخرى يجب أن تكون مشابهة للفلاش
ارجع للصفحة الرئيسية Default.HTML
امسح
كود:
<script type="text/javascript">
createSilverlight();
</script>
واستبدلها ب
كود:
<object
type=”application/x-silverlight”
id=”silverlight1”
width=”350”
height=”350”>
<param name=”background” value=”#ffebcd” />
<param name=”enableFramerateCounter” value=”true” />
<param name=”enableHtmlAccess” value=”true” />
<param name=”initParams” value=”paramValue1, paramValue2” />
<param name=”maxFrameRate” value=”30” />
<param name=”onError” value=”myErrorHandler” />
<param name=”onLoad” value=”onLoad” />
<param name=”source” value=”HelloSilverlight.xaml” />
<param name=”windowless” value=”true” />
<p>يرجى تحميل مشغل السيلفر من هذا الرابط <a> </a></p>
</object>
كائن معتاد وبالوسيطات المرسلة له ، هي نفس الوسيطات المرسلة في الجافا سكريبت بالاعلى
قم بالنظر للخصائص ستجد خصائص معتادة نفس الخصائص السابفة ولكن بصيغة أخرى
لاحظ انني وضعت وسوم معتادة مثل <p>يرجى تحميل مشغل السيلفر من هذا الرابط <a> الرابط من هنا </a>href=''</p>
هذه الوسوم تظهر للمستعرض الذي لا يحتوي على مشغل السيلفر لايت وكما ترى فهي مفيدة ولك حرية الكتابة .
إذا كانت صفحتك ستفتح على متصفخ مثل سفاري فيفضل استخدام الوسم embed لان المتصفح لا يدعم الوسم Object
كود:
<embed
type=”application/x-silverlight”
id=”silverlight1”
width=”350”
height=”350”
background=”#ffebcd”
enableFramerateCounter=”true”
enableHtmlAccess=”true”
initParams=”paramValue1, paramValue2”
maxFrameRate=”30”
OnError=”myErrorHandler”
OnLoad=”onLoad”
source=”HelloWorld.xaml”
windowless=”false”
/>
على العموم
استخدم دائما دالة الجافا سكريبت لتتفادى الكثير من الأخطاء بدلا من الكاائن
source هو اهم خاصية في كائن السيلفر حيث يرمز لملف الزامل الذي سنقوم بعرضه
نستطيع فصل ملف الزامل واستدعاء اسمه
أو نستطيع ان نكتبه مباشرة في الصفحة كالتالي
كود:
<body style=“background:blue“>
<script id=”xaml” type=”text/xaml”>
<Canvas xmlns=”http://schemas.microsoft.com/client/2007”>
<MediaElement Name=”video” Source=”Lake.wmv” Opacity=”0” IsMuted=”true”/>
<Ellipse Width=”100” Height=”100”>
<Ellipse.Fill>
<VideoBrush SourceName=”video”/>
</Ellipse.Fill>
</Ellipse>
<TextBlock FontFamily=”Georgia” Foreground=”Blue” FontStyle=”Italic”
FontSize=”40” Canvas.Left=”125” Canvas.Top=”20” Text=”Great Estates”/>
<TextBlock Foreground=”Blue” Canvas.Left=”110” Canvas.Top=”70”
Text=”Luxurious Living at an Affordable Price”/>
<Path Stroke=”Red” StrokeThickness=”4”>
<Path.Data>
<PathGeometry>
<PathFigure StartPoint=”0,65”>
<ArcSegment SweepDirection=”Clockwise” Size=”2,2” Point=”25,65”/>
<ArcSegment SweepDirection=”Clockwise” Size=”2,2” Point=”50,65”/>
<ArcSegment SweepDirection=”Clockwise” Size=”2,2” Point=”75,65”/>
<ArcSegment SweepDirection=”Clockwise” Size=”2,2” Point=”100,65”/>
<LineSegment Point=”390,65”/>
</PathFigure>
</PathGeometry>
</Path.Data>
</Path>
</Canvas>
</script>
<div id=“placeholder“>
<script type=“text/javascript“>createSilverlight();</script>
</div>
<p style=“font-family:Tahoma; color:white“>
An idyllic new community located high on a hill and offering captivating
waterfront views. Tailored to meet both the needs of upsizing and
downsizing buyers, Great Estates offers custom quality architecture and
design at an affordable price point.
</p>
</body>
شيء رائع ويفوق الوصف يا مايكروسوفت
ما هذه المرونة
والتي لم نرها سابقا
ولكن الان كيف سنحدد المصدر في دالة الاستدعاء ؟؟!!!!
الحل بسيط وهو بارسال # مع المعرف الفريد للسكريبت
كود:
function createSilverlight()
{
Silverlight.createObjectEx(
{
source: “#xaml”,
parentElement: document.getElementById(“placeholder”),
id: “silverlightControl”,
properties:
{ width: “390”, height: “100”, version: “1.0”, background: “Yellow” },
events: {}
}
);
}
حاليا الاصدارات المتاحة من متصفح الفايرفوكس بها شائبة
حيث اذا كانت صفحتك بها تعريف DOCTYPE
فلن يعمل السيلفر لايت الذي بالاعلى ولذلك يتوجب حذف ال DOCTYPE من صفحاتك
الجميل هنا من مايكروسوفت هو دعمها الدائم لمنتجاتها حيث قامت عبر موقع http://streaming.live.com بتوفير استضافة خاصة مجانية للسيلفر لايت
حيث تستطيع رفع اعمالك البسيطة او المتوسطة وعند استدعاء المصدر في الخاصية source تضع مصدر الحساب الذي انشأته وكما قلت فهو مجاني
ماذا عن الاصدار 1.1 لمن بدأ به
اذا كنت عزيزي القارئ تستخدم فيجوال ستوديو 2008 مع نسخة السيلفر 1.1 فدعني أخبرك بالفروقات والتي لن تأثر إطلاقا على عملك
1- دعم اضافي لمزايا WPF والموجودة أساسا في تطبيقات سطح المكتب كالاتصال بقواعد البيانات.
2- دعم إضافي لبعض أنظمة التشغيل وهذا يعني أيضا لبعض أنواع المتصفحات
3- دعم إضافي لبعض مكتبات الدوت نت السابقة .
وكما ترون دعم إضافي .. دعم إضافي
بمعنى أن كل شيء في الإصدار 1.0 سيكون ممكن في 1.1
يكفي للآن وسامحوني على التقصير وان شاء الله المرة القادمة تسعدون أكثر