بسم ميحرلا نمحرلا هللا

Entity Framework with WPF

بمكوناتاها واالنتقال تدريجيا من موضوع آلخر، ولكن WPFسلسلة تبدأكان من المفترض أن هي تلك نظرا لكون أكثر البرامج تطبيقا

WPFاللي تتعامل مع قواعد البيانات، فقد جاء هذا الدرس، حيث سنعالج أكثر المشاكل التي تنتج عن برامج قواعد البيانات، ولبيان أهيمة

بأجمل وأقوى لتطوير مشاريع مهما كانت، WPF، وهو ما سوف يحفزك عزيزي القارىء إلى االنتقال إلى بيئة في بناء تطبيقات كهذه

!!.وبأقل سطور كود ممكنة كما سنالحظ في مثالنا الحالي حيث سيتم اختصار الكود المكتوب إلى ما دون العشرة أسطر أسلوب،

، ولكي يتناسب محتوى المقال مع عنوانه، سوف نقوم بإنشاء WPFمع في واقع األمر هناك عدة منهجيات لعمل تطبيقات قواعد البيانات

ميزات، وإذا مررنا على أحد المفاهيم الجديدة، فسوف يأتي شرحها الحقا في المقاالت القادمة إن من WPFتطبيق بأحدث ما تقدمه لنا

، سوف نقوم بعمل المراحل واإلستفادة منه قدر اإلمكان. شاء هللا تعالى، فكل ما يهمنا حاليا هو بناء التطبيق الذي يتعامل مع قاعدة البيانات

:التالية إلتمام المشروع

.عدة البيانات الخاصة بناتصميم قا .1

.Entity Framework Modelإنشاء طبقة التعامل مع قاعدة البيانات، جديد، و WPFإنشاء مشروع .2

.إختبار المشروع .3

:تصميم قاعدة البيانات. 1

لإلستفادة من ، ونربط بينهما [Product]و [ Category]جدولينونقوم بعمل [Shop]قاعدة بيانات جديدة ونسميها سوف نقوم بعمل

كمفتاح [ Id]، بعد عمل قاعدة البيانات الجديدة، نقوم بتصميم الجداول كالشكل التالي، مراعاة وضع حقل موضوع الربط بين الجداول

في الجدولين، ليصبح لدينا [Yes]إلى [Column Properties]ضمن نافذة [ IsIdentity]، ووضع خاصيته [Primary Key]رئيسي

:الشكل التالي

التابع للجدول االخر [ CategoryId]يحوي على حقل [ Product]واألن نقوم بإنشاء العالقة بينهما، حيث نالحظ أن جدول

[Category]حاليا العالقة افتراضية فقط، لذلك سوف نقوم بالربط كالتالي ،:

، تظهر [...RelationShips]الرابع لقائمة الخيار، ونختار من ا[Product]نقوم بالضغط بالزر اإليمن على مساحة فارغة بجوار جدول

إلضافة عالقة جديدة، فتظهر لدينا بعض المعلومات في النافذة التي تحوي خصائص [ Add]واجهة صغير فارغة نقوم بالضغط على زر

ليه، األن نقوم بتحديد ، نضغظ ع[...]بجانبة يظهر زر [ Tables And Columns Specifications]العالقة هناك الحقل الثاني يسمى

:جدول العالقة الرئيسي وحقله، وتحديد جدول العالقة الثانوي وحقله كالتالي

، نقوم بفتحة فنجد [INSERT And UPDATE Specification]نضغط على موافق، لنعود للواجهة السابقة، نجد حقل بالخصائص اسمة

ونضعها [ Delete Rule]، نقوم بتحديد قيمة الخيار االول [Update Rule]والثاني [ Delete Rule]هناك خياران االول

[Cascade]لكي تتم عمليات المسح بالتوافق ،.

، ونقوم بحفظ العمل لالنتقال إلى المرحلة ][نضغط على زر . هكذا يكون لدينا قاعدة بيانات عالئقية مربوطة مع بعضها بشكل منطقي

.الثانية

:جديد WPFإنشاء مشروع . 2، [Wpf Application]ونوع المشروع [ #Visual C]ونختار نوع اللغة [ File> New> Project]ونعمل [ Visual Studio]قوم بفتح ن

.، ثم نضغط على موافق[EntityFrameworkWithWPF]نقوم بتسمية المشروع

، ][لى مشروعنا، وبالطبع هذه الطبقة هي إ[ Data Access Layer]األن سوف نقوم بجزء مهم من العمل وهو إضافة طبقة البيانات

ADO.NET]، ونختار [Add New Item]لذلك نقوم بإضافة عنصر جديد للمشروع . الذي سيقدم لنا خدمات مميزة للتعامل مع البيانات

Entity Framework Model .] ونقوم بتسميه[Shop].

أوقات ، سوف نقوم بشرح النوعين و[Generate from database]باختيار ، نقوم [Model]بعدها سوف تظهر لنا نافذة لتحديد نوع

.استخدامهن في المقاالت القادمة بإذن هللا

، وبعدها [...New Connection]، نضغط على ، األن سوف تظهر نافذة أخرى لتحديد االتصال مع قادة البيانات[Next]نضغط على

. ، وثم نختار إسم قاعدة البيانات التي قمت بإنشاءها قبل قليل[Server]وم أوال بإدخال إسم نق. سوف تظهر نافذة اخرى لتحديد االتصال

[.SQLEXPRESS]وبالتالي يصبح لدينا الشكل التالي، بإعتبار أني استخدمت

السابقة والتي تكون قد وبعد التحقق من نجاح االتصال، نضغط على موافق للعودة للنافذة[. OK]يمكننا اختبار االتصال بالضغط على زر

، [Tables: ]، بعدها تظهر لنا نافذة مميزة، تحوي على ثالث عناصر أساسية هي[Next]اخذت إعدادات االتصال الجديد، نضغط على

[Views ]و ،[Stored Procedures and Functions] وهي واضحة المعالم، ما يهمنا حاليا هو أن نختار الجداول التي أنشاءها ،

:ونحدد الجدولين الخاصين بنا كالتالي[ Tables]مسبقا لذلك نفتح الخيار

، بعدها سيظهر لنا الجدولين مربوطين مع ، الخاص بقاعدة البيانات خاصتا[Model]، وننتظر حتى يتم إنشاء [Finish]نضغط على

يمكننا التعديل بما يناسبنا، وهناك العديد من ، او مكان التصميم حيث [Conceptual Model]بعضهما البعض وهذا المكان يسمى

الخيارات يمكننا عملها مع هذا التصيم، مثال يمكننا عمل عالقات وراثة مع الجداول، او تعريف أنواع بيانات جديدة مركبة، كل هذا

.سنشاهده في المقاالت القادمة بإذن هللا

، سوف ننطلق من منهجية بسيطة نوعا مع [WPF]بيق هذا المشروع ضمن كما تحدثنا مسبقا هناك عدة طرق او منهجيات لتط: مالحظة

بسط إلى األعقد باإلضافة لبعض العلم أن هناك طرق أخرى تختصر علينا الكثير العمل وكتابة الكود، ولكننا بحاجة لتسلسل منطقي من األ

.اهالمفاهيم الواجب فهم

اصر لعرض تفاصيل كل عنصر ، لعرض البيانات الحالية ومجموعة من العن[ListBox]األن سوف نقوم تصميم واجهة عمل تتكون من

:سوف تصبح لدينا النافذة كالشكل التالي .على حدة، ومجوعة من األزار للتحكم بالبيانات

.، لهذه النافذة والذي يحوي على بعض المعلومات الهامة جدا، سوف نناقشها بعد قليل[XAML]وإليك عزيزي القارئ كود

<Window x:Class="EntityFrameworkWithWPF.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" WindowStartupLocation="CenterScreen" Title="MainWindow" Height="379.767" Width="441.653" Loaded="Window_Loaded"> <Grid Background="WhiteSmoke"> <Grid.RowDefinitions> <RowDefinition Height="auto"/> <RowDefinition Height="*"/> <RowDefinition Height="auto"/> </Grid.RowDefinitions> <TextBlock Grid.Row="0" Margin="5"> <Run Text="Categories "/> <Hyperlink Name="lnkNew" Click="lnkNew_Click">New</Hyperlink> </TextBlock> <ListBox Grid.Row="1" Name="lstCategories" DisplayMemberPath="Name" SelectionChanged="lstCategories_SelectionChanged"/> <Grid Grid.Row="2" Name="gridDetails" Margin="10" > <Grid.RowDefinitions> <RowDefinition Height="auto"/> <RowDefinition Height="auto"/> <RowDefinition Height="auto"/> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition Width="auto"/> <ColumnDefinition/>

</Grid.ColumnDefinitions> <TextBlock Grid.Row="0" Grid.Column="0" Text="ID: " Margin="5"/> <TextBlock Grid.Row="0" Grid.Column="1" Text="{Binding Path=Id}" Margin="5"/> <TextBlock Grid.Row="1" Grid.Column="0" Text="Name: " Margin="7"/> <TextBox Grid.Row="1" Grid.Column="1" Text="{Binding Path=Name}" Margin="5"/> <StackPanel Grid.Row="2" Grid.Column="1" Orientation="Horizontal" HorizontalAlignment="Right"> <Button Name="btnAdd" Content="Add" Width="75" Margin="5" Click="btnAdd_Click"/> <Button Name="btnUpdate" Content="Update" Width="75" Margin="5" Click="btnUpdate_Click"/> <Button Name="btnDelete" Content="Delete" Width="75" Margin="5" Click="btnDelete_Click"/> </StackPanel> </Grid> </Grid> </Window>

[ Code tags]حيث استخدمت . واعتذر على وضعي الكود بهذه الطريقة المباشرة، ولكن يهمني وضوح النص باأللوان وبالخط العريض

.ما يهمني حاليا األسطر بالخط العريض. ولكنها اعطت تنسيق مختلف للكود

="Name"DisplayMemberPath

قادمة من [ Categories objects]، مع مجموعة من [ListBox]، وفائدتها أننا سنربط الـ [ListBox]نالحظ وجود هذه الخاصية ضمن

لذلك نقوم بتحديد الخاصية المراد عرضها من [ Categories objects]قاعدة البيانات وحيث انه ال توجد طريق معينة لعرض هذه

[.Name]القادمة، لذلك وضعنا القيمة [ Categories objects]ضمن مجوعة

=Id}"Path Binding="{Text

=Name}"Path Binding="{Text

من [ Categories]، حيث نقوم بتحديد نوع النص الذي سيظهر عند تشغيل البرنامج واحضار الـ [WPF]هنا فائدة عظيمة تقدمها لنا

علينا هذه الخاصية الكثير مع عمليات تجميع البيانات وربطها، أو تحويلها من نوع ألخر، ففي أغلب األحيان نقوم قاعدة البيانات، وتوفر

ه مثال لتتناسب مع قاعدة البيانات، هنا ال يوجد داعي ألي من هذ[ double]معين ومن ثم تحويلها إلى [ TextBox]بإحضار قيمة من

الخاصة [ Data Binding]تفهم فهما مبدئيا معنى هذا الحديث، ألن كل هذا سيشرح في مقاالت يكفي أن .األعمال المستهلكة للوقت

.إن شاء هللا تعالى[ WPF]بسلسلة

للمشروع للتأكد من عدم وجود أخطاء معينة، تأتي مرحلة كتابة بعض أسطر الكود إلتمام [ Build]وتعمل , بعد أن تقوم بتعديل كود النافذة

وال ننسى وجود طرق تختصر أيضا الكثير عما سنقوم به حاليا ولكنني . ثت في السابق ليس علينا كتابة الكثير من الكودالعمل، وكما تحد

.سأتركة كما تحدث لبعد الحديث عن عدة مفاهيم

لن تستطيع ، وللعلم[#C]، هنا سنقوم بإدخال بعض أسطر كود [View> Code]للنافذة الحالية من خالل [ #C]نقوم بعرض كود األن

[ XAML]تشغيل البرنامج حتى تضيف كامل هذه االسطر البرمجية، النه سيعطيك بعض األخطاء مثل أن هناك حدث معين معرف ضمن

.، لذلك اضف هذه االسطر أوال [C# code]وال يوجد ضمن

نقوم بتعريف[object ]خاطب مع قاعدة البيانات وإجراء بقة البيانات التي عرفناها مسبقا، وهو ما سيمكننا من التمن نوع ط

:كون التعريف وموقعه لدينا كالتالييوس. العمليات الالزمة

ShopEntities db = new ShopEntities(); public MainWindow() { InitializeComponent();

}

نقوم بإضافة حدث تحميل النافذة[Window_Load] والذي سيقوم بإحضار بيانات ،[Categoies ] من قاعدة البيانات

.وسيكون شكل الحدث كالتالي[ ListBox]وعرضها ضمن

private void Window_Loaded(object sender, RoutedEventArgs e) { db.Categories.Load(); lstCategories.ItemsSource = db.Categories.Local;

}

األن نقوم بإضافة الحدث الخاص بإنشاء[Category ] جديد، ربما يختلف نوع الكود المكتوب عن ما هو متعارف عليه ولكن

.الحظ سهولة العمل في البداية وسيكون كل شيء بخير بعدها

private void lnkNew_Click(object sender, RoutedEventArgs e) { gridDetails.DataContext = new Category(); gridDetails.Children[3].Focus();

}

األن سنقوم بإضافة الحدث الخاص بإضافة العنصر الجديد إلى قاعدة البيانات، وهو الخاص بزر[Add ]وسيكون كالتالي:

private void btnAdd_Click(object sender, RoutedEventArgs e) { Category c = (Category)gridDetails.DataContext; db.Categories.Add(c); db.SaveChanges(); }

األن الحدث الخاص بالتعديل، أي زر[Update]بكل بساطة سيكون كالتالي ،:

private void btnUpdate_Click(object sender, RoutedEventArgs e) { db.SaveChanges();

}

وفي النهاية الحدث الخاص بالحذف، زر[Delete ]سيكون كالتالي:

private void btnDelete_Click(object sender, RoutedEventArgs e) { Category c = (Category)gridDetails.DataContext; if (MessageBox.Show("Do you want to delete " + c.Name + " ?") == MessageBoxResult.OK) { db.Categories.Remove(c); db.SaveChanges(); }

}

[F5]األن بإمكانك تشغيل البرنامج . هكذا نكون انتيهنا من العمل الكامل [ New]لذلك عليك بالضغظ على . ، بالطبع ال يوجد بيانات حاليا

.، وقم بتجريب باقي الخدمات[Add]وادخال إسم العنصر الجديد ومن ثم

:قمت بإدخال ثالث عناصر جديدة إلى قاعدة البيانات، وكانت كالتالي

[ Add]الدخال عنصر جديد ثم [ New]، يمكنك تعديل قيمتة أو حذفها، أو كما تحدثنا الضغط على [ListBox]بعد تحديد عنصر من ال

.لحفظه

، الذي لم نتعامل معه في هذا المثال التوضيحي، وسنقوم [Product]في المرة القادمة إن شاء هللا سنتعلم كيف نتعامل مع الجدول الثاني

:، وكمثال على ذلك[WPF]بعرض بياناتنا الحالية بشكل أفضل بمساعدة أيضا

.، الخاص بقاعدة البيانات[scripts]في األسفل المشروع مع كامل مع

.ولكم أفضل التحية