• 0
fun

دورة في windows presentation foundation و XAML

سؤال

أولا أرجو الإضطلاع على الموضوع التالي : .net framework 3.0

حسنا بعد قدوم windows vista فالكثير تغير من الواجهة الرسومية

(مع windows presentation foundation ) إلى نظام الملفات المعدل winfs

Windows presentation foundation هو نظام الجرافيكس الجديد المبني كليا على xaml

حسنا ما هو xaml ؟

Xaml هو لغة جديدة مبنية على وسوم xml و إسمها الكامل هو extensible application markup language مهمتها الأساسية وصف الواجهات بنظام declarative programming

Windows presentation foundation يعتمد على api جديدة وموحدة والجذير بالذكر أنها managed أي مبنية ب .net وهو يستعمل كل طاقات حاسوبك الشخصي و قريبا سيعوض windows form و web form ، نظرا للإمكانيات الكبيرة التي يمتلكها في تسهيل التطوير 2D و 3D

يتيح XAML شيئا أخر ، فهو يساعد المصممين على الدخول في تطوير التطبيقات و يحاول تقليص الفارق بين مواقع الويب و برامج WINDOWS

ف XAML يحتوي كغيره من لغات .NET على الأنواع التالية

namespaces

• classes,

• propriétés, خصائص

• تعريف الأحداث ليتم قنصها بلغات الدوت نت الأخرى

أتمنى أن أكون قد أعطيت مقدمة بسطة عن windows presentation foundation و XAML ولكنني أنوه أن الموضوع جديد و أننا إذا طورنا تطبيقات بالإعتماد على wpf الأن فالمستخدمين لن يستخدموها قبل غد

أرى أنكم لاحظتم أنني لم أتحدث عن التطوير ب xaml و سأتطرق إلى هذا في دروس مقبلة

1

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه

47 إجابة على هذا السؤال .

  • 0

الأن سنتعامل مع أداة أخيرة هي listbox

سننشأ أداة جديدة

لاحظ الكود

<Window x:Class="Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="لنجرب تقنيات المستقبل " Height="300" Width="300" xmlns:my="clr-namespace:System;assembly=mscorlib">
<Grid Opacity="1">

<TextBox Margin="135,49,79,0" Name="TextBox1" Height="31" VerticalAlignment="Top">دورة </TextBox>
<Button Height="71" Margin="117,0,48,36" Name="Button1" VerticalAlignment="Bottom" >
<Image Source ="C:\Documents and Settings\All Users\Documents\Mes images\Échantillons d'images\collines.jpg" />
</Button>
<ListBox Height="119" Margin="9,8,0,0" Name="ListBox1" VerticalAlignment="Top" HorizontalAlignment="Left" Width="93">

</ListBox>
</Grid>
</Window>

هاهي النتيجة

gigi4.jpg

سنضيف أشياء جديدة في listbox بإستعمال <listboxitem>

لاحظ الكود

<Window x:Class="Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="لنجرب تقنيات المستقبل " Height="300" Width="300" xmlns:my="clr-namespace:System;assembly=mscorlib">
<Grid Opacity="1">

<TextBox Margin="135,49,79,0" Name="TextBox1" Height="31" VerticalAlignment="Top">دورة </TextBox>
<Button Height="71" Margin="117,0,48,36" Name="Button1" VerticalAlignment="Bottom" >
<Image Source ="C:\Documents and Settings\All Users\Documents\Mes images\Échantillons d'images\collines.jpg" />
</Button>
<ListBox Height="119" Margin="9,8,0,0" Name="ListBox1" VerticalAlignment="Top" HorizontalAlignment="Left" Width="93">
<ListBoxItem>
programmer4fun
</ListBoxItem>
<ListBoxItem>
coding4fun
</ListBoxItem>
<ListBoxItem>
arabteam2000
</ListBoxItem>
<ListBoxItem>
xaml
</ListBoxItem>
<ListBoxItem>
wpf
</ListBoxItem>
<ListBoxItem>
.netframework
</ListBoxItem>
<ListBoxItem>
winvista
</ListBoxItem>

</ListBox>
</Grid>
</Window>

وهاهي النتيجة

gigi5.jpg

أظن أنك فهمت الأن فكرة عمل الأدوات في wpf لذا سأتوقف عن شرحها لأتمكن من توضيح أمور أكثر أهمية

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

حتى الأن لقد رأيت أن wpf ستحقق طفرة في الواجهات الرسومية على ويندوز

لكن ماذا عن تطبيقات الويب ؟

هل ستعمل wpf في تطبيقات الويب عند مستخدمي mac مثلا ؟

إذن فأعلم أن مايكروسوفت طورت wpf/E أي(Windows Presentation Foundation /EveryWhere) وتعمل حتى الأن على PC, Mac, Pocket PC, Smartphone,...

و توجد محاولات لتعمل على linux و solaris

حيث ستعمل هذه التطبيقات على المتصقحات التالية

Opéra, FireFox et Internet Explorer على ويندوز

Safari et FireFox على mac

ولكي تعمل تطبيقاتنا هذه التي ستكون بواجهة ثورية

علينا إنشاء تطبيقات من نوع xaml browser application

ساشرح في المرة القادمة أساسيات Windows Presentation Foundation /EveryWhere

"ملاحظة : سأغيب عن المنتدى غدا وقد أغيب بعد غد لذا أعذروني فإمتحان القيزياء صعب "

تم تعديل بواسطه programmer4fun
0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

جزاك الله موضوع شيق و مفصل الله يبارك فيك

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

موضوعك اكثر من رائع. جزاك الله خيرا

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

موضوعك اكثر من رائع. جزاك الله خيرا

موضوعك اكثر من رائع. جزاك الله خيرا

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

السلام عليكم

WPF /E كنت قد تكلمت عن

فتعال نشاهد هذه الصور عن تطبيقات ويب ثورية

لاحظ الصورة

didi.jpg

هذا تطبيق فيه ساعة بعقارب تتحرك ،هذه الساعة شفافة وهكذا تستطيع رؤية ما يوجد تحتها

هذا تطبيق ثان

لاحظ الصورة

didi2.jpg

هذا تطبيق أقوى حيث يمكنك أن تعمل zoom لهذه الكريات

لاحظنا التطبيقات السابقة

حيث أنها تطبيقات XAML لاتحتاج التثبيت فالتوزيع يعتمد على CLICKONCE

وهذه التطبيقات لتعمل على جهاز العميل يجب :

أن يتوفر على مستعرض ويب داعم

أن يتوفر على WINFX RUNTIME

أما من جانب الأمان فهذه التطبيقات أمنة لذا لن تظهر تحذيرات الأمان المزعجة

الجذير بالذكر أن هذه التطبيقات تستعمل javascript

حسنا لتفهم أفضل إليك هذه الصورة

didi%203.jpg

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

السلام عليكم

حتى الأن لقد ذكرنا مقدمة عن wpf وطورنا تطبيقات بسيطة أيضا

ولكن منذ هذه اللحظة ستبدأ الدورة بالتعمق في wpf ولكن مع ذلك إعذروني لأنني لن أذكر التعامل مع 3D في WPF

أثناء تجوال اليومي بين صفحات الأنترنت وجدت صورة رائعة عن معمارية و هيكلة wpf

راقب الصورة

kiki1.jpg

حسنا كنت قد قلت أن كل تطبيق wpf يحتوي على المصادر أو ressources

وذكرت أن ressources هي :

Styles

Template

Trigres

Storyboards

قد لا تفهم شيئا مما قلته لذا سننشأ تطبيقا جديدا فيه button واحد نبدل الخاصية content فيه إلى arabteam2000

لاحظ الكود

<Window x:Class="Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="لنحترف التقنيات المستقبلية " Height="300" Width="300"
>
<Grid>

<Button Margin="75,96,77,109" Name="Button1" Content="arabteam2000" />

</Grid>
</Window>

لاحظ النتيجة

kiki2.jpg

الأن سنضيف الوسم <Grid.Resources>

في داخل هذا الوسم سنضيف style وهو يبين كيفية ظهور أداتك أي أنه يبدل خصائصها

يحمل كل style الخاصية TargetType التي تحدد نوع الأداة التي سيطبق عليها style

إضافة إلى الخاصية x:Key التي تحدد إسم Style حتى نستعمله في أدواتنا

حسنا كيف تعدل الخصائص من خلال style لذلك سنستعمل الوسم setter داخل style

الجذير بالذكر أن هذا الوسم يحتوي على خاصيتين مهمتين الأولى هي Property ونحدد فيها إسم الخاصية

و الثانية هي Value و نحدد فيها القيمة التي نسندها إليها

قد لا تفهم شيئا من كل هذا لذا لا تكتئب وتابع معي هذا الكود

  <Window x:Class="Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="لنحترف التقنيات المستقبلية " Height="300" Width="300"
>
<Grid>
<Grid.Resources>

<Style TargetType="{x:Type Button}" x:Key="MonStyleDePolice">
<Setter Property="Button.FontStyle" Value="Italic" />
<Setter Property="Button.Foreground" Value="Red" />
</Style>

</Grid.Resources>

<Button Margin="75,96,77,109" Name="Button1" Content="arabteam2000" />

</Grid>
</Window>

ستقولون أظهر النتيجة ولكني سأرد أنه لم يتغير شيء

كيف لم يتغير شيء ؟ إذا لماذا نتعب أنفسنا ؟

انتظر ، فعلينا إضافة الخاصية style في أداتنا ونحدد فيها إسم style الذي سنستعمله

حسنا لاحظ الكود مرة أخرى

<Window x:Class="Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="لنحترف التقنيات المستقبلية " Height="300" Width="300"
>
<Grid>
<Grid.Resources>

<Style TargetType="{x:Type Button}" x:Key="MonStyleDePolice">
<Setter Property="Button.FontStyle" Value="Italic" />
<Setter Property="Button.Foreground" Value="Red" />
</Style>

</Grid.Resources>

<Button Margin="75,96,77,109" Style="{StaticResource MonStyleDePolice}" Name="Button1" Content="arabteam2000" />

</Grid>
</Window>

قبل أن أظهر النتيجة ستقولون عن هذه الخاصية

Style="{StaticResource MonStyleDePolice}"

لماذا نكتب StaticResource ؟

ذلك حتى نحدد أن style الذي عرفناه موجود داخل مصادر تطبيقنا

الأن تفضلوا النتيجة

kiki3.jpg

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

سنتطرق اليوم إلى template

وهو بخلاف style فهو يصف البنية الظاهرية للأداة (أنا متأكد أنك لم تفهم هذا التعبير )

مثلا نريد دائريا . في السابق كان هذا صعبا و لكننا الأن لن نبرمج أداة جديدة بل فقط سنقوم بتصميم template لكي يصبح زرنا دائريا

حسنا لاحظ الكود

<Window x:Class="Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="لنحترف التقنيات المستقبلية " Height="300" Width="300"
>
<Grid>

<Button Margin="45,70,41,83" Name="Button1" Content="arabteam2000" />

</Grid>
</Window>

لقد أنشأنا زرا جديدا

(لاأظن أنك بحاجة لترى النتيجة )

سنعرف template

لاحظ الكود

<Window x:Class="Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="لنحترف التقنيات المستقبلية " Height="300" Width="300"
>
<Grid>
<Grid.Resources>
<ControlTemplate TargetType="{x:Type Button}" x:Key="mutemplate">
<Grid>
<Ellipse Width="135" Height="70" >
<Ellipse.Fill>
<SolidColorBrush Color ="Aqua" />
</Ellipse.Fill>
</Ellipse>
</Grid>
</ControlTemplate>


</Grid.Resources>

<Button Margin="45,70,41,83" Name="Button1" Template="{StaticResource mutemplate}" Content="arabteam2000" />

</Grid>
</Window>

لقد أضفنا الوسم ellipse داخل template لكي يصبح زرنا دائريا

يوجد العديد من الوسوم الأخرى

الأن يمكنك رؤية زرنا الجديد

gogo.jpg

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

شكرا اخي العزيز على هذا الموضوع الرائع الذي كنت احتاجه

ولكن بعض الصور لا تظهر عندي مما يسبب لي مشاكل في متابعة الموضوع بصورة جيدة

والامر الاخر هو انني لا استطيع الحصول على هذه الاشياء:

أولا ستحتاج visual studio 2005 و من الأفضل أن يكون proffesionel لأن express لا يدعم cider

ثانيا ستحتاج إلى winfx runtime و إصدار فبراير 2006 يمكنك تحميله على الرابط التالي

الرابط

ثالثا ستحتاج إلى windows sdk يمكنك تحميل ‘صدار فبراير 2006 على هذا الرابط

رابعا من الأفضل أن تحمل أدوات التطوير ب wpf وهي تشمل cider (xaml designer ) و XAML INTELLISENCE و غيرها رغم أنها لا زالت beta و ستكون مدرجة ضمن orcas

الرابط

وذلك لانني عندما افتح الرابط لا اجد ما يدل على تنزيل اية ملفات

معذرة اخي لمقاطعة حديثك الرائع

وارجو الافادة في امري هذا

وشكرا لك مرة اخرى

اخوك/ محمد رمضان

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

حسنا يبدو أن هنالك مشكلة في المنتدى فأنا رفعت الصور على سيرفر الفريق العربي للبرمجة

بالنسبة للروابط فسأبحث عن روابط أخرى و أوافيكم بها

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

programmer4fun درس جميييييييييل جدا جدا ولم اشاهدة من قبل لقد سلطت الضوء على موضوع

مهم جدا وجميل , ارجو ان تواصل في شرح البقية فلقد اطلق العنان في مخيلتي ... ارجوك اكمل

تحياتي

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

والله تمام يا مان

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

السلام عليكم

جزاك الله خيرا على الموضوع الجميل

ولي استفسار هل يعني هذا انه بالمستقبل نستطيع تصميم واجهه واحده ونستخدمها لتطبيق ويب و تطبيق ويندوز

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

اخي الكريم جزاك الله خيرا على هذا الموضوع القيم لأنه كما اسلفت ستصبح WPF هي عماد البرمجة في بيئة Windows وانا مهتم جدا بتعلم هذه التقنية ولقد استفدت كثيرا مما تطرحه. شكرا اخي العزيز ونتمنى منك مواصلة هذا الجهد الطيب لأننا بأمس الحاجة إلى ما تقدمه.

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

السلام عليكم ورحمة الله وبركاته

جزاك الله ألف ألف خيرا" على هل الموضوع المميز اخي الكريم programmer4fun بصارحة انها المرة الاولى لي في هذا المنتدى الكريم وقد شاهدت الدورة وشدتني اليها واتمنى من الله لك التوفيق والمتابعة بها .

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

جزاك الله خيرا اخى الحبيب

بس انا كان ليا استفسار انا شايف ان كل الاكواد دى عباره عن اكواد تصميم يعنى ممكن اقوم بالتصميم على اكسبريشن ديزاين مثلا ومن ثم استخراج كود xaml ووضعه فى المشروع ثم من اضافه الاكواد التى تقوم بعمل البرنامج

ارجوا النقاش فى مثل هذه النقطه

نقطه اخرى وهى اريد مجموعه من الكتب لل wpf ةلة كان لدين نسخه كامله من هذا البرنامج يرجى وضعها وجزاك الله خيرا

فى انتظار المزيد

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

السلام عليكم

شكرا لك اخي على هذا الموضوع

لكن عندي سؤال هو انه انا رح استعمل wpf في تصميم مواقع انترنت

يعني رح تكون بديله للasp.net

الصراحه انا مافهمت ايش الهدف من هذه التقنيه الجديده

قمت بالبحث في الانترنت ووجدت وجد تقنيه اخرى هي wcf

فانا مش عارف ايش القصد او الهدف منها وايش رح تفرق عن asp.net

وشكرا لك

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

جزاك الله خير يااخي الغالي

اشكرك على عرضك للتقنيات الجديدة بطريقة سهلة جميلة .

اتمنى المزيد من التوفيق لك

اكرر شكري ودعائي

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

لمن يريد نظرة عامة حول تقنية ال WPF هنا درس فيديو + ما تحتاجه للبرمجة بهذه التقنية

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

رأيت الموضوع واجبرنى روعته على شكر صاحبه وبارك الله فيك يا اخى والله

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

شكرا جداااااااااااا على الدروس دى ونرجو المزيد لان الموضوع ده مهم بالنسبه لى فى شغلى وعاوزه اتعلمه

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

السلام عليكم ورحمة لله وبركاته .

مشكووووووووووووووووووور اخي الكريم على هذا التقديم الاكثر من رائع ..

ولكن عندي طلب وهو كيفية الاستفادة من هذه التقنية في تطبيقات الويب

وجزاك الله خير

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه

من فضلك سجل دخول لتتمكن من التعليق

ستتمكن من اضافه تعليقات بعد التسجيل



سجل دخولك الان

  • يستعرض القسم حالياً   0 members

    لا يوجد أعضاء مسجلين يشاهدون هذه الصفحة .