Login | Register   
RSS Feed
Download our iPhone app
Browse DevX
Sign up for e-mail newsletters from DevX


The Basics of GDI+ : Page 4

GDI+ is .NET's way to render low-level graphics. GDI+ uses drawing "primitives," such as lines, curves, circles, and rectangles. In addition, GDI+ supports image manipulation as well as text rendering.


The Coordinate System
Whenever you use GDI+ to draw, you use the GDI+ coordinate system. By default, the coordinate system maps directly to the pixels on your monitor. However, you may want a different behavior. You can, in fact, transform the coordinate system if you have special needs. Consider the person shape you created above. The position of that shape is defined by the graphics path object you use. But what if you wanted to draw multiple copies of that shape multiple times in multiple locations?

The easiest way to do so is to alter the virtual coordinate system. The Graphics object offers a number of methods to do so. Here's an example:

   g.DrawPath(Pens.Black, Person)
   g.TranslateTransform(75, 0)
   g.DrawPath(Pens.Black, Person)
This draws the first person shape at the default position, then moves the origin (point 0,0) of the coordinate system 75 pixels to the right, and draws the shape again. Without the ability to move the coordinate system around, you'd have to create another person path identical to the first one, but located at a different position.

You need to reset the transformation after GDI+ completes the drawing operation in your virtual coordinate system. Otherwise, GDI+ will offset your future drawings to the right.

You may notice that the person shape in my figures seems to be a bit bigger than the one you get when you run the samples. That's because I made GDI+ zoom the shape before I took the screen shot. I used the following scale transformation to do the zooming trick:

   g.ScaleTransform(2, 2)
   g.DrawPath(Pens.Black, Person)
This zooms everything by a factor of 2 on both axes. You could zoom at different factors for each axis. For instance, you could leave the height of the person at the original level, but change the horizontal zoom:

   g.ScaleTransform(2, 1)
Of course, this makes the little guy look terribly overweight. Most of the time you should zoom at equal factors for both axes.

Another interesting transformation of the coordinate system is its ability to rotate. This allows for fancy tricks such as rendering text at an angle:

   g.TranslateTransform(100, 50)
   g.DrawString("Cool Text", _  New Font("Arial Black", 20), _  Brushes.Blue, 0, 0)

Figure 7: Drawing text at an angle using a transform and a subsequent rotate translation.

This example moves the origin to a new point and then performs a subsequent rotation. Drawing the text then becomes trivial, as you render it at (virtual) position 0,0. Figure 7 shows the result as well as an illustration of the performed transformations.

Figure 8: Drawing text at an angle using a rotate transformation with a subsequent transform translation.
Note that the order in which you perform transformations is of crucial importance. Figure 8 shows what happens if you change the order of transformations As you can see, the resulting position of the text string is different. because I moved the coordinate system. Transformations can be very tricky to do correctly. I generally recommend that you perform rotations after all coordinate movement.

Markus Egger is the President and Chief Software Architect of EPS Software Corp., located in Houston, Texas. He is also the founder of EPS Software Austria, located in Salzburg. Markus concentrates on consulting and development of custom software based on Microsoft technologies. His passion lies with object-oriented technology. Markus is an international author and speaker, and is the publisher of CoDe Magazine. For the past 8 years, Markus has received the Microsoft MVP award, originally for Visual FoxPro, and now for C#. Several applications he has worked on (mostly as project manager) have received Microsoft Excellence Award nominations. You can find a full bio on the Web at http://www.eps-cs.com and http://www.MarkusEgger.com. Email Markus at megger@eps-software.com
Comment and Contribute






(Maximum characters: 1200). You have 1200 characters left.



Thanks for your registration, follow us on our social networks to keep up-to-date