COM148X1Interactive Programming

Lecture 6

Topics Today

Generate Random Numbers Graphics Animation

Generate Random Number

In VB, random numbers can be generated using Rnd() function

Rnd() function returns random number in the range [0 … 1) (include 0 but exclude 1)

Example x = Rnd() ‘0 ≤ x < 1 x = Rnd() * 5 ‘0 ≤ x < 5 x = Int(Rnd() * 5) + 1 ‘1 ≤ x ≤ 5, integer only

Randomize() Function

The number sequence generated by Rnd() will be the same when the application start

Randomize() function is used to shuffle the sequence again

Call Randomize() once when the application start

Pseudo Random Number

Sometimes, non-repeatable random number is required, for example, shuffle a deck of card (A, 2, 3, … , J, Q, K)

Use the technique called pseudo random number to generate non-repeatable random number

Pseudo Random Number Algorithm

Use array to store all number

Use Rnd() function to pick two array position randomly and then SWAP the content

Repeat the step above several times and use the array as random result

2 3 4 5 6 7 8 9 10 11 12 131

2 10 4 5 6 7 8 9 3 11 12 131

4 7 1 13 6 8 12 2 5 3 9 1011

Pseudo Random Number Example

Dim cards(13) As Integer

Dim j, k, card1, card2 As Integer

For j = 1 To 13

cards(j) = j

Next j

PseudoRandom(cards)

Pseudo Random Number Example (cont’)

‘Perform pseudo random from 1 … UBound(a)

Sub PseudoRandom(ByRef a() As Integer)

For k = 1 to 10000

card1 = Int(Rnd() * UBound(a)) + 1

card2 = Int(Rnd() * UBound(a)) + 1

Swap(a(card1), a(card2))

Next k

End Sub

Pseudo Random Number Example (cont’)

Sub Swap(ByRef x As Integer, ByRef y As Integer)

Dim temp As Integer = x

x = y

y = temp

End Sub

Graphics

Coordinate System

Coordinate of form use (x, y) coordinate system

Upper left corner is the origin x value increase from left to right y value increase from top to bottom All UI controls use their upper left corner as

their reference position

Coordinate Systemx

y

(0, 0)

(300,300)

(120, 50)

Point Class

Point object represents a coordinate Example

Dim p As new Point(10, 20)Dim x, y As Integerx = p.X() ‘x = 10y = p.Y() ‘y = 20 ‘change coordinatep = new Point(100, 150)

Color Class

Color object represents a color Default color available for use

Black, Silver, Gray, White, Maroon, Red, Purple, Fuchsia, Green, Lime, Olive, Yellow, Navy, Blue, Teal, Aqua …

Example Dim c1 As Color = Color.Green ‘use default color Dim c2 As Color

c2.FromArgb(128, 128, 128) ‘RGB value

SolidBrush Class

Brushes specified how to fill an object SolidBrush specified which color used to fill a

n object Dim brush_name As New SolidBrush(color)

Example Dim b As SolidBrush(Color.Red)

Pen Class

Pen class is used to draw difference kinds of lines and curves

Dim pen_name As New Pen(brush,width) Example

Dim b As New SolidBrush(Color.Red)Dim p As New Pen(b, 1.5)

Graphics Class

Before start drawing on UI controls, Graphics object of the UI control is required

Use CreateGraphics() method of the UI control to obtain Graphics object

Example Dim g As Graphicsg = Panel1.CreateGraphics()

Commonly Use Graphics Functions

Function Description

DrawLine(pen, p1, p2) Draw line from p1 to p2

DrawRectangle(pen, x, y, w, h) Draw w x h rectangle with top left corner at (x, y)

DrawEllipse(pen, x, y, w, h) Draw w x h ellipse with top left corner at (x, y)

DrawPolygon(pen, points()) Draw polygon by given array of points

DrawCurve(pen, points()) Draw curve by given array of points

Commonly Use Graphics Functions

Function Description

FillRectangle(brush, x, y, w, h) Fill w x h rectangle with top left corner at (x, y)

FillEllipse(brush, x, y, w, h) Fill w x h ellipse with top left corner at (x, y)

FillPolygon(brush, points()) Fill polygon by given array of points

Fill ClosedCurve(brush, points())

Fill closed curve by given array of points

Graphics Functions Example

Dim g As Graphics

g = Panel1.CreateGraphics()

Dim brush1 As New SolidBrush(Color.Red)

Dim pen as New Pen(brush1, 10)

g.DrawLine(pen, p1, p2)

Dim brush2 As New SolidBrush(Color.Green)

g.FillRectangle(brush, p1.X(), p1.Y(), 100, 150)

Animation

Image Preparation

Use ImageList control to prepare a set of images for application

Properties of ImageList

Images is set of Images, index start from 0 ImageSize is the size of image, maximum siz

e is 256x256 Number of images in the ImageList can be fo

und in the Count properties of Images Example

x = ImageList1.Images.Count

Show Picture (Image)

Use picture control to make different animation effects

Properties of PictureBox Control

Location represents the top-left corner of PictureBox Top represents the top most coordinate of PictureBo

x Left represents the left most coordinate of PictureBo

x Width represents the width of PictureBox Height represents the height of PictureBox Image represents the picture showing in the Picture

Box, set Image to Nothing in order to make the PictureBox shows nothing

Example PictureBox1.Image = Nothing

Playing Animation

Use Timer control to control the frame rate of animation and make the application responsive to other event when the animation is playing

Animation Example

‘move image from left to right while playing ‘image sequence inside PictureBoxDim i As Integer = 0Private Sub Timer1_Tick(ByVal sender As System.Obj

ect, ByVal e As System.EventArgs) Handles Timer1.Tick

Dim x, y as Integerx = PictureBox1.Location.X + 1y = PictureBox1.Location.YPictureBox1.Location = new Point(x, y)PictureBox1.Image = ImageList1.Images(i)i = (i + 1) mod ImageList1.Images.Count

End Sub