Question

In this part of the Visual Basic Qyoto programming tutorial, we will create a Nibbles game clone.

Nibbles is an older classic video game. It was first created in late 70s. Later it was brought to PCs. In this game the player controls a snake. The objective is to eat as many apples as possible. Each time the snake eats an apple, its body grows. The snake must avoid the walls and its own body.

Development

The size of each of the joints of a snake is 10px. The snake is controlled with the cursor keys. Initially, the snake has three joints. The game starts immediately. When the game is finished, we display "Game Over" message in the center of the window.

board.vb

Imports Qyoto

NameSpace BoardSpace

public class Board 
  Inherits QFrame 

  Const WIDTH As Integer = 300
  Const HEIGHT As Integer = 300
  Const DOT_SIZE As Integer = 10
  Const ALL_DOTS As Integer = 900
  Const RAND_POS As Integer = 30
  Const DELAY As Integer = 140

  Dim x(ALL_DOTS) As Integer 
  Dim y(ALL_DOTS) As Integer 

  Dim dots As Integer
  Dim apple_x As Integer
  Dim apple_y As Integer

  Dim left As Boolean = False
  Dim right As Boolean = True

  Dim up As Boolean = False
  Dim down As Boolean = False
  Dim inGame As Boolean = True

  Dim timer As QBasicTimer 
  Dim ball As QImage 
  Dim apple As QImage
  Dim head As QImage


  Public Sub New() 
    
    Me.SetStyleSheet("QWidget { background-color: black }")

    Me.FocusPolicy = Qt.FocusPolicy.StrongFocus

    Try 
      ball = New QImage("dot.png")
      apple = New QImage("apple.png")
      head = New QImage("head.png")
    Catch e As Exception 
      Console.WriteLine("Cannot read images")
      Console.WriteLine(e.Message)
      Environment.Exit(1)
    End Try
    
    
    Me.InitGame()
    
  End Sub


  Private Sub InitGame() 

    dots = 3
    
    For z As Integer = 0 To dots-1 
      x(z) = 50 - z*10
      y(z) = 50
    Next

    Me.LocateApple()

    timer = New QBasicTimer()
    timer.Start(DELAY, Me)
    
  End Sub


  Protected Overrides Sub PaintEvent(ByVal e As QPaintEvent) 

    Dim painter As New QPainter()
    painter.Begin(Me)

    If inGame
      Me.DrawObjects(painter)
    Else 
      Me.GameOver(painter)
    End If
     
    painter.End()
    
  End Sub

  Private Sub DrawObjects(ByVal painter As QPainter) 

    painter.DrawImage(apple_x, apple_y, apple)

    For z As Integer = 0 to dots - 1
      If z = 0
        painter.DrawImage(x(z), y(z), head)
      Else 
        painter.DrawImage(x(z), y(z), ball)
      End If 
    Next
    
  End Sub

  Private Sub GameOver(ByVal painter As QPainter) 
  
    Dim msg As String = "Game Over"
    
    Dim small As New QFont("Helvetica", 12)
    small.SetBold(True)
    Dim metr As New QFontMetrics(small)
    
    Dim textWidth As Integer = metr.Width(msg)
    Dim h As Integer = Me.Height
    Dim w As Integer = Me.Width

    painter.SetPen(New QPen(New QBrush(Qt.GlobalColor.white), 1))

    painter.SetFont(small)
    painter.Translate(New QPoint(w/2, h/2))
    
    Dim text_x As Integer = -textWidth / 2
    Dim text_y As Integer = 0
    
    painter.DrawText(text_x, text_y, msg)
    
  End Sub


  Private Sub CheckApple()

    If x(0) = apple_x And y(0) = apple_y
    
      dots += 1
      Me.LocateApple()
      
    End If
    
  End Sub
 
  Private Sub Move() 

    For z As Integer = dots To 1 Step -1
      x(z) = x(z - 1)
      y(z) = y(z - 1)
    Next

    If left
      x(0) -= DOT_SIZE
    End If

    If right
      x(0) += DOT_SIZE
    End If
      
    If up 
      y(0) -= DOT_SIZE
    End If

    If down 
      y(0) += DOT_SIZE
    End If
      
  End Sub


  Private Sub CheckCollision() 

    For z As Integer = dots To 1 Step -1
      If z > 4 And x(0) = x(z) And y(0) = y(z) 
        inGame = False
      End If
    Next   
  
    If y(0) > HEIGHT 
      inGame = False
    End If
  
    If y(0) < 0 
      inGame = False
    End If
  
    If x(0) > WIDTH 
      inGame = False
    End If

    If x(0) < 0 
      inGame = False
    End If
      
  End Sub
    
  
  Private Sub LocateApple() 
  
    Dim rand As New Random()

    Dim r As Integer = rand.Next(RAND_POS)
    
    apple_x = r * DOT_SIZE
    r = rand.Next(RAND_POS)
    apple_y = r * DOT_SIZE
     
    
  End Sub

  Protected Overrides Sub TimerEvent(ByVal e As QTimerEvent) 
     
    If inGame
      Me.CheckApple()
      Me.CheckCollision()
      Me.Move()
    Else 
      timer.Stop()
    End If

    Me.Repaint()
    
  End Sub
  
  Protected Overrides Sub KeyPressEvent(ByVal e As QKeyEvent)
  
    Dim key As Integer = e.Key()
    
    If key = Qt.Key.Key_Left And Not right
      left = True
      up = False
      down = False
    End If
    
    If key = Qt.Key.Key_Right And Not left 
      right = True
      up = False
      down = False      
    End If
    
    If key = Qt.Key.Key_Up And Not down
      up = True
      right = False
      left = False
    End If
    
    If key = Qt.Key.Key_Down And Not up
      down = True
      right = False
      left = False     
    End If
    
  End Sub  
  
End Class

End Namespace

First we will define some globals used in our game.

The WIDTH and HEIGHT constants determine the size of the Board. The DOT_SIZE is the size of the apple and the dot of the snake. The ALL_DOTS constant defines the maximum number of possible dots on the Board. The RAND_POS constant is used to calculate a random position of an apple. The DELAY constant determines the speed of the game.

Dim x(ALL_DOTS) As Integer 
Dim y(ALL_DOTS) As Integer 

These two arrays store x, y coordinates of all possible joints of a snake.

The InitGame() method initializes variables, loads images and starts a timeout function.

If inGame
  Me.DrawObjects(painter)
Else 
  Me.GameOver(painter)
End If

Inside the PaintEvent() method, we check the inGame variable. If it is true, we draw our objects. The apple and the snake joints. Otherwise we display "Game over" text.

Private Sub DrawObjects(ByVal painter As QPainter) 

  painter.DrawImage(apple_x, apple_y, apple)

  For z As Integer = 0 to dots - 1
    If z = 0
      painter.DrawImage(x(z), y(z), head)
    Else 
      painter.DrawImage(x(z), y(z), ball)
    End If 
  Next
  
End Sub

The DrawObjects() method draws the apple and the joints of the snake. The first joint of a snake is its head, which is represented by a red circle.

Private Sub CheckApple()

  If x(0) = apple_x And y(0) = apple_y
  
    dots += 1
    Me.LocateApple()
    
  End If
  
End Sub

The CheckApple() method checks if the snake has hit the apple object. If so, we add another snake joint and call the LocateApple() method, which randomly places a new apple object.

In the Move() method we have the key algorithm of the game. To understand it, look at how the snake is moving. You control the head of the snake. You can change its direction with the cursor keys. The rest of the joints move one position up the chain. The second joint moves where the first was, the third joint where the second was etc.

For z As Integer = dots To 1 Step -1
  x(z) = x(z - 1)
  y(z) = y(z - 1)
Next

This code moves the joints up the chain.

If left
  x(0) -= DOT_SIZE
End If

Move the head to the left.

In the CheckCollision() method, we determine if the snake has hit itself or one of the walls.

For z As Integer = dots To 1 Step -1
  If z > 4 And x(0) = x(z) And y(0) = y(z) 
    inGame = False
  End If
Next   

We finish the game if the snake hits one of its joints with the head.

If y(0) > HEIGHT 
  inGame = False
End If

We finish the game if the snake hits the bottom of the Board.

The LocateApple() method locates an apple randomly on the board.

Dim rand As New Random()

Dim r As Integer = rand.Next(RAND_POS)

We get a random number from 0 to RAND_POS - 1.

apple_x = r * DOT_SIZE
...
apple_y = r * DOT_SIZE

These line set the x, y coordinates of the apple object.

If inGame
  Me.CheckApple()
  Me.CheckCollision()
  Me.Move()
Else 
  timer.Stop()
End If

Every 140 ms, the TimerEvent() method is called. If we are in the game, we call three methods that build the logic of the game. Otherwise we stop the timer.

In the KeyPressEvent() method of the Board class, we determine the keys that were pressed.

If key = Qt.Key.Key_Left And Not right
  left = True
  up = False
  down = False
End If

If we hit the left cursor key, we set left variable to true. This variable is used in the Move() method to change coordinates of the snake object. Notice also that when the snake is heading to the right, we cannot turn immediately to the left.

nibbles.vb

' ZetCode Mono Visual Basic Qt tutorial
'
' In this program, we create
' a Nibbles game clone
'
' author jan bodnar
' last modified May 2009
' website www.zetcode.com


Imports Qyoto
Imports BoardSpace

Public Class VBQApp 
  Inherits QMainWindow

  Dim WIDTH As Integer = 250
  Dim HEIGHT As Integer = 150

  Public Sub New()
  
    Me.SetWindowTitle("Nibbles")

    Dim board As New BoardSpace.Board()
    Me.SetCentralWidget(board)

    Me.Resize(310, 310)
    Me.Move(300, 300)
    Me.Show()
    
  End Sub
  

  Public Shared Sub Main(ByVal args() As String)
    Dim qapp As New QApplication(args)
    Dim app As New VBQApp
    QApplication.Exec()
  End Sub

End Class

In this class, we set up the Nibbles game.

Figure: Nibbles

This was the Nibbles computer game programmed with the Qyoto library and the Visual Basic programming language.