02-10-12, 03:05 PM
كاتب الموضوع : silverlight
التعامل مع الصور Images في بيئة الدوت نت باستخدام +GDI اللغة المستخدمة: الفيجوال بيسك
التطبيق: فيجوال استوديو 2005 و 2008
المستوي: التقييم متروك للقارئ
إعداد: مهندس / عمر أمين إبراهيم
هناك أكثر من أسلوب أو أكثر من طريقة لكي نضيف صورا الي الفورم ومن ثم نعرض هذه الصور داخل الفورم و بعض هذه الطرق يمكن تصنيفها كالتالي:-
الطريقة الأولي: استخدام اسم ملف لصورة ما.
الطريقة الثانية: استخدام Resources الخاصة بالمشروع
الطريقة الثالثة: استخدام ImageList Control
الطريقة الرابعة: استخدام ToBase64String مع MemoryStream
الطريقة الخامسة: استخدام OpenFileDialog
الطريقة السادسة: تعريف الصورة عن طريق Size معين وأيضا من الممكن استخدام PixelFormat ورسمها من الصفر ولقد أعطينا مثالا علي ذلك في المقدمة الخاصة بالمقال
وللمزيد من التفاصيل يمكنكم دراسة Bitmap Class ومعرفة كيفية إنشاء الصورة. أي عليكم دراسة Constructor الخاص بهذا الكلاس
الأن لنوضح كيفية استخدام بعض الطرق أعلاه
الطريقة الأولي:
هذه الطريقة تعتمد علي استخدام اسم الملف ومكانه علي الهارد ديسك
لو أننا بالفعل نعلم مكان الصورة واسم الملف الخاص بالصورة الموجودة علي الهارد ديسك فكل ما علينا عمله هو أن نقوم بتعريف هذه الصورة ومن ثم نقوم بعرضها داخل PictureBox أو من الممكن أن نقوم برسم الصورة بأي مكان داخل الفورم وهذه الطريقة ليست فعالة تماما
والسبب في عدم فعالية هذه الطريقة أننا عندما نقوم بتصميم برنامج ما فإننا لا نصممه لأنفسنا فقط وبما أن الصورة التي نستخدمها موجودة فقط داخل جهاز الكمبيوتر لدينا فإنه سوف يحدث خطأ عند تحميل الصورة وذلك عندما يقوم شخص أخر باستخدام البرنامج علي جهاز الكمبيوتر الخاص به ولكننا سوف نري كيف نستفيد من هذا الأسلوب بفعالية أكثر لاحقا
مثال علي الطريقة الأولي
افتح مشروع جديد ثم عليك إضافة PictureBox إليه ثم اكتب الكود التالي
كود :
Public Class Form1
Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
Dim bmp As Bitmap = New Bitmap("C:\img.gif")
PictureBox1.Image = bmp
End Sub
End Classمثال أخر علي الطريقة الأولي
افتح مشروع جديد ثم عليك إضافة PictureBox و أيضا أضف له باتون ثم اكتب الكود التالي
كود :
Public Class Form1
Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click
Dim bmp As Bitmap = New Bitmap("C:\img.gif")
PictureBox1.Image = bmp
End Sub
End Classإذن كيف نبتعد قليلا عن هذه المشكلة وأقصد هنا مشكلة عدم وجود الملف علي جهازك. ممكن مثلا أن نضع شرطا بحيث انه لو لم تكن الصورة موجودة علي جهاز المستخدم فإنه لا يتم تنفيذ الكود وتظهر رسالة توضح للمستخدم أن الصورة ليست موجودة علي جهازه والكود التالي يوضح ذلك
كود :
Public Class Form1
Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click
Try
Dim bmp As Bitmap = New Bitmap("C:\img.gif")
PictureBox1.Image = bmp
Catch ex As Exception
MessageBox.Show("الصورة المستخدمة غير موجودة علي جهاز الكمبيوتر لديك من فضلك استخدم صورة اخري", "Error", MessageBoxButtons.OK, MessageBoxIcon.Error)
End Try
End Sub
End Classالطريقة الثانية:
تعتمد هذه الطريقة علي إضافة الصور الي Resources الخاصة بالمشروع
وهذه الطريقة أفضل قليلا من الطريقة الأولي وهي ببساطة أننا نضيف الصور الي Resources الخاصة بالمشروع وبالتالي ستكون الصور موجودة مع البرنامج ومن ثم يمكن أن نستخدمها في أي وقت داخل البرنامج الخاص بنا بدون أن يحدث خطأ ولكن علينا أن نضع في حساباتنا شيئا هاما وهو انه كلما أضفنا صورا كثيرة الي Resources المشروع فإن الحجم النهائي للمشروع يكون كبيرا جدا لذلك فإن أهم نقاط القصور في استخدام هذا الأسلوب هو أن حجم البرنامج سيكون كبيرا كلما أضفنا صورا أكثر للمشروع
ولنتعلم أولا كيف نضيف صورة الي Resources المشروع والطريقة قد تكون صعبة قليلا لمن لم ينفذا سابقا ولكنها في النهاية أسلوب تكراراي فلو فعلتها مرة تستطيع أن تفعلها ملايين المرات بعد ذلك
يتم إضافة صورة الي Resources المشروع عن طريق إتباع الخطوات التالية
الذهاب الي نافذة Solution Explorer حيث سنجد في اعلي النافذة أربعة أيقونات وهنا نقوم بالضغط علي الأيقونة الثانية من جهة اليسار
عند الضغط علي هذه الأيقونة بالماوس سيظهر لنا جميع الملفات الموجودة تحت فهرس المشروع الخاص بنا ونختار منها MyProject
ثم نختار Resources وهنا سنجد أن هناك أيقونات أخري قد ظهرت في نافذة Solution Explorer وعلينا أن نختار منها الأيقونة الأولي من جهة اليمين ويمكن تنفذ هذه الخطوة بأن نقف بالماوس علي كلمة Resources ونضغط يمين الماوس وهنا ستظهر لنا ContextMenu نختار منها View Designer وهنا ستفتح لنا نافذة أخري ومنها سنجد مجموعه من الباتون في أعلاها ونختار منها Add Resource وهو باتون به سهم صغير و رأس هذا السهم متجهه لأسفل ولو ضغطنا بالماوس علي هذا السهم الصغير ستظهر لنا Drop Down Menu نختار منها Add Existing File ثم نختار الملف أو الملفات التي نريد إضافتها للمشروع وطبعا سوف نضيف علي الأقل هنا ملف لأي صورة موجودة علي جهازنا
بعد إضافة الصورة سنجد أن الفيجوال استوديو قد قام بإنشاء فهرس اسمه Resources حيث يمكننا الأن رؤية هذا الفهرس من داخل نافذة Solution Explorer
من الأشياء الهامة التي يجب أخذها في الاعتبار عند حذف صورة ما من Resources هو أن نفعل ذلك من داخل نافذة Resources نفسها أولا قبل أن نحذف الصورة من داخل فهرس Resources الذي تم إضافته للمشروع
الأن وقد أصبح لدينا صورة ما موجودة بالفعل داخل Resources المشروع الخاص بنا فإن كل ما علينا أن نفعله أن نستخدمها والمثال التالي يوضح ذلك
مثال علي الطريقة الثانية
افتح مشروع جديد ثم عليك إضافة PictureBox و أيضا أضف له باتون ثم اكتب الكود التالي
كود :
Public Class Form1
Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click
Dim bmp As Bitmap = New Bitmap(My.Resources.img)
PictureBox1.Image = bmp
End Sub
End Classكود :
Public Class Form1
Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
Dim bmp As Bitmap = New Bitmap(My.Resources.img)
PictureBox1.Image = bmp
End Sub
End Classكود :
Public Class Form1
Dim bmp As Bitmap = New Bitmap(My.Resources.img)
Private Sub Form1_Paint(ByVal sender As System.Object, ByVal e As System.Windows.Forms.PaintEventArgs) Handles MyBase.Paint
e.Graphics.DrawImage(bmp, New Rectangle(0, 0, 100, 100))
End Sub
End Classكود :
Public Class Form1
Dim bmp As Bitmap = New Bitmap(My.Resources.img)
Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
DoubleBuffered = True
End Sub
Private Sub Form1_Paint(ByVal sender As System.Object, ByVal e As System.Windows.Forms.PaintEventArgs) Handles MyBase.Paint
e.Graphics.DrawImage(bmp, Me.ClientRectangle)
End Sub
Private Sub Form1_Resize(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Resize
Invalidate()
End Sub
End Classنذهب الي الفهرس Resources الموجود في نافذة Solution Explorer ثم نختار الصورة ثم من نافذة Properties نقوم بتغيير نوع Build Action لهذه الصورة الي Embedded Resource
الطريقة الثالثة:
تعتمد هذه الطريقة علي أن نضيف صور الي المشروع عن طريق استخدام ImageList Control
ثم نضيف صورة أو مجموعه من الصور الي ImageList Control عن طري الصفة Images و لكن علينا أن نراعي شيئا هاما عند استخدام هذا الكونترول وهو أن أقصي أبعاد للصورة التي من الممكن أن نضيفها لهذا الكونترول يجب أن لا تتعددي 256*256 وهذان البعدان يمثلان طول وعرض الصورة وأيضا عند استخدام صور أبعادها تساوي 256*256 سنجد أن الصورة لا تظهر بشكلها الطبيعي عند عرضها في الفورم داخل PictureBox مثلا أو حتى عند محاولة رسمها داخل الفورم وهذا أحد أوجه القصور في هذا الكونترول.
طبعا كلنا نعلم انه بعد إضافة الصور فإن كل صورة داخل هذا الكونترول سيكون لها رقم أو Index حيث من الممكن أن نستدعي أي صورة موجودة داخل هذا الكونترول باستخدام Index الخاص بها
ملحوظة: يفضل استخدام هذه الطريقة مع الصور التي أبعادها صغيرة مثل الأيقونات علي سبيل المثال
مثال علي الطريقة الثالثة
افتح مشروع ثم عليك أن تضيف الي الفورم ImageList Control ثم أضف الي هذه الكونترول مجموعة من الصور المختلفة ثم يمكنك أن تستخدم الكود بالشكل التالي لعرض الصور داخل PictureBox أو من الممكن رسم الصورة داخل الفورم نفسه
كود :
Public Class Form1
Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
Dim bmp As Bitmap = ImageList1.Images(0)
PictureBox1.Image = bmp
PictureBox1.SizeMode = PictureBoxSizeMode.CenterImage
End Sub
End Classشكل أخر للمثال هو أن نرسم الصورة داخل الفورم
كود :
Public Class Form1
Private Sub Form1_Paint(ByVal sender As System.Object, ByVal e As System.Windows.Forms.PaintEventArgs) Handles MyBase.Paint
Dim bmp As Bitmap = ImageList1.Images(0)
e.Graphics.DrawImage(bmp, New Rectangle(0, 0, bmp.Width, bmp.Height))
End Sub
End Class