khaledbelal
03-04-2010, 06:14 PM
بسم الله الرحمن الرحيم .
السلام عليكم ورحمة الله وبركاته .
GDI+ :
تتبع هذه الأوامر الفئة System.Drawing وتوفر لك حلولاً افضل من اجل رسومات 2D على الفورم والمخططات البيانية وخلافه ، تحتوي على الفئات الرئيسية التالية :
System.Drawing : الفئة الرئيسية ، تحتوي على الأقلام والفرش الاساسية التي تستخدمها في عمليات الرسم .
System.Drawing.Drawing2D : تقدم مجموعة أخرى من الدوال التي تساعدك على الرسم مثل gradient brushes و geometric transforms .
System.Drawing.Imaging : تساعدك في عملياتك على الصور وقراءة البيانات الداخلية وتنفيذ العمليات المختلفة .
System.Drawing.Printing : تساعدك على تحويل رسومات إلى صور للطباعة والتعامل مع الطاعبة .
System.Drawing.Text : التعامل بصورة رسومية مع الخطوط وخلافه .
محتويات الفئة System.Drawing :
هي الفئة الاساسية والأكثر استخداماً ،أهم محتوياتها هي :
Bitmap : لاحتواء معلومات الصورة .
Brush : فرشاة لعملية التلوين ، ولها عدة انواع .
BufferedGraphics : يمكنك باستخدام هذا ال Buffer الرسم باستخدام تقنية double buffering ، وهي تقنية تسمح للرسم بالاكتمال في buffer مستقل ثم ظهوره للمستخدم مرة واحدة لتلافي مشكلة flicker ، على العموم هي تقنية مشهورة في تقنيات الرسم يمكن التعرف عليها من هنا :
http://msdn.microsoft.com/en-us/library/b367a457.aspx
Color
SystemColors : الألوان التي يمكن استخدامها في عمليات الرسم والتلوين .
Font
FontFamily : الخطوط التي يمكن استخدامها في عمليات رسم النصوص .
Graphics : الكائن الاساسي في عمليات الرسم ، والتي سنتعرف عليها لاحقاً .
Icon
SystemIcons : التعامل مع الايقونات .
Image : ال abstract class لكل ما يتعلق بعمليات الصور .
ImageAnimator : للتعامل مع الصور المتحركة .
Pen : قلم لعمليات الرسم ، وله عدة أنواع .
Point : للتعامل مع الاحداثيات .
Rectangle : مستطيل .
Size : حساب المساحة للشكل .
StringFormat : يحتوي هذا الكلاس على كل ما يتعلق بعمليات النصوص .
Region : خاص بالتعامل مع الاشكال أي كانت ، وله عدة خصائص مفيدة جداً .
يمكنك معرفة المزيد عن جميع محتوياتها من خلال هذا الرابط :
http://msdn.microsoft.com/en-us/library/system.drawing.aspx
الكائن Graphics .
الكائن Graphics هو الكائن الأساسي في عملية الرسم ، يمكن انشاءه بعدة طرق :
- من الفورم ، وينطبق عليه من picture box وخلافه :
C#:
Graphics myGraphic = Form1.CreateGraphics();
vb.net:
Dim myGraphic As Graphics = Form1.CreateGraphics()
- أو من حدث الرسم لأي اداة كالفوم مثلاً ، عن طريق الكائن PaintEventArgs بالشكل التالي مثلاً :
C#:
private void Form1_Paint(object sender, PaintEventArgs e)
{
Graphics myGraphic = e.Graphics();
}
vb.net:
Private Sub Form1_Paint(ByVal sender As Object, ByVal e As PaintEventArgs)
Dim myGraphic As Graphics = e.Graphics()
End Sub
ويحتوي هذا الكائن على الأوامر التالية :
FromHdc()
FromHwnd()
FromImage() : عمل كائن رسم من صورة موجودة حالياً .
Clear() : مسح محتويات الكائن .
DrawArc() : رسم صورة او شكل هندسي .
DrawBeziers() : رسم Beziers - لا أعرف معناها ولكنها ترسم منحنيات - .
DrawCurve() : رسم منحنى .
DrawEllipse() : رسم شكل بيضاوي.
DrawIcon() : رسم ايقونة .
DrawLine() : رسم خط مستقيم .
DrawLines() : رسم مجموعة من الخطوط .
DrawPie() : رسم مخطط بياني .
DrawPath() : رسم مسار .
DrawRectangle() : رسم مستطيل .
DrawRectangles() : رسم مستطيلات .
DrawString() : رسم نص .
FillEllipse() : تلوين مضلع .
FillPie() : تلوين مخطط بياني .
FillPolygon() : تلوين شكل بيضاوي.
FillRectangle() : تلوين مربع .
FillPath() : تلوين مسار .
لمزيد من المعلومات حول هذه الفئة ودوالها :
http://msdn.microsoft.com/en-us/library/system.drawing.graphics_members.aspx
والآن لعلك لاحظت أن جميع دوال الرسم DrawXXX تستخدم القلم Pen ، أما دوال التلوين FillXXX فهي تستخدم الفرشاة Brush ،لذا سنبدأ بالتعرف على هذين الكائنين أولاً .
Pen :
يمكن استخدام Pen في عمليات الرسم مباشرة عن طريق تحديد مثل Pen.Blue للقلم الأزرق وخلافه ، إلا أننا ما زلنا قادرين على تعريف كائن منه والاستفادة من خصائصه المتعددة بالشكل التالي مثلاً :
C#:
Pen myPen = new Pen(Color.Black, 3);
vb.net:
Dim myPen As New Pen(Color.Black, 3)
حيث قمنا بانشاء قلم بلون أسود وبعرض 3 .يمكننا استخدام المزيد من الخصائص للقلم عن طريق تحديد مثلاً شكل نقطة البداية :
myPen.StartCap = LineCap.ArrowAnchor
لمعرفة المزيد عن خصائص القلم :
http://msdn.microsoft.com/en-us/library/system.drawing.pen.aspx
Brush :
بنفس الطريقة ، يمكن انشاء فرشاة باللون الأصفر كأبسط مثال بالشكل التالي :
C#:
SolidBrush myBrush = new SolidBrush (Color.Yellow);
vb.net:
Dim myBrush As New SolidBrush(Color.Yellow)
يمكن ايضاً انشاء فرشاة بأكثر من لون بالشكل التالي مثلاً :
C#:
HatchBrush myBrush =new HatchBrush(HatchStyle.BackwardDiagonal, Color.Green, Color.White);
vb.net:
Dim myBrush As New HatchBrush(HatchStyle.BackwardDiagonal, Color.Green, Color.White)
لمعرفة المزيد عن خصائص الفرشاة :
http://msdn.microsoft.com/en-us/library/system.drawing.brush.aspx
الرسم :
بعد ان انشأنا كائننا الخاص للرسم ، يمكننا البدء في رسم خط مستقيم بالشكل التالي مثلاً :
myGraphic.DrawLine(Pens.Blue, 20, 20, 100, 100)
أو مستطيل :
myGraphic.DrawRectangle(Pens.Blue, New Rectangle(20, 20, 100, 100))
أو رسم منحنى :
myGraphic.DrawBezier(Pens.Blue, 10, 20, 50, 80, 10, 80, 100, 50)
بامكاننا رسم خط مستقيم ولكن باستخدام كائن قلم سبق تعريفه وتحديده بأنه منقط بالشكل التالي مثلاً :
C#:
Graphics myGraphic = e.Graphics;
Pen myPen = new Pen(Color.Blue, 3);
myPen.DashStyle = System.Drawing.Drawing2D.DashStyle.Dot;
myGraphic.DrawLine(myPen, 20, 20, 100, 100);
vb.net:
Dim myGraphic As Graphics = e.Graphics
Dim myPen As New Pen(Color.Blue, 3)
myPen.DashStyle = System.Drawing.Drawing2D.DashStyle.Dot
myGraphic.DrawLine(myPen, 20, 20, 100, 100)
او لرسم مسار من عدة خطوط على شكل مثلث مثلاً :
C#:
GraphicsPath myGraphicPath = new GraphicsPath();
myGraphicPath.StartFigure();
myPath.AddLine(10, 10, 30, 60);
myPath.AddLine(30, 60, 60, 10);
myPath.AddLine(60, 10, 10, 10);
myGraphicPath.CloseFigure();
myGraphic.DrawPath(myPen, myGraphicPath);
vb.net:
Dim myGraphicPath As New GraphicsPath()
myGraphicPath.StartFigure()
myPath.AddLine(10, 10, 30, 60)
myPath.AddLine(30, 60, 60, 10)
myPath.AddLine(60, 10, 10, 10)
myGraphicPath.CloseFigure()
myGraphic.DrawPath(myPen, myGraphicPath)
أو لرسمه ملوناً نغير السطر الأخير ليكون FillPath مع تمرير الفرشاة المناسبة :
رسم النصوص :
رسم النصوص هو قسم آخر من عالم ال GDI أبسط مثال عليه هو الكود التالي لرسم نص بفرشاة حمراء وبلون أحمر في النقطة 200 و 200 .
رمز:
myGraphic.DrawString("Hello GDI+", new Font("Times New Roman", 30), Brushes.Red, 200, 200);
لكن لاحقاً يكون بامكاننا استخدام الكائن StringFormat واضافته إلى متغيرات الرسم ، لكي نرسم مثلاً نصاً بصورة عمودية :
C#:
Graphics myGraphic = e.Graphics;
StringFormat drawFormat = new StringFormat();
drawFormat.FormatFlags = StringFormatFlags.DirectionVertical;
myGraphic.DrawString("Hello GDI+", new Font("Times New Roman", 30), Brushes.Red, 100, 20, drawFormat);
vb.net:
Dim myGraphic As Graphics = e.Graphics
Dim drawFormat As New StringFormat()
drawFormat.FormatFlags = StringFormatFlags.DirectionVertical
myGraphic.DrawString("Hello GDI+", New Font("Times New Roman", 30), Brushes.Red, 100, 20, drawFormat)
سيكون الناتج شيئاً مثل هذا :
http://vb4arab.com/vb/uploaded/3/01213790193.jpg
اختم الدرس بمثال جيد ليكون تطبيقاً على دروس الرسوميات لدينا ، المثال موجود على هذا الرابط وهو لرسم ساعة بالشكل التالي :
http://www.****2s.com/Tutorial/CSharpImages/ClockFace.PNG
رابط المثال :
http://www.****2s.com/Tutorial/CSharp/0480__2D/Clockanimation.htm
هناك الكثير جداً في عالم ال GDI أخشى انني لم استطع إلا وضعك على أول الطريق فيه ، ولكن هذا اسلوب هذه الدورة حيث يهمنا فهم التقنية اكثر من فهم طريقة استخدامها .
إلى هنا نكون قد انتهينا من درس اليوم ، الدرس القادم سيكون في عالم WPF و XAML .
والله الموفق ..
والسلام عليكم ورحمة الله وبركاته .
السلام عليكم ورحمة الله وبركاته .
GDI+ :
تتبع هذه الأوامر الفئة System.Drawing وتوفر لك حلولاً افضل من اجل رسومات 2D على الفورم والمخططات البيانية وخلافه ، تحتوي على الفئات الرئيسية التالية :
System.Drawing : الفئة الرئيسية ، تحتوي على الأقلام والفرش الاساسية التي تستخدمها في عمليات الرسم .
System.Drawing.Drawing2D : تقدم مجموعة أخرى من الدوال التي تساعدك على الرسم مثل gradient brushes و geometric transforms .
System.Drawing.Imaging : تساعدك في عملياتك على الصور وقراءة البيانات الداخلية وتنفيذ العمليات المختلفة .
System.Drawing.Printing : تساعدك على تحويل رسومات إلى صور للطباعة والتعامل مع الطاعبة .
System.Drawing.Text : التعامل بصورة رسومية مع الخطوط وخلافه .
محتويات الفئة System.Drawing :
هي الفئة الاساسية والأكثر استخداماً ،أهم محتوياتها هي :
Bitmap : لاحتواء معلومات الصورة .
Brush : فرشاة لعملية التلوين ، ولها عدة انواع .
BufferedGraphics : يمكنك باستخدام هذا ال Buffer الرسم باستخدام تقنية double buffering ، وهي تقنية تسمح للرسم بالاكتمال في buffer مستقل ثم ظهوره للمستخدم مرة واحدة لتلافي مشكلة flicker ، على العموم هي تقنية مشهورة في تقنيات الرسم يمكن التعرف عليها من هنا :
http://msdn.microsoft.com/en-us/library/b367a457.aspx
Color
SystemColors : الألوان التي يمكن استخدامها في عمليات الرسم والتلوين .
Font
FontFamily : الخطوط التي يمكن استخدامها في عمليات رسم النصوص .
Graphics : الكائن الاساسي في عمليات الرسم ، والتي سنتعرف عليها لاحقاً .
Icon
SystemIcons : التعامل مع الايقونات .
Image : ال abstract class لكل ما يتعلق بعمليات الصور .
ImageAnimator : للتعامل مع الصور المتحركة .
Pen : قلم لعمليات الرسم ، وله عدة أنواع .
Point : للتعامل مع الاحداثيات .
Rectangle : مستطيل .
Size : حساب المساحة للشكل .
StringFormat : يحتوي هذا الكلاس على كل ما يتعلق بعمليات النصوص .
Region : خاص بالتعامل مع الاشكال أي كانت ، وله عدة خصائص مفيدة جداً .
يمكنك معرفة المزيد عن جميع محتوياتها من خلال هذا الرابط :
http://msdn.microsoft.com/en-us/library/system.drawing.aspx
الكائن Graphics .
الكائن Graphics هو الكائن الأساسي في عملية الرسم ، يمكن انشاءه بعدة طرق :
- من الفورم ، وينطبق عليه من picture box وخلافه :
C#:
Graphics myGraphic = Form1.CreateGraphics();
vb.net:
Dim myGraphic As Graphics = Form1.CreateGraphics()
- أو من حدث الرسم لأي اداة كالفوم مثلاً ، عن طريق الكائن PaintEventArgs بالشكل التالي مثلاً :
C#:
private void Form1_Paint(object sender, PaintEventArgs e)
{
Graphics myGraphic = e.Graphics();
}
vb.net:
Private Sub Form1_Paint(ByVal sender As Object, ByVal e As PaintEventArgs)
Dim myGraphic As Graphics = e.Graphics()
End Sub
ويحتوي هذا الكائن على الأوامر التالية :
FromHdc()
FromHwnd()
FromImage() : عمل كائن رسم من صورة موجودة حالياً .
Clear() : مسح محتويات الكائن .
DrawArc() : رسم صورة او شكل هندسي .
DrawBeziers() : رسم Beziers - لا أعرف معناها ولكنها ترسم منحنيات - .
DrawCurve() : رسم منحنى .
DrawEllipse() : رسم شكل بيضاوي.
DrawIcon() : رسم ايقونة .
DrawLine() : رسم خط مستقيم .
DrawLines() : رسم مجموعة من الخطوط .
DrawPie() : رسم مخطط بياني .
DrawPath() : رسم مسار .
DrawRectangle() : رسم مستطيل .
DrawRectangles() : رسم مستطيلات .
DrawString() : رسم نص .
FillEllipse() : تلوين مضلع .
FillPie() : تلوين مخطط بياني .
FillPolygon() : تلوين شكل بيضاوي.
FillRectangle() : تلوين مربع .
FillPath() : تلوين مسار .
لمزيد من المعلومات حول هذه الفئة ودوالها :
http://msdn.microsoft.com/en-us/library/system.drawing.graphics_members.aspx
والآن لعلك لاحظت أن جميع دوال الرسم DrawXXX تستخدم القلم Pen ، أما دوال التلوين FillXXX فهي تستخدم الفرشاة Brush ،لذا سنبدأ بالتعرف على هذين الكائنين أولاً .
Pen :
يمكن استخدام Pen في عمليات الرسم مباشرة عن طريق تحديد مثل Pen.Blue للقلم الأزرق وخلافه ، إلا أننا ما زلنا قادرين على تعريف كائن منه والاستفادة من خصائصه المتعددة بالشكل التالي مثلاً :
C#:
Pen myPen = new Pen(Color.Black, 3);
vb.net:
Dim myPen As New Pen(Color.Black, 3)
حيث قمنا بانشاء قلم بلون أسود وبعرض 3 .يمكننا استخدام المزيد من الخصائص للقلم عن طريق تحديد مثلاً شكل نقطة البداية :
myPen.StartCap = LineCap.ArrowAnchor
لمعرفة المزيد عن خصائص القلم :
http://msdn.microsoft.com/en-us/library/system.drawing.pen.aspx
Brush :
بنفس الطريقة ، يمكن انشاء فرشاة باللون الأصفر كأبسط مثال بالشكل التالي :
C#:
SolidBrush myBrush = new SolidBrush (Color.Yellow);
vb.net:
Dim myBrush As New SolidBrush(Color.Yellow)
يمكن ايضاً انشاء فرشاة بأكثر من لون بالشكل التالي مثلاً :
C#:
HatchBrush myBrush =new HatchBrush(HatchStyle.BackwardDiagonal, Color.Green, Color.White);
vb.net:
Dim myBrush As New HatchBrush(HatchStyle.BackwardDiagonal, Color.Green, Color.White)
لمعرفة المزيد عن خصائص الفرشاة :
http://msdn.microsoft.com/en-us/library/system.drawing.brush.aspx
الرسم :
بعد ان انشأنا كائننا الخاص للرسم ، يمكننا البدء في رسم خط مستقيم بالشكل التالي مثلاً :
myGraphic.DrawLine(Pens.Blue, 20, 20, 100, 100)
أو مستطيل :
myGraphic.DrawRectangle(Pens.Blue, New Rectangle(20, 20, 100, 100))
أو رسم منحنى :
myGraphic.DrawBezier(Pens.Blue, 10, 20, 50, 80, 10, 80, 100, 50)
بامكاننا رسم خط مستقيم ولكن باستخدام كائن قلم سبق تعريفه وتحديده بأنه منقط بالشكل التالي مثلاً :
C#:
Graphics myGraphic = e.Graphics;
Pen myPen = new Pen(Color.Blue, 3);
myPen.DashStyle = System.Drawing.Drawing2D.DashStyle.Dot;
myGraphic.DrawLine(myPen, 20, 20, 100, 100);
vb.net:
Dim myGraphic As Graphics = e.Graphics
Dim myPen As New Pen(Color.Blue, 3)
myPen.DashStyle = System.Drawing.Drawing2D.DashStyle.Dot
myGraphic.DrawLine(myPen, 20, 20, 100, 100)
او لرسم مسار من عدة خطوط على شكل مثلث مثلاً :
C#:
GraphicsPath myGraphicPath = new GraphicsPath();
myGraphicPath.StartFigure();
myPath.AddLine(10, 10, 30, 60);
myPath.AddLine(30, 60, 60, 10);
myPath.AddLine(60, 10, 10, 10);
myGraphicPath.CloseFigure();
myGraphic.DrawPath(myPen, myGraphicPath);
vb.net:
Dim myGraphicPath As New GraphicsPath()
myGraphicPath.StartFigure()
myPath.AddLine(10, 10, 30, 60)
myPath.AddLine(30, 60, 60, 10)
myPath.AddLine(60, 10, 10, 10)
myGraphicPath.CloseFigure()
myGraphic.DrawPath(myPen, myGraphicPath)
أو لرسمه ملوناً نغير السطر الأخير ليكون FillPath مع تمرير الفرشاة المناسبة :
رسم النصوص :
رسم النصوص هو قسم آخر من عالم ال GDI أبسط مثال عليه هو الكود التالي لرسم نص بفرشاة حمراء وبلون أحمر في النقطة 200 و 200 .
رمز:
myGraphic.DrawString("Hello GDI+", new Font("Times New Roman", 30), Brushes.Red, 200, 200);
لكن لاحقاً يكون بامكاننا استخدام الكائن StringFormat واضافته إلى متغيرات الرسم ، لكي نرسم مثلاً نصاً بصورة عمودية :
C#:
Graphics myGraphic = e.Graphics;
StringFormat drawFormat = new StringFormat();
drawFormat.FormatFlags = StringFormatFlags.DirectionVertical;
myGraphic.DrawString("Hello GDI+", new Font("Times New Roman", 30), Brushes.Red, 100, 20, drawFormat);
vb.net:
Dim myGraphic As Graphics = e.Graphics
Dim drawFormat As New StringFormat()
drawFormat.FormatFlags = StringFormatFlags.DirectionVertical
myGraphic.DrawString("Hello GDI+", New Font("Times New Roman", 30), Brushes.Red, 100, 20, drawFormat)
سيكون الناتج شيئاً مثل هذا :
http://vb4arab.com/vb/uploaded/3/01213790193.jpg
اختم الدرس بمثال جيد ليكون تطبيقاً على دروس الرسوميات لدينا ، المثال موجود على هذا الرابط وهو لرسم ساعة بالشكل التالي :
http://www.****2s.com/Tutorial/CSharpImages/ClockFace.PNG
رابط المثال :
http://www.****2s.com/Tutorial/CSharp/0480__2D/Clockanimation.htm
هناك الكثير جداً في عالم ال GDI أخشى انني لم استطع إلا وضعك على أول الطريق فيه ، ولكن هذا اسلوب هذه الدورة حيث يهمنا فهم التقنية اكثر من فهم طريقة استخدامها .
إلى هنا نكون قد انتهينا من درس اليوم ، الدرس القادم سيكون في عالم WPF و XAML .
والله الموفق ..
والسلام عليكم ورحمة الله وبركاته .