Images Part 11 dbg

2 Images The form and several controls can display a number of different types of image files in the BackgroundImage Property. These images are displayed at their native size and may be tiled if necessary. Other controls, such as Buttons, can display a single copy of image at its native size.  Images

3 PictureBox Control The PictureBox control (pic prefix) is expressly designed for displaying a single image. Images with a file extension of.bmp,.gif,.jpg,.jpeg,.png,.ico can be displayed. Animated.gif s can be displayed, as well. Images may be displayed in several modes by changing the SizeMode property.

4 SizeMode Settings Normal: Image displayed from its upper left at normal size (but may not display fully). CenterImage: Image displayed with center aligned with center of the PictureBox (but may not display fully). AutoSize: Image displayed at normal size and PictureBox is resized to fit image (therefore may affect other controls on form).

5 SizeMode Settings StretchImage: Image is resized to fit the size and shape of the PictureBox but image may be distorted. Zoom: There is no distortion of Image; unused areas of PictureBox may remain because image is kept in correct proportion.  SizeMode

6 The Image Object An Image object can be used to determine the normal dimensions of an image stored in a file. Use the Height and Width properties to determine the aspect ratio of an image. This must be accomplished before setting the Height and Width Properties of a PictureBox used in the StretchImage mode—otherwise distortion will result.  AspectRatio

7 Panel A Panel control is a container. A Panel is like a GroupBox, except that it does not have a Text Property (caption). Panels can be used to organize other controls such as radio buttons, check boxes, related buttons. –Add panel to form first. –Then add other controls to panel. A Panel can be drawn upon. Use pnl prefix for a panel.

Graphics and Drawing

9 3 Step Process to Draw 1.Create a Graphics object using the CreateGraphics() method. 2.Instantiate a Pen or Brush to draw with. 3.Use some of the drawing methods of the Graphics object.

10 Graphics Object Any form or control that can create a Graphics object supports drawing. Forms, Panels, and PictureBoxes are most often used as drawing surfaces. To create a Graphics object for a Form: Graphics gr = this.CreateGraphics();

11 Drawing Coordinates The ClientSize (part of form available for controls) of a Form is available as a drawing surface. Drawing coordinates begin with 0,0 in the upper left corner, measured in pixels. The maxima of the visible drawing coordinates correspond to the ClientSize.Width (x pixels) and ClientSize.Height (y pixels).

12 The Drawing Area ClientSize.Height ClientSize.Width X = 0 pixels, Y = 0 pixels

13 Drawing and Filling Lines and “open” shapes are drawn with a Pen object. Solid and patterned shapes are filled with a Brush object. You can specify the color and width for a Pen. If you do not specify a width, the default width is one pixel. You specify the color for a Brush, and you declare what type of Brush by declaring SolidBrush, HatchBrush, etc.

14 Drawing a Line Use the DrawLine() method of the Graphics object. The arguments for this method include the pen to be used and the coordinates of the ends of the lines, expressed in pixels.  DrawLine

15 Clearing the Graphics Object Any pixels drawn on the Graphics object can be “erased” with its Clear() method. The Clear() method requires an argument to set the color of the pixels after they are cleared. Normally, the pixels are reset to the default BackColor of the form or control. gr.Clear(this.Backcolor);

16 Pen Width When you instantiate a new Pen, you are able to control both the color and line width. Pen penName = new Pen(Color.Red, 4);  CustomPens  FlexiblePen

17 DrawRectangle() Draw a rectangle by stating the Pen, the coordinates of the upper left vertex, the width and the height. Note that if height and width are equal a square will be drawn.  DrawRectangle

18 DrawEllipse() Regard an ellipse as a conic section that is inscribed within a rectangle. Again, state the Pen to be used, the starting coordinates, the width and the height of a rectangle; an ellipse will be inscribed within the rectangle. Note that if the height and width are equal a circle will be drawn.  DrawEllipse

19 FillRectangle() Use the FillRectangle() method of the Graphics object with a Brushes.color object. gr.FillRectangle(Brushes.Blue, 0,0,50,100);  FillRectangle

20 FillEllipse() Use the FillEllipse() method of the Graphics object with a Brushes.color object. gr.FillEllipse(Brushes.Red, 0,0,50,100);  FillEllipse

21 DrawString() Although it is often easiest to add text to a window using a Label, there are special situations that may call for writing directly on the Client area. DrawString() uses a number of arguments to render a string of text using an indicated size and style of a font, starting at a given set of coordinates. A Font object must be instantiated for DrawString().  DrawString

22 Centering a Shape Knowing the ClientSize Height and Width properties and the height and width of a regular drawn shape allows simple calculations to center the shape. If the desired center point and radius of a circle are known, calculating the “starting coordinates” and the width is also trivial.  CenterCircle  CenterShape