Lecture 5 Graphics Erick Pranata

» Graphics Overview » About GDI+ » Getting Started

» Successor of Graphic Device Interface » Responsible for displaying information on screens and printers » Namespaces: ˃System.Drawing ˃System.Drawing.Drawing2D ˃System.Drawing.Imaging ˃System.Drawing.Text ˃System.Drawing.Printing

» Two-dimensional (2-D) vector graphics ˃Lines, curves, etc. ˃Specified by set of points in coordinate system » Imaging ˃Bitmap » Typography

» Graphics Class ˃DrawLine receives a Pen object ˃FillRectangle receives a LinearGradientBrush object ˃Font and StringFormat ˃Rectangle, Point, Size ˃BitmapData

» Graphics Overview » About GDI+ » Getting Started

» Lines » Rectangles » Ellipses » Arcs » Polygons » Cardinal Splines » Bezier Splines

myGraphics.DrawRectangle( myPen, 20, 10, 100, 50 );

» Line ˃ myGraphics.DrawLine(myPen, 4, 2, 12, 6); ˃ Point myStartPoint = new Point(4, 2); Point myEndPoint = new Point(12, 6); myGraphics.DrawLine( myPen, myStartPoint, myEndPoint ); » Pen ˃ Pen myPen = new Pen(Color.Blue, 2); myGraphics.DrawLine( myPen, 0, 0, 60, 30 ); ˃ myPen.DashStyle = DashStyle.Dash; ˃StartCap and EndCap: +Square, Rounded, triangular, or custom shape

» Rectangle ˃ myGraphics.DrawRectangle( myPen, 100, 50, 80, 40 ); ˃ Rectangle myRectangle = new Rectangle(100, 50, 80, 40); myGraphics.DrawRectangle( myPen, myRectangle );

» Ellipse ˃ myGraphics.DrawEllipse(myPen, 100, 50, 80, 40); ˃ Rectangle myRectangle = new Rectangle(100, 50, 80, 40); myGraphics.DrawEllipse(myPen, myRectangle); » Arc ˃ myGraphics.DrawArc(myPen, 100, 50, 140, 70, 30, 180);

» Point[] myPointArray = { new Point(0, 0), new Point(50, 30), new Point(30, 60) }; myGraphics.DrawPolygon( myPen, myPointArray );

» myGraphics.DrawCurve(myPen, myPointArray, 1.5f);

» Spesified by four points: ˃Two end points ˃Two control points: act as magnets » myGraphics.DrawBezier(myPen, 0, 0, 40, 20, 80, 150, 100, 10);

» Combining vector graphics » Example: ˃ GraphicsPath myGraphicsPath = new GraphicsPath(); myGraphicsPath.AddLine(0, 0, 30, 20); myGraphicsPath.AddEllipse(20, 20, 20, 40); myGraphicsPath.AddBezier(30, 60, 70, 60, 50, 30, 100, 10); myGraphics.DrawPath(myPen, myGraphicsPath);

» Solid Brush ˃ SolidBrush mySolidBrush = new SolidBrush(Color.Red); myGraphics.FillEllipse( mySolidBrush, 0, 0, 60, 40 ); » Hatch Brush ˃ HatchBrush myHatchBrush = new HatchBrush( HatchStyle.Vertical, Color.Blue, Color.Green );

» Texture Brush ˃ Image myImage = Image.FromFile( "MyTexture.bmp“ ); TextureBrush myTextureBrush = new TextureBrush(myImage); » Gradient Brush ˃ LinearGradientBrush myLinearGradientBrush = new LinearGradientBrush( myRectangle, Color.Blue, Color.Green, LinearGradientMode.Horizontal );

» myGraphics.FillRegion( mySolidBrush, myRegion);

» myGraphics.Clip = myRegion; myGraphics.DrawLine( myPen, 0, 0, 200, 200);

» myGraphics.SmoothingMode = SmoothingMode.AntiAlias;

» Graphics Overview » About GDI+ » Getting Started

» PaintEventArgs from Paint event ˃ private void Form1_Paint( object sender, System.Windows.Forms.PaintEventArgs pe ) { Graphics g = pe.Graphics; } » CreateGraphics of a component ˃ Graphics g = this.CreateGraphics(); » Create a Graphics object from an Image ˃ Bitmap myBitmap = new Bitmap("myPic.bmp"); Graphics g = Graphics.FromImage(myBitmap);

» Pen » Brush » Font » Color Do not forget to dispose them after use

» Use Invalidate() method ˃ this.Invalidate()

» string drawString = "Sample Text"; » Font drawFont = new Font("Arial", 16); » SolidBrush drawBrush = new SolidBrush(Color.Black); » StringFormat drawFormat = new StringFormat(); » myGraphics.DrawString( drawString, drawFont, drawBrush, 150, 50, drawFormat);

» MouseClick » MouseDoubleClick » MouseDown » MouseEnter » MouseHover » MouseLeave » MouseMove » MouseUp

» Graphics and Drawing in Windows Forms, us/library/a36fascx(v=vs.110).aspxhttp://msdn.microsoft.com/en- us/library/a36fascx(v=vs.110).aspx