CPSC 481 Assignment 3:
VB Intro Stuff part 4

Note: November 11 2000 @ 6:00 PM - fixed a couple of steps in the data environment section of the software design.

Note: Lots more example programs (including these) on the 481 website at:

• http://www.cpsc.ucalgary.ca/~saul/hci_topics/vb_examples/index.html

Contents:

• Download and Run Example Program 7
• Build Example Program 7 from Scrach
  • Database Design
  • Software Design
    

Download and Run Example Program 7

This program is yet another swing on the ADO stuff. This time we're using the *ahem* "recommended" database access mechanism for hitting Access Databases from VB. This took a while to figure out, actually, and I'd like to credit Shaun upstairs here for helping out on this one quite a bit (he's the one that found it and pointed it out to me!!). :)

One of the possible disadvantages of this method is that you can't use the app.path property to specify the install directory of your application (although I bet there is a way). But you can just specify a filename for your database without a path and as long as you never change the path that your application is looking at (with a Common Dialog or something) you should be safe. Anyways, this is a cute example and actually works quite well.

Click here to download

Okay, the steps to follow:

1. Just save the file to your desktop.
2. Double click the file to open it with winzip.

3. The project file for the cheap database program

   Click "Extract" and extract the file to your desktop (note: you need to extract both files).
4. On your desktop, you should now have a folder called "DataEnvironment"
5. Go in there and double-click "Projcet1.vbp" (.vbp stands for "Visual Basic Project")
6. Now, you should get VB loaded up with that project, no problem!

With that going, you can push the play button (center of the top tool bar) and see what it looks like. There are a couple of things you can do with it:

• You can add CDs to the Database by entering some info in the textboxes and pushing the "Add This Info" button
  • This has changed: now, the "Add Entry" button will not enable until all three textboxes contain text.
  • The "Track Count" textbox will only accept numeric characters
  • This program does not check for duplicate entries in the database. If you do that, it'll crash. :)
• You can select a row from the grid and hit the "Remove Selected" button to remove it permanently from the database
• The form now resizes properly. So, if you resize the form, the grid and frames will resize appropriately (to a certain point)

The new improved CD Collector program window

Pretty amazing, eh? :) Okay, so maybe not so amazing by this stage in the game. :)

Building Example Program 7 from Scratch

This version is a little smaller than the last one, but more weird to develop. :) Let's get right into it, you'll probably already recognize the Database routine.

The Database Design

1. Open up MS Access (Start - Programs - Microsoft Access)
2. Pick "Start a blank database" from the wizard that pops up
3. Pick a spot to save the mdb file and a name for it (mine was "CDCollectionA.mdb")
4. You'll get to the following window, where you double click on "Create a table in design view:"

the database design main window

5. When you double click that "create table in design view" thingie, you get to this window:

The table design view window

6. You want to follow the following steps to get the table I was working with:
   1. Make a field called ArtistName whose type is Text
   2. Make a field called AlbumTitle whose type is Text
   3. Make a field called Tracks whose type is Number (just a long integer is cool enough)
   4. Select the rows in the design view (as pictured above) that have ArtistName and AlbumTitle
   5. Right-click on that selection, and pick Primary Key from the menu you get. This will make both fields into primary keys. The idea is that they can be primary because you'll never have identical artist names and album titles (otherwise what's the point?!).
7. Once you've got your table built, just close that window. You'll be automatically prompted to save changes to the table design and to give the table a name. I picked CDs, how original. :)
8. Once that's all done, you can either add a couple entries to the database by double clicking the CDs table from the database design main window and inputting them manually or just move on to:

Software Design

Okay, a bit of this is going to be pretty tedious. :) Here we go:

1. Start up VB with a Standard EXE project.
2. Save that project to the same folder that your Database was saved in.
3. Go to the Project menu and select Components. In the Designers tab, select the checkbox for Data Environment and click OK.

the references - designers window

4. This will add an item to your project menu. Go to the new menu item and select it from Project - Add Data Environment.
5. The following window will pop up, and in it you should right-click on Connection1 and select the Properties item from the list:

the DataEnvironment edit window

6. Okay, the first thing we need to do is set up the connection to the database (which is what Connection1 will be to the rest of the application). When the properties window comes up,
   1. select Microsoft Jet 4.0 OLE DB Provider as the data you want to connect to and click Next
   2. browse for your Database file, select it, and then remove the path (so in the picture below, the highlighted text will get deleted)
   3. you can test the connection to the database by pressing the Test Connection button, but it should work fine.

the Data Link properties dialog box

7. Once that's set, just hit OK.
8. Next, right-click on Connection1 in the Data Environment window like you did above and pick Add Command. You'll see a thing called Command1 pop up heirarchically underneath the happy Connection1.
9. Right-click on Command1 and select Properties from the menu that pops up and do the following to customize Command1:
   1. Change Command Name to DataTable
   2. Select the SQL Statement radio button
   3. In the textbox underneat that radio button, enter the query: select * from CDs order by ArtistName, AlbumTitle
   4. In the Advanced tab, change the Lock Type (it's a combo-box) from 1-Read Only to 3-Optimistic so that you can write to the database.
   5. Press Apply, then OK, and you're good to go with your command.

the command properties window

10. Now comes the cool part. :) Right click and hold the button on DataTable in the Data Environment window, and drag to your main form.
11. When you release the right button on your form, you'll get a popup menu, from which you should select Data Grid
12. When you release the button, presto! You get a data grid on your form that will be perfectly connected to your database. Push the play button to see what I mean. In any case, a lot of the rest will start to look kind of familiar to you.

right-click-drag from DataTable to the form to drop a pre-bound data display!!

13. Add two frames to the form using the tool and drawing them on the form.
    • Change for one frame:
      • its caption to Add Entry
      • its (name) to fraAddEntry
    • Change for the other (second) frame:
      • its caption to Remove Entry
      • its (name) to fraRemoveEntry
    1. Draw the following controls in the Add Entry frame (yes, actually in the frame):
       1. A text box with the (name) txtArtistName
       2. A label above that text box with the caption Artist Name
       3. A text box with the (name) txtAlbumTitle
       4. A label above that text box with the caption Album Title
       5. A text box with the (name) txtTrackCount
       6. A label above that text box with the caption Number of Tracks
       7. A command button with the (name) cmdAddEntry and the caption Add this info
    2. Now, to the Remove Entry frame, add the following controls:
       1. A command button with the (name) cmdRemoveEntry and the caption Remove Selected
       2. A label with the caption Select the entry you want to remove and click the button:
14. In the form design window, double click the form, which should bring up the code window with a blank Form_Load() subroutine. Here be's the code, which looks a lot simpler than last time, but the same size-tracker variables are defined globally:

Option Explicit
' couple'o global vars for size trackin'
Dim MinHeight As Long
Dim MinWidth As Long

Private Sub Form_Load()
    ' record the height and size of the window for reference
    MinHeight = Form1.Height
    MinWidth = Form1.Width
    
    ' disable the add button
    cmdAddEntry.Enabled = False
End Sub

15. Okay, that's done. From the event ComboBox at the top of the code window, pick the Resize event. You should then get a shell for the Form_Resize() method. This gets called whenever you resize the form, and we'll just use it to make a resized form look pretty. Here's what to fill in:

Private Sub Form_Resize()
    ' check to see if the form is getting too small (Note: this is just to avoid
    ' the math necessary to shrink all the textboxes, hahahaha!!)
    If MinHeight > Form1.Height Then
        Form1.Height = MinHeight
        Exit Sub
    ElseIf MinWidth > Form1.Width Then
        Form1.Width = MinWidth
        Exit Sub
    End If
    
    ' resize the flexgrid to fit nicely on the screen
    DataGrid1.Width = Form1.ScaleWidth
    DataGrid1.Height = Form1.ScaleHeight / 2

    ' resize the happy columns to look pretty (40% for each text column, 20% for Track)
    DataGrid1.Columns(0).Width = 0.4 * DataGrid1.Width
    DataGrid1.Columns(1).Width = DataGrid1.Columns(0).Width
    DataGrid1.Columns(2).Width = DataGrid1.Width - (DataGrid1.Columns(0).Width * 2) - 60

    ' reposition  and resize the frames on the screen to fit nicely (there was no
    ' science here, just did it by trial and error)
    fraAddEntry.Top = (Form1.ScaleHeight / 2) + 100
    fraAddEntry.Height = (Form1.ScaleHeight / 2) - 150
    fraAddEntry.Width = (Form1.ScaleWidth * 0.64)
    fraRemoveEntry.Height = (Form1.ScaleHeight / 2) - 150
    fraRemoveEntry.Top = (Form1.ScaleHeight / 2) + 100
    fraRemoveEntry.Width = (Form1.ScaleWidth * 0.36) - 100
    fraRemoveEntry.Left = fraAddEntry.Width + 100
End Sub

16. Now, go back to the form design window and double click the Add this info button. You should now have a blank cmdAddEntry_Click() subroutine. The code is pretty much identical to the old database example, but here's what to fill in, anyways:

Private Sub cmdAddEntry_Click()
    ' add a new entry to our table.
    With DataEnvironment1.rsDataTable
        .AddNew
        !ArtistName = txtArtistName
        !AlbumTitle = txtAlbumTitle
        !Tracks = txtTrackCount
        .Update
    End With
    
    ' requery the db and re-bind the data source to the data grid
    DataEnvironment1.rsDataTable.Requery
    Set DataGrid1.DataSource = DataEnvironment1
    Call Form_Resize
    
    ' clear the text fields once the new record is added
    txtArtistName = ""
    txtAlbumTitle = ""
    txtTrackCount = ""
    
    ' set the focus back to the  artist name textbox
    txtArtistName.SetFocus
End Sub

17. Now you need the remove code. In the form design window, double-click the Remove Selected button. You should get a shell for the cmdRemoveEntry_Click() subroutine. This is the code and I'm serious, that's it:

Private Sub cmdRemoveEntry_Click()
    ' remove the currently selected item from the database
    DataEnvironment1.rsDataTable.Delete adAffectCurrent
End Sub

18. Okay, if you go to the form design window, you have three textboxes: txtArtistName, txtAlbumTitle, and txtTrackCount. Double click on each of them in turn to get their associated Change methods and fill in the following code:

Private Sub txtArtistName_Change()
    ' here, just check to see if each text field has contents.  If they all have
    ' contents (ie, they're not empty) enable the "Add Entry" button.
    If txtArtistName.Text <> "" And txtAlbumTitle.Text <> "" And txtTrackCount.Text <> "" Then
        cmdAddEntry.Enabled = True
    Else
        cmdAddEntry.Enabled = False
    End If
End Sub

Private Sub txtAlbumTitle_Change()
    ' just call the artist name change method because the code here would be
    ' exactly the same.
    Call txtArtistName_Change
End Sub

Private Sub txtTrackCount_Change()
    ' just call the artist name change method because the code here would be
    ' exactly the same.
    Call txtArtistName_Change
End Sub

19. While you're still in the txtTrackCount_Change() method, go to the event ComboBox at the top of the code window and select the KeyPress event. You should get a shell for the txtTrackCount_KeyPress(KeyAscii as Integer) method. Here's the rest of the code for that, it just filters out alphabetic and punctuation characters:

Private Sub txtTrackCount_KeyPress(KeyAscii As Integer)
    ' TrackKey will store which key was pressed in an _ascii_ value.
    Dim TrackKey As String
    TrackKey = Chr(KeyAscii)
    
    ' if the key pressed was a)not a number and b) not the backspace key,
    ' just erase the keystroke (it won't get processed or sent)
    If (Not IsNumeric(TrackKey) And Not (KeyAscii = vbKeyBack)) Then
        KeyAscii = 0
    End If
End Sub

And that should be it!! Make sure you've saved your project in the same folder as you saved your Database from the above section, and you should be good to go running this thing.

back to the top