02-10-12, 03:10 PM
كاتب الموضوع : silverlight
التعامل مع الصور Images في بيئة الدوت نت باستخدام +GDI اللغة المستخدمة: الفيجوال بيسك
التطبيق: فيجوال استوديو 2005 و 2008
المستوي: التقييم متروك للقارئ
إعداد: مهندس / عمر أمين إبراهيم
الجزء الثاني: كيفي نجعل الصورة تأخذ شكلا معينا
من المؤكد أن الكثيرين منا يريدون أن يغيروا شكل الصورة بأن يجعلوها تأخذ أي شكل ما مثل الشكل البيضاوي أو يجعلون زوايا الصورة دائرية أو يجعلون الصورة تصبح نصف دائرية أو أي شكل أخر يريدون. إذن كيف نفعل ذلك؟
في واقع الأمر أن الفكرة وببساطة شديدة يمكن تلخيصها كالتالي
نحدد الصورة ثم نستخدم GraphicsPath Class ونربطه بالصورة ثم نرسم الصورة وأخيرا نرسم GraphicsPath
مثال علي ذلك
افتح مشروع جديد فقط ثم عليك إضافة صورة الي الفورم ثم في الحدث Paint الخاص بالفورم عليك تعريف New Bitmap ثم عليك تعريف GraphicsPath وليكن شكلا بيضاويا Ovalمثلا ثم تعيد رسم الصورة ثم ترسم عليها GraphicsPath والكود التالي يوضح ذلك
كود :
Public Class Form1
Private Sub Form1_Paint(ByVal sender As System.Object, ByVal e As System.Windows.Forms.PaintEventArgs) Handles MyBase.Paint
'Create Bitmap
Dim SourceBitmap As New Bitmap(My.Resources.pre_en_cats_large)
Dim ImagePath As New System.Drawing.Drawing2D.GraphicsPath()
ImagePath.StartFigure()
ImagePath.AddRectangle(New Rectangle(0, 0, SourceBitmap.Width + 1, SourceBitmap.Height + 1))
ImagePath.AddEllipse(New Rectangle(0, 0, SourceBitmap.Width, SourceBitmap.Height))
ImagePath.CloseFigure()
e.Graphics.DrawImageUnscaled(SourceBitmap, 0, 0)
e.Graphics.FillPath(Brushes.Red, ImagePath)
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
'Create Bitmap
Dim SourceBitmap As New Bitmap(My.Resources.pre_en_cats_large)
Dim ImagePath As New System.Drawing.Drawing2D.GraphicsPath()
ImagePath.StartFigure()
ImagePath.AddRectangle(New Rectangle(0, 0, SourceBitmap.Width + 1, SourceBitmap.Height + 1))
ImagePath.AddEllipse(New Rectangle(0, 0, SourceBitmap.Width, SourceBitmap.Height))
ImagePath.CloseFigure()
Dim brush As New SolidBrush(Me.BackColor)
e.Graphics.DrawImageUnscaled(SourceBitmap, 0, 0)
e.Graphics.FillPath(brush, ImagePath)
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
'Create Bitmap
Dim SourceBitmap As New Bitmap(My.Resources.pre_en_cats_large)
Dim ImagePath As New System.Drawing.Drawing2D.GraphicsPath()
Dim Radius As Double = 0.05
Dim Corner As Integer = CInt(SourceBitmap.Width * Radius)
Const Border As Integer = 1
Dim Width As Integer = SourceBitmap.Width - 1
Dim Height As Integer = SourceBitmap.Height - 1
ImagePath.AddRectangle(New Rectangle(-Border, -Border, SourceBitmap.Width + Border, SourceBitmap.Height + Border))
ImagePath.AddArc(New Rectangle(0, 0, Corner, Corner), 180, 90)
ImagePath.AddLine(Corner, 0, Width - Corner, 0)
ImagePath.AddArc(New Rectangle(Width - Corner, 0, Corner, Corner), -90, 90)
ImagePath.AddLine(Width, Corner, Width, SourceBitmap.Height - Corner)
ImagePath.AddArc(New Rectangle(Width - Corner, Height - Corner, Corner, Corner), 0, 90)
ImagePath.AddLine(Width - Corner, Height, Corner, Height)
ImagePath.AddArc(New Rectangle(0, Height - Corner, Corner, Corner), 90, 90)
ImagePath.AddLine(0, Height - Corner, 0, Corner)
ImagePath.CloseFigure()
Dim brush As New SolidBrush(Me.BackColor)
e.Graphics.DrawImageUnscaled(SourceBitmap, 0, 0)
e.Graphics.FillPath(brush, ImagePath)
End Sub
End Classولنفكر قليلا هل نحن نحتاج الي بناء دالة واحدة فقط أم نريد أن نبني الكثير من الدوال من الكود اعلاه.
من المؤكد أننا نريد أن يكون لدينا أكثر من دالة Function لذلك سنقوم بتقسيم الكود اعلاه الي دالتان حيث ستختص الدالة الأولي بتعريف GraphicsPath والدالة الثانية ستختص باسترجاع الصورة ومن هاتان الدالتان يمكننا بعد ذلك أن نبني أكثر من دالة.
الدالة الخاصة باسترجاع GraphicsPath ستكون كالتالي
هنا سوف نقوم باسترجاع الشكل البيضاوي والكود التالي يوضح شكل الدالة ولقد أطلقت عليها اسم CreateOvalPath Function وبما أننا نريد استرجاع GraphicsPath الخاص بالصورة لذا تم ربط هذا GraphicsPath بالصورة. أي أننا سنقوم بإدخال صورة الي Function ولكن نسترجع منها GraphicsPath
كود :
Public Shared Function CreateOvalPath(ByVal SourceBitmap As Bitmap) As System.Drawing.Drawing2D.GraphicsPath
Dim ImagePath As System.Drawing.Drawing2D.GraphicsPath = New System.Drawing.Drawing2D.GraphicsPath()
ImagePath.AddRectangle(New Rectangle(0, 0, SourceBitmap.Width, SourceBitmap.Height))
ImagePath.AddEllipse(New Rectangle(0, 0, SourceBitmap.Width, SourceBitmap.Height))
Return ImagePath
End Function 'CreateOvalPath Functionوالدالة هنا الهدف منها هو إدخال صورة ما وأيضا لون Color ما وهذا اللون سيتيح لنا أن نجعل GraphicsPath يتم تلوينه باللون الذي نختاره ثم نسترجع هذه الصورة ونستخدمها كيفما شئنا بعد ذلك ولقد أطلقت علي الدالة اسم DrawOvalBitmap
كود :
Public Shared Function DrawOvalBitmap(ByVal SourceBitmap As Bitmap, ByVal color As Color) As Bitmap
Dim bmp As New Bitmap(SourceBitmap.Width, SourceBitmap.Height)
Dim g As Graphics = Graphics.FromImage(bmp)
g.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.AntiAlias
Dim ImagePath As New System.Drawing.Drawing2D.GraphicsPath()
ImagePath = CreateOvalPath(bmp)
Dim Brush As New SolidBrush(color)
g.DrawImage(SourceBitmap, New Rectangle(0, 0, SourceBitmap.Width, SourceBitmap.Height))
g.FillPath(Brush, ImagePath)
Return bmp
End Function ' DrawOvalBitmap Functionافتح مشروع ثم أضف الي الفورم PictureBox ثم اكتب الكود بالشكل التالي
كود :
Public Class Form1
Public Shared Function CreateOvalPath(ByVal SourceBitmap As Bitmap) As System.Drawing.Drawing2D.GraphicsPath
Dim ImagePath As System.Drawing.Drawing2D.GraphicsPath = New System.Drawing.Drawing2D.GraphicsPath()
ImagePath.AddRectangle(New Rectangle(0, 0, SourceBitmap.Width, SourceBitmap.Height))
ImagePath.AddEllipse(New Rectangle(0, 0, SourceBitmap.Width, SourceBitmap.Height))
Return ImagePath
End Function 'CreateOvalPath Function
Public Shared Function DrawOvalBitmap(ByVal SourceBitmap As Bitmap, ByVal color As Color) As Bitmap
Dim bmp As New Bitmap(SourceBitmap.Width, SourceBitmap.Height)
Dim g As Graphics = Graphics.FromImage(bmp)
g.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.AntiAlias
Dim ImagePath As New System.Drawing.Drawing2D.GraphicsPath()
ImagePath = CreateOvalPath(bmp)
Dim Brush As New SolidBrush(color)
g.DrawImage(SourceBitmap, New Rectangle(0, 0, SourceBitmap.Width, SourceBitmap.Height))
g.FillPath(Brush, ImagePath)
Return bmp
End Function ' DrawOvalBitmap Function
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.pre_en_cats_large)
Dim bmp1 As Bitmap = DrawOvalBitmap(bmp, PictureBox1.BackColor)
PictureBox1.Image = bmp1
End Sub
End Classوهذه المرة سنبني دالتان بحيث نستخدمهما لكي نجعل زوايا الصورة تبدو علي شكل Curve وذلك باستخدام نفس الأسلوب الذي تحدثنا عنه سابقا وهو كيفية بناء دوال لرسم الصورة علي شكل بيضاوي إذن نحن في حاجة لبناء دالتان أيضا
الدالة الخاصة باسترجاع GraphicsPath ستكون كالتالي
هنا سوف نقوم باسترجاع مستطيل له زوايا مقوسة والكود التالي يوضح شكل الدالة ولقد أطلقت عليها اسم CreateRoundedPath Function
كود :
Public Shared Function CreateRoundedPath(ByVal SourceBitmap As Bitmap) As System.Drawing.Drawing2D.GraphicsPath
Dim ImagePath As System.Drawing.Drawing2D.GraphicsPath = New System.Drawing.Drawing2D.GraphicsPath()
Dim Radius As Double = 0.05
Dim Corner As Integer = CInt(SourceBitmap.Width * Radius)
Dim Border As Integer = 1
Dim Width As Integer = SourceBitmap.Width - 1
Dim Height As Integer = SourceBitmap.Height - 1
ImagePath.AddRectangle(New Rectangle(-Border, -Border, SourceBitmap.Width + Border, SourceBitmap.Height + Border))
ImagePath.AddArc(New Rectangle(0, 0, Corner, Corner), 180, 90)
ImagePath.AddLine(Corner, 0, Width - Corner, 0)
ImagePath.AddArc(New Rectangle(Width - Corner, 0, Corner, Corner), -90, 90)
ImagePath.AddLine(Width, Corner, Width, SourceBitmap.Height - Corner)
ImagePath.AddArc(New Rectangle(Width - Corner, Height - Corner, Corner, Corner), 0, 90)
ImagePath.AddLine(Width - Corner, Height, Corner, Height)
ImagePath.AddArc(New Rectangle(0, Height - Corner, Corner, Corner), 90, 90)
ImagePath.AddLine(0, Height - Corner, 0, Corner)
ImagePath.CloseFigure()
Return ImagePath
End Function ' CreateRoundedPath Function
