Images and Bitmaps in C Li-Chih Hsu With

Images and Bitmaps (in C#) Li-Chih Hsu With a few modifications by Matthew Miling Advanced Windows Programming

Contents ® Overview – Images and Bitmaps ® Fundamental Windows Classes ® System. Drawing. Image ® System. Drawing. Bitmap ® Other Image/Bitmap Types

Overview – Images and Bitmaps ® In computers, two types of graphics ® Vector - graphics made of lines and curves - fonts, CAD programs, Photoshop ® Raster - rectangular arrays called bitmaps - almost all internet images are bitmaps

Bitmap Support Overview The System. Drawing namespace has two classes, named Image and Bitmap. ® The Bitmap class and Metafile class are derived from Image class. ® ® Bitmap file formats A bitmap has a particular height and width measured in pixels. A bitmap also has a particular color depth, which is the number of bits per pixel(bpp).

System. Drawing. Image ® Hierarchy Object Marshal. By. Ref. Object Image ® Used to declare an image object: Image image; ® Used to load various bitmap formats . bmp. gif. jpg. png. tiff. exif. wmf. emf

Loading and Drawing ® Three different methods: Obtain an image from a bitmap file on disk: Image. From. File(string filename) Obtain an image from a valid bitmap stream Image. From. Stream(System. IO. Stream stream) Obtain a bitmap object using a Win 32 GDI bitmap Image. From. Hbitmap(System. Int. Ptr hbitmap)

Image Information Image Type Size int float properties Property Accessiblity Description Size get Width get Height get Horizontal. Resolution get In dots per inch Vertical. Resolution get In dots per inch

Drawing the image ® Use the On. Paint handler to initiate the draw ® Use the Draw. Image() method from the System. Drawing. Graphics class to draw the actual image ® Sample Code protected override void On. Paint(Paint. Event. Args e) { e. Graphics. Draw. Image(image); }

Graphics. Draw. Image() ® Currently, 30 different instances exist for the Draw. Image() method ® Appropriate method is application specific void Draw. Image(Image ® Example 1, 2 image) image, int x, int y, int cx, int cy) image, Rectangle rect)

Metrics vs. Pixels ® Images by default draw with metrics for image device independence ® ® a 3 inch image is 3 inches wide on monitor and printer relies heavily on embedded resolution (image dpi) ® Pixels are a straightforward mapping of bits onto the screen ® ® One pixel (dot) on screen = one location on bitmap Image with high dpi will be smaller than image with low dpi, but will have better visual quality

Rectangular fitting ® Shows the different uses of rectangular fitting ® Use Draw. Image() with different arguments for different effects ® Examples 3, 4

Image Reflection ® If we specify a negative width, the image is flipped around the vertical axis – it’s mirror image. ® Sample Code: grfx. Draw. Image(image cx/2, cy/2, cx. Image, cy. Image); ® grfx. Draw. Image(image cx/2, cy/2, -cx. Image, cy. Image); ® grfx. Draw. Image(image cx/2, cy/2, cx. Image, -cy. Image); ® grfx. Draw. Image(image cx/2, cy/2, -cx. Image, -cy. Image); ® ® example 5

Rotate and Shear ® These two methods effectively translate, scale, shear, rotate an image into a parallelogram. Void Draw. Image(Image image, Point[ ] apt) ® Void Draw. Image(Image image, Point. F[ ] aptf) ® The array argument must contain exactly three points ® ® Apt[0] = destination of upper left corner of image. Apt[1] = destination of upper right corner of image. Apt[2] = destination of lower left corner of image. See example 6

Partial image display ® Ability to draw only a portion of the image we would like to see Let you specify a rectangular subsection of the bitmap to display. ® Example code: ® new Rectangle(0, 0 , image. Width, image. Height) See example 7

Drawing on the image ® Ability to overlap text onto the image ® To draw on an image , we need to obtain a Graphics object that refer to the image. ® Use the Draw. String() method ® Cannot use indexed bitmaps! (i. e. gifs) ® Example 8

Thumbnail The Ge. Thumbnail. Image method is intend to be used to create a ® thumbnail of an image, which is a smaller version of the image ® that an application can use to convey the contents of the image ® while saving time and space . Image GEt. Thumbnail. Image(int cx, int cy, Image Get. Thumbnail. Image. Abort gtia, In. Ptr p. Data); ® See example 9 ®

System. Drawing. Bitmap ® Derives from Image ® For applications with images that do more than just draw ® Allow developer/user to manipulate graphics at the bit level ® Icons, Animation, Image List, Picturebox

System. Drawing. Bitmap ® Image has no constructors ® Bitmap has 12 constructors: ® Bitmap(string str. Filename) ® Bitmap(Stream stream) ® Bitmap(Image image, Size size) ® Bitmap(int cx, int cy)

Bitmap Example ® Begin with two bitmaps for text length ® We see text placed on a bitmap ® Example 10 ® Try different dpi!

Binary Resources ® Embed icons and cursors within the software Whenever you create a bitmap, a cursor, or an icon file you want to use as resource. ® In visual C#. NET, when you select any bitmap, icon, or cursor file in solution Explorer that is part of a project, you’ll see a properties window for the file. Change the Build Action property to Embedded Resource. ® ® Example 11

Animation ® Uses a Timer data type to load a new image each tick ® Loads a set of bitmaps into an array for quick run-through ® See page 530 for ‘Wink’ example

Image List ® An image list is essentially just a flexible array of Image objects with the same size and color format. ® To create an object: Image. List imglst = new Image. List(); ® To add Image object to the image list: Imglist. Images. Add(image); ® Number of images in an image. List imglst. Images. Count;

Image List (cont. ) ® To return to image object imglst. Images[2]; ® Image. List. image. Collection Methods bool contains(image) Int Index. Of(image) void Remove. At(int index) void Clear()

Image List (cont. ) ® Draw Methods void Draw(Graphics grfx, Point pt, int index) void Draw(Graphics grfx, int y, int cx, int cy, int index)

Picture Box ® Another image-related control ® Descended from Control ® Properties Type image Border. Style Picture. Box. Size. Mode property Accessibility image get/set border. Style get/set Size. Mode get/set

Question?