Very, very simple VB drawing example

A guy in the newsgroups who is new to .NET, coming from VB6, is having a hard time drawing on a Form.  The problem with VB6 was it had the Shape controls which provided a crutch for a developer to never actually understand how drawing worked, and now that crutch has been removed.


Drawing is simple – you need a Graphics object to paint on.  The easiest way to get that for your Form is to just override OnPaint – you’ll get it as an input parameter.  The other nice effect is that you don’t have to do anything other than refresh the Form to get your code to run.


Now normally I don’t like to just give out the answer – no one learns much that way – but he seems to genuinely have spent several hours trying to get this, so I figured I’d throw him a bone so he doesn’t get frustrated and give up altogether.  So the goal is to draw a “crosshair” on the Form that the user can move around with the D-Pad on the device.  Again, this is a very, very basic example – it took me roughly 15 minutes to do (and that’s becasue my VB is very rusty).


Create a device WinForms app.  Select the Form and make sure KeyPreview is True.  Then add this code:


Public Class Form1
   Private crosshairs As New Rectangle(0, 0, 20, 20)
   Private bluePen As New Pen(Color.Blue)
   Private Const StepBy As Int32 = 3

Protected Overrides Sub OnPaint(ByVal e As System.Windows.Forms.PaintEventArgs)
   Dim b As New SolidBrush(Color.Blue)

   ‘ let the system do it’s normal drawing
   MyBase.OnPaint(e)

   ‘now draw our crosshairs
   DrawCrosshairs(e.Graphics)
End Sub

Private Sub DrawCrosshairs(ByRef g As Graphics)
   g.DrawEllipse(bluePen, crosshairs)
   g.DrawLine( bluePen, _
               crosshairs.Left + crosshairs.Width / 2, _
               
crosshairs.Top 10, _
               crosshairs.Left + crosshairs.Width / 2, _
               crosshairs.Bottom + 10)
   g.DrawLine( bluePen, _
               crosshairs.Left 10, _
               crosshairs.Top + crosshairs.Height / 2, _
               crosshairs.Right + 10, _
               crosshairs.Top + crosshairs.Height / 2)
End Sub

Private Sub Form1_KeyDown(ByVal sender As System.Object, ByVal e As System.Windows.Forms.KeyEventArgs) Handles MyBase.KeyDown
   If (e.KeyCode = System.Windows.Forms.Keys.Up) Then
      If crosshairs.Top >= StepBy Then
         crosshairs.Offset(0, -StepBy)
      End If
   End If
   If (e.KeyCode = System.Windows.Forms.Keys.Down) Then
      If crosshairs.Bottom <= Me.Height StepBy Then
         crosshairs.Offset(0, StepBy)
     End If
   End If
   If (e.KeyCode = System.Windows.Forms.Keys.Left) Then
      If crosshairs.Left >= StepBy Then
         crosshairs.Offset(-StepBy, 0)
      End If
   End If
   If (e.KeyCode = System.Windows.Forms.Keys.Right) Then
      If crosshairs.Right <= Me.Width StepBy Then
         crosshairs.Offset(StepBy, 0)
      End If
   End If
   ‘this forces OnPaint to be called
   Me.Refresh()
End Sub
End Class


That’s all there is to it.

1 thought on “Very, very simple VB drawing example”

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s