1. Mark Dixon, SoCCE SOFT 131Page 1 16 – Visual BASIC 6.0

2. Mark Dixon, SoCCE SOFT 131Page 2 Session Aims & Objectives Aims –introduce you to the fundamentals of: VB6 development environment sound, and graphics Objectives, by end of this week’s sessions, you should be able to: –develop 'stand alone' applications –put bitmap (raster) graphics into your applications –draw simple vector graphics in your applications –play MP3 and WAV files in your applications

3. Mark Dixon, SoCCE SOFT 131Page 3 VB6 IDE Microsoft Visual BASIC 6.0 IDE: Integrated Development Environment –Screen (form) designer –Code editor –Debugger –Help Start menu, Programs, University Software, M, Microsoft Visual Studio 6.0

4. Mark Dixon, SoCCE SOFT 131Page 4 VB6 IDE: Save Project (properly) 1.Click Save button 2.Create New Folder 3.Save: –project file (.vbp) –form files (.frm)

5. Mark Dixon, SoCCE SOFT 131Page 5 VB6 IDE: Screen (Form) Designer Drag and Drop Controls from the ToolBox onto the Form, & change properties

6. Mark Dixon, SoCCE SOFT 131Page 6 VB6 IDE: Code Editor Type code into the code window

7. Mark Dixon, SoCCE SOFT 131Page 7 Run your program (F5), or Step through line by line (F8) Immediate Window: code executed immediately VB6 IDE: Debugger Run Pause Stop

8. Mark Dixon, SoCCE SOFT 131Page 8 Version Control: Copy Folder At regular intervals use Windows Explorer to copy whole folder to create new version –drag the folder and hold down CTRL key

9. Mark Dixon, SoCCE SOFT 131Page 9 Version Control: Rename Folder Rename the copy of the folder, using the date and time it was created:

10. Mark Dixon, SoCCE SOFT 131Page 10 Software Development Cycle Software development follows this pattern: –analyse problem –design solution –implement (code) solution –test & debug solution (code) However, it is: –cyclic/iterative (not linear)

11. Mark Dixon, SoCCE SOFT 131Page 11 Example: PicView - Analysis SPECIFICATION User Requirements –display photos quickly and easily one after another Software Requirements –Functional: –change current folder and drive –display list of picture files in current folder –display picture (*.jpg, *.bmp, and *.gif) from files in current folder –Non-functional should be quick and easy to use PicView

12. Mark Dixon, SoCCE SOFT 131Page 12 Types of Graphics: Raster Raster graphics – made of dots (pixels – picture elements) –stored in.jpg,.bmp, and.gif files (picture property) –suitable for complex, static pictures (e.g. photos) –difficult to change programmatically –loses quality when enlarged:

13. Mark Dixon, SoCCE SOFT 131Page 13 Types of Graphics: Vector Vector graphics – made of objects (lines, circles, etc.) –not available in VB Script or HTML –suitable for simple, dynamic pictures (diagrams) –No loss of quality when enlarged

14. Mark Dixon, SoCCE SOFT 131Page 14 Controls Picture Box: display pictures Drive List Box: allow user to select disk drive Directory List Box: allow user to select folder File List Box: allow user to select file

15. Mark Dixon, SoCCE SOFT 131Page 15 Controls' Properties Picture Box (pic) –Picture: allows display of bitmap (raster graphic) as background Drive List Box (drv) –Drive: the currently selected disk drive Directory List Box (dir) –Path: the currently selected directory (folder) File List Box (fil) –Path: the currently selected folder/directory –Pattern: only display this type of file (e.g..jpg) –FileName: the currently selected file

16. Mark Dixon, SoCCE SOFT 131Page 16 Example: PicView - Design User interface design: Functional design: Trigger (when)Actions (what) click event of Drive Boxmake drive current (directory box points to this drive) click event of Directory Boxmake folder current (file box points to this folder) click event of File Boxdisplay selected picture in picture box

17. Mark Dixon, SoCCE SOFT 131Page 17 Example: PicView - Code Option Explicit Private Sub drvMain_Change () dirMain.Path = drvMain.Drive End Sub Private Sub dirMain_Change () filMain.Path = dirMain.Path End Sub Private Sub filMain_Click () picMain.Picture = LoadPicture(filMain.Path & "\" & filMain.FileName) End Sub drvMain dirMain picMain filMain

18. Mark Dixon, SoCCE SOFT 131Page 18 Vector Graphics: Grid System the origin (position 0,0) is at top left –in mathematics it is always bottom left

19. Mark Dixon, SoCCE SOFT 131Page 19 Picture Box: Drawing Methods Methods (vector graphics) –Line: draws a straight line between 2 points –Circle: draws a circle –PSet: draws a dot (point) –Cls: clears (screen) drawing area

20. Mark Dixon, SoCCE SOFT 131Page 20 Example: Shapes Form and Picture Box control support graphics methods: 0 20001000 0 picDisplayArea.Line (500, 200)-(1900, 800) picDisplayArea.Line -(2600, 600) picDisplayArea.Line -Step(-600, -400) picDisplayArea.PSet (1500, 1000) picDisplayArea.Circle (700, 900), 300 Shapes

21. Mark Dixon, SoCCE SOFT 131Page 21 Example: StickMan Enabled property (true or false) StickMan

22. Mark Dixon, SoCCE SOFT 131Page 22 Example: Face Face

23. Mark Dixon, SoCCE SOFT 131Page 23 Example: Music Player - Analysis User Requirement: –to play different music for long time without interruption, at same location (while working or at party) Software Requirements Specification software should: –allow user to: select track (MP3 file) from folder on disk play selected track –automatically move to next track in folder go back to first after last has played later lecture

24. Mark Dixon, SoCCE SOFT 131Page 24 Additional Controls VB has hundreds of controls To include additional controls in your project: –Project menu –Components item Multimedia Control –plays MP3 & WAV files

25. Mark Dixon, SoCCE SOFT 131Page 25 Multimedia Controls' Properties Multi-media Control –FileName: name of file to play –Command: controls playback

26. Mark Dixon, SoCCE SOFT 131Page 26 Example: Music Player - Design Compare the following User Interface Designs: V0 V1

27. Mark Dixon, SoCCE SOFT 131Page 27 Example: Music Player - Code Option Explicit Private Sub drvMain_Change() dirMain.Path = drvMain.Drive End Sub Private Sub dirMain_Change() filMain.Path = dirMain.Path End Sub Private Sub filMain_Click() mmcMain.Command = "Close" mmcMain.FileName = filMain.Path & "\" & filMain.FileName mmcMain.Command = "Open" End Sub drvMaindirMain filMainmmcMain

28. Mark Dixon, SoCCE SOFT 131Page 28 Example: Face v2 Face

29. Mark Dixon, SoCCE SOFT 131Page 29 Tutorial Exercise: PicView Task 1: Get the PicView example (from the lecture) working. Task 2: Get the StickMan example (from the lecture) working. Task 3: Get the Music Player example (from the lecture) working. Task 4: Modify your program to automatically go the next track after the current one ends. Task 5: Modify your program to automatically go the first track after the last one ends. Task 6: Get the Face v2 example (from the lecture working).