Programming: Drawing
Description
This assignment requires you to complete the dynamic drawing components of the Date/Time Control Panel from the previous two programming assignments. In particular, you will be moving the map found in the "Time Zone" tab when the time zone changes and will be drawing a clock face corresponding to the time setting.
Recall that the image used for displaying the map (in a PictureBox control) has been prepared with one pixel corresponding to each degree of longitude and has been drawn long enough to be displayed at any setting from 0 to 360 degrees. Each time the time zone is changed, you should redraw the PictureBox control containing the map to indicate the approximate position of the time zone on the globe. This can be done by converting the number of minutes offset from GMT into degrees of rotation of the earth. Recall that 24 hours (= 1440 minutes) of offset corresponds to 360 degrees and that the map image has been drawn with one pixel for each degree. Finally, note that the map image has been prepared so that displaying its left edge at 0 corresponds to centering the image at 0 degrees (= GMT - 12 hours).
You should assign the map image (see the resources below) to the Image property of the PictureBox control using the Properties editor in Visual Basic. This will allow you to access the image easily when it needs to be redrawn in a new position. Each time the time zone offset changes you should redraw the Image in the PictureBox control. This can be done by first computing a drawing offset for the image. To do this, first compute a rotation from the GMT offset, and then convert that rotation into pixels. A rotation of N degrees corresponds to an offset of -N pixels indicating that the left edge of the image appears N pixel to the left of the PictureBox origin. Once a drawing offset has been computed the actual map image may be drawn using the Graphics DrawImage routine. If the PictureBox is called mapPicture and the computed offset is screenOffset , then drawing would be done with the statement:
e.Graphics.DrawImage(mapPicture.Image, screenOffset, 0)
The second portion of this assignment is to draw a clock face in the PictureBox found on the "Date & Time" tab. As shown below, this clock face should reflect the current time setting. Consequently, it should be redrawn whenever the hour, minute, or second setting changes.
In drawing the clock face, you may find the following
Graphics
methods to be useful:
-
DrawLine
-
FillPolygon
-
FillEllipse
Finally, the routines clockX() and clockY()( which are provided in the resources section below) may be useful. These routines compute the x and y positions of a point on the clock face at a given minute and at a given distance from the center of the clock (assuming that the center of the clock is at location 0,0). The following example code draws a small black circle at the 35-minute position of a clock centered in a PictureBox given as a parameter.
Public Sub drawDotAt35Minutes(ByVal onObj As PictureBox, ByVal e as Windows.Forms.PaintEventArgs)
Const clockInset As Integer = 100 ' distance from clock edge to box edge
Const dotRadius As Integer = 15 ' size of the dot
Dim smallDim As Integer ' smaller of width and height of box
Dim clockRadius As Integer ' radius of the clock
Dim centerX As Integer ' x for center of the clock
Dim centerY As Integer ' y for center of the clock
Dim x As Integer ' x position of dot
Dim y As Integer ' y position of dot
Dim brush As new SolidBrush(Color.Black) 'brush
' calculate the center of the clock and its radius so it fits in the box
centerX = onObj.Width / 2
centerY = onObj.Height / 2
smallDim = onObj.Width
If (onObj.Height < smallDim) Then
smallDim = onObj.Height
End If
clockRadius = smallDim / 2 - clockInset
' calculate the position of the dot
x = centerX + clockX(35, clockRadius - dotRadius)
y = centerY + clockY(35, clockRadius - dotRadius)
' draw a filled black circle
e.Graphics.FillEllipse(brush, x, y, dotRadius, dotRadius)
End Sub
Resources
-
Map image
This image is scaled with each pixel corresponding to one degree of longitude. You can download the image here: time_zone_map.gif
-
Clock drawing helper routines
The following routines compute the x and y positions of a point on a clock face, assuming that the clock is centered at 0,0. They each take a minute value to define a location along the clock, as well as a radius that defines how far away from the center of the clock the point should be.
Public Function clockDrawX(minuteVal As Integer, radius As Integer)
Const PI As Double = 3.14159265
Dim angle As Double
angle = (PI * 2 * minuteVal) / 60 - PI / 2
Return CInt(radius * Cos(angle))
End Function
Public Function clockDrawY(minuteVal As Integer, radius As Integer)
Dim angle As Double
Dim PI As Double
PI = 3.14159265
angle = (PI * 2 * minuteVal) / 60 - PI / 2
Return CInt(radius * Sin(angle))
End Function
-
Sample Solution
An executable like the application you are asked to create, click Ex8.zip
.
Submission
Submit the following files:
- A project archive named Exercise8.zip