NSBasicCE Tutorial | VisualNewt Software | Serg Koren

ARTICLE 13-PRINT, REDIM, and the TEXTBOX

Wed, 11 Apr 2007 21:34:22 -0400

Programming Using NSBasicCE

ARTICLE 13-PRINT, REDIM, and the TEXTBOX

All content (c)1999 Serg Koren.
All rights reserved.

Welcome to the thirteenth installment of NSBasicCE.

This time around we discuss the PRINT and REDIM statements, and the TEXTBOX object a hodgepodge of miscellaneous commands.

If this article is a bit disjoint, please excuse me since I'm trying to figure out where I left off ;-)

Leftovers from Last Time

I asked you to modify the Colors program from last time to:
- Add a PictureBox object and draw a filled box of the given color whenever the user Adds a color to the list. (Just have one colored box in the PictureBox at any given time. Draw the last added color.)
- When the user taps a key on the keyboard. Draw the letter inside the picturebox.
- When the user taps on the colored box, display a message box showing the name of the color

' I won't reproduce the entire program (check the archives if you missed it),
'  but just give you the changes.
' Add another global array to hold actual colors instead of color names...
DIM vbColors(7) ' will be loaded with color values
DIM TheColorText ' the color to draw box

' Sub to create our PictureBox object
SUB CreateMyPictureBox
     ADDOBJECT "PictureBox","MyPictureBox",10,100,110,200
END SUB

' Sub to draw a filled box of a given color inside the picturebox
' Note that to draw a box you use the DrawLine method of the PictureBox (see manual)
SUB DrawFilledBox(WhichColor)
     MyPictureBox.Cls ' clear the old stuff out of the picture box
     MyPictureBox.DrawLine 110,110,400,400, Which, True, True       ' The last two parameters determine that a box is drawn and that it is filled
END SUB


' Subroutine to draw a character in our PictureBox
' This is how you would draw a character (or any string) in the picture box, but NOT when you tap a character on the keyboard.
SUB DrawCharacter(Which)
     MyPictureBox.Cls 'clear the old stuff in the picture box
     MyPictureBox.DrawText Which
END SUB


' Modify SETUPCOLORS to create our vbColor array
SUB SETUPCOLORS
<... leave the original code in here>
     ' Note that you have to create some colors yourself since they are not defined...see manual
     vbColors(1) = vbRed
     vbColors(2) = 256 + (128 * 256) + (64 * 65536)) ' orange RGB values
     vbColors(3) = vbYellow
     vbColors(4) = vbGreen
     vbColors(5) = vbBlue
     vbColors(6) = 128 + (0 * 256) + (128 * 65536)) ' indigo RGB values
     vbColors(7) = 128 + (0 * 256) + (255 * 65536)) ' violet RGB values
END SUB

' Modify our Add handler to read...
SUB Add_Click
     DIM TheColor ' color value to draw the box in
     ' add the selected listbox item to the end of the listbox list
     TheColorText = MyListBox.List(MyListBox.ListIndex) ' MyListBox.List() returns the text in the list
     MyListBox.AddItem TheColorText
     TheColor = vbColors(MyList.ListIndex) ' get the color values to use in drawing the box
     DrawFilledBox(TheColor)
END SUB

' Our handler when the user taps a key...
' NOTE: You have to tap the picturebox first to make it the active control before typing.
SUB MyPictureBox_KeyPress(Key)
     DrawCharacter(CHR(Key)) ' Key is a key value which must be converted to a character via the CHR function
END SUB

' Our handler to display the name of the drawn color when the user taps on the PictureBox
SUB MyPictureBox_MouseDown
     MSGBOX TheColorText ' draw the saved name of the last color drawn (even if we've erased the PictureBox)
END SUB

PRINT

The PRINT statement is mildly useful in displaying text on the main output screen and it will write on top of everything else in your program. Unfortunately, there's no way to specify where to put the text it writes. The PRINT system is a holdover from old-style BASICs. It's syntax is straight-forward. Just follow the PRINT statement with a comma sepated list of things to display:

 PRINT 1, "test", Colors(1)

You're probably better off using other controls or using the MSGBOX.

REDIM

REDIM is a useful statement when you don't know the size of an array when the program starts. It's also useful if you need to reclaim space used by an array because you're done with it and your program is running out of memory. To use it you declare a variable that you want to use as an array, but you declare it normally (not as an array).

 DIM MyFutureArray

Now lets say you've figured out that you need an array that is 200 items in size. You use the REDIM command to resize the variable...

REDIM MyFutureArray(200)

Later if you find out your actually needed 2000 you can do a:

REDIM MyFutureArray(2000)

in your program.
To free up the memory used by the array (assuming you don't need it anymore) you can use REDIM as follows:

REDIM MyFutureArray(0)

You can also do things like:

REDIM MyFutureArray(100,100)

You probably won't use REDIM often, but it's useful in your NSBasic bag of tricks.

TEXTBOX

The TEXTBOX object is used to display an editable text field on a form. Up until now we've been using INPUTBOX to get user input, but the TEXTBOX is much more natural. Creating a TEXTBOX object is identical to other objects, so we won't go over that. The TEXTBOX object has a few new properties that deal with what text is selected.
selLength is a property that returns the length in characters of the selected text.

selStart returns the position of the first selected character.
selText returns the actual selected text.

The only other new property you have to worry about is MutliLine which is a Boolean (TRUE or FALSE). If it's set to TRUE, the TEXTBOX will allow the user to enter carriage returns and multiple lines of text. Otherwise, the TEXTBOX will only allow a single line of text.

That's it for this time around. Next time we'll go over TIME, Time, TIMEVALUE and TIMESERIAL In other words, we'll deal with statements, functions, and objects dealing with time.

For next time

Something simple! Write a program with a TEXTBOX and CommandButton. When tapped the button should display the selected text, and its length.

Cheers!

ARTICLE 12--FOR EACH, INSTR, AND THE PICTUREBOX OBJECT

Wed, 11 Apr 2007 21:33:33 -0400

Programming Using NSBasicCE

ARTICLE 12--FOR EACH, INSTR, AND THE PICTUREBOX OBJECT

All content (c)1999 Serg Koren.
All rights reserved.

Welcome to the "dozenth" installment of NSBasicCE.
This time around we discuss the "EACH" version of the FOR NEXT loop, the PRINT statement and the PictureBox object.

Leftovers from Last Time

Last time around we talked about getting loops and asked you to modify the answer to the last problem to use loops. Here is the code from last time that you had to start with:

'-------------code starts here

' Article 10

OPTION EXPLICIT

DIM Colors(7)

' our color array

'-------------- create our UI

' create a listbox

SUB CreateMyListbox

ADDOBJECT "ListBox","MyListBox",120,10,100,120 ' leave room for label

' load the colors into the listbox...assumes you've set up the array first

MyListBox.AddItem Colors(1)

MyListBox.AddItem Colors(2)

MyListBox.AddItem Colors(3)

MyListBox.AddItem Colors(4)

MyListBox.AddItem Colors(5)

MyListBox.AddItem Colors(6)

MyListBox.AddItem Colors(7)

END SUB

' create a label

SUB CreateMyLabel

ADDOBJECT "Label","MyLabel",35,5,80,20 ' to the right of the listbox

MyLabel.Caption = "Colors"

END SUB

' create our Remove commandbutton

SUB CreateRemoveCommandButton

ADDOBJECT "CommandButton","Remove",10,35,100,20

Remove.Caption = "Remove"

END SUB

' create our Add commandbutton

SUB CreateAddCommandButton

ADDOBJECT "CommandButton","Add",10,65,100,20

Add.Caption = "Add"

END SUB

' create FindMissing commandbutton

SUB CreateFindMissingCommandButton

ADDOBJECT "CommandButton","FindMissing",10,95,100,20

FindMissing.Caption = "Find Missing"

END SUB

' create FindDuplicates commandbutton

SUB CreateFindDuplicatesCommandButton

ADDOBJECT "CommandButton","FindDuplicates",10,125,100,20

FindDuplicates.Caption = "Find Duplicates"

END SUB

'----------------event handlers

' Our Remove handler

SUB Remove_click

' remove the selected listbox item

MyListBox.RemoveItem MyListBox.ListIndex

' MyListBox.ListIndex returns the number (array index) of the selected item

END SUB

' Our Add handler

SUB Add_click

' add the selected listbox item to the end of the listbox list

MyListBox.AddItem MyListBox.List(MyListBox.ListIndex)

' MyListBox.List( ) returns the text in the list

END SUB

' Find missing event handler

SUB FindMissing_click

' you probably got stuck trying to figure out how to do this... don't worry this was a trick problem.

END SUB

' Find duplicates event handler

SUB FindDuplicates_click

' you probably got stuck trying to figure out how to do this... don't worry this was a trick problem.

END SUB

'----------------main routines here

' set up our color array

SUB SETUPCOLORS

Colors(1) = "Red"

Colors(2) = "Orange"

Colors(3) = "Yellow"

Colors(4) = "Green"

Colors(5) = "Blue"

Colors(6) = "Indigo"

Colors(7) = "Violet"

END SUB

' set up our user interface

SUB SETUPUI

CreateMyListBox

CreateRemoveCommandButton

CreateAddCommandButton

CreateFindMissingCommandButton

CreateFindDuplicatesCommandButton

END SUB

SUB INITIALIZE

SETUPCOLORS ' this has to be done first because its used by CreateMyListBox

SETUPUI

END SUB

SUB MAIN

INITIALIZE

END SUB

MAIN ' our normal kickstart

'-------------code ends here

A hint that you need a loop are sequences of lines that are identical apart from the index into an array. In this example there are two subroutines that are ripe for loops: CreateMyListBox and SETUPCOLORS.
For CreateMyListBox replace the existing one with:

     ' create a listbox
     SUB CreateMyListbox

       DIM I ' our index for our FOR loop
       ADDOBJECT "ListBox","MyListBox",120,10,100,120 ' leave        room for label
       ' load the colors into the listbox...assumes you've set up the array first
       FOR I = 1 TO 7 ' loop through all of our colors
       MyListBox.AddItem Colors(I) ' add a row with the proper color
       NEXT I

     END SUB

SETUPCOLORS is harder to figure out. That is because we need to figure out how to get the hardcoded colors into an indexable list. But it seems by hardcoding it we already have, so do we need to put it into a loop?
No, not really. The existing code is good enough for most purposes. Personally, (a style thing) I still don't like the fact that the colors are actually hidden somewhere in the code, which makes it harder to find if say we want to add a color "Gray" for instance.
What I would do is extract the actual colors into a global string:

     DIM MasterColors
     DIM MaxColors
     MaxColors = 7 'number of colors
     MasterColors = "Red,Orange,Yellow,Green,Blue,Indigo,Violet," ' note the comma at the end...we need this

and then in the SETUPCOLORS subroutine I'd pull the appropriate substring out and assign it to the array. But to do this we need to know about another string function. We talked earlier about LEFT, RIGHT, and MID, now we need to learn about something called:

INSTR and INSTRREV

INSTR and INSTRREV are often used in combination with LEFT, RIGHT, and MID. INSTR lets you find where a certain substring starts, starting from the left end, INSTRREV does the same, but starts from the right end of the string (last character). How do they find a substring?
If you refer to the manual you see, that INSTR and INSTRREV are functions that are called using:
INSTR([start],<main string>,<delimiter)
[start] is an optional chaaracter position where to start searcing (say start at character 3). <main string> is the string we are searching through (in our case MasterColors), and <delimiter> is a string that we are looking for.
For example, the following code:

     DIM A
     DIM I
     A = "ABCDEFABCDEF"
     I = INSTR(A,"B") ' assume [start] is 0, find B
     MSGBOX I
     I = INSTR(I+1,"B") ' find the next occurance of B
     MSGBOX I

would return 2, and 8 In our assignment, MasterColors has colors separated by commas, so "," would be a natural delimiter. So to find the end of a string we search for a comma. That's why we need the comma at the end in MasterColors, it makes finding the last element easier. How do we find the start of the next string? It's the location of the last comma plus one.
So our code becomes:

SUB SETUPCOLORS
     DIM I ' Index into our array and FOR loop
     DIM J ' Index into our MasterColors string
     DIM J1 ' last occurance of a comma
     DIM TempColor ' a string that holds an actual color once we parse it from MasterColors
     J = 0 ' Initialize our index
     J1 = 0
     FOR I = 1 TO MaxColors ' process each color
     	J = INSTR(J1 + 1,MasterColors,",") ' find the next occurance of the , separator
    	 	Temp = MID(MasterColors,,J,J1 - J) ' extract the actual color between commas (starting at J and for length J1 -J)
    	 	Colors(I) = Temp ' assign the actual color to our array now.
     NEXT
END SUB

It looks more complicated than the original (and it is), but if you need to add more colors (or subtract colors) all you have to do is change the value of MaxColors and our MasterColors string, and everything continues to work properly!
The lines:

     J = INSTR(J1 + 1,x,",")
     Temp = MID(x,,J,J1 - J)
     y(I) = Temp

are what are known as a "pattern" in computer jargon. A "pattern" is merely a programming idiom (like an English idiom...if you don't know what "idiom" means, look it up.) or a way of programming a common task. Something you'll do again and again. And what this tells me (and should you at this point) is that it belongs in its own subroutine or function...I'll leave writing this function as an exercise for you to solve. I have one that I use all the time to parse a string delimited by commas. It's a very useful routine, and you should have one in your own bag of tricks!
On to our next topic:

FOR EACH..NEXT

The FOR EACH statement is a very useful way of going through an array and doing something for each (hence the name) element in the array. It's syntax is easy:

     FOR EACH  IN 
     ....do stuff
     NEXT

      is the item at a given index into the array. Usually you give it a more descriptive name than I, or J (which is typical for a normal FOR      NEXT).  is the array you want to do things to. For example lets      say you want to have an array of 100 numbers where the value of the element      is the index value. That is, element 33 has the number 33 in it, the element      56 has 56, etc.
     DIM NumberArray(100) ' our array
     DIM I ' a number
     I = 0
     FOR EACH Number IN NumberArray ' Number automatically becomes the element at a given index.
    	 	Number = I
     	I = I + 1
     NEXT
     Yes:
     FOR I = 0 TO 100
     	NumberArray(I) = I
     NEXT

is better, I just made up the example to show you the differences. The FOR EACH doesn't require you to DIM the index., the normal FOR does. The FOR EACH is a bit more readable (understandable) than the normal FOR. Here's another example. The FOR EACH doesn't use a subscribe (index) into the array to get an element, the FOR does. Let's print out our Colors array from the code above:

     FOR EACH Color in Colors
          PRINT Color
     NEXT

is a lot easier to program and understand than:

     FOR I = 1 TO MaxColors
          PRINT Colors(I)
     NEXT

That's the FOR EACH loop. Once you get used to using it you'll like it. Now to our object of the day.

PICTUREBOX

A PictureBox is one of the most complex objects you'll deal with. It's complexity lies in the different properties, events, and methods it allows you to manipulate. At its core, a PictureBox allows you to draw text and graphics in a contained area on the screen.
You already know how to create one:

     ADDOBJECT "PictureBox","MyPictureBox,"10,10,200,200

I suggest first reading the manual to get a feel for the different things you can do with a PictureBox. Then try to write a program that uses them. Here's a quick run through of the things a PictureBox has:

Properties:
• BorderStyle - 0, blends with the window, 1, has a border.
• DrawWidth - a number specifying how thick lines will draw.
• FillColor - enclosed polygons (circles, rectangles, etc. can be drawn with a single command) can be filled with a color
• FillStyle - 0 solid, 1 transparent
• FontTransparent - True/False (no I don't know why this isn't 0,1)
• Picture - you can pass in the name of a graphics file (it has to be a *.bmp) and the picture will automatically draw itself into your picturebox.
• Scaleheight/Width - you can specify how things get scaled in the picturebox
• ScaleLeft/Top - left and top edges of the object
• ScaleMode - this is a MS thingy. Most of the time you want to set this to 3 (pixels) otherwise you'll wonder why things don't draw the way you expect. For more info, find some MS documentation online.

Methods:
• Cls - Erases the picturebox contents
• DrawCircle - Draws a circle, or ellipse. You can specify the radius, color, etc.
• DrawLine - This lets you specify a line or set of lines. You can also set a flag to specify you want to draw a box (rectangle or square).
• DrawPicture - lets you draw and manipulate a bitmap image file (*.bmp)
• DrawPoint - just what it says. Turn on a single pixel.
• DrawText - pretty useless since it doesn't let you specify WHERE in the box you want to draw the text. Might be useful for debugging.
• Refresh - redraw the contents of the PictureBox (if something needs to be redone because something covered the PictureBox say.)
• ScaleX, ScaleY,SetScale - lets you convert scale values
• TextHeight, TextWidth - Returns the height and width of the heighest or widest lines of text. Used with DrawText.
Events:
• KeyDown - key is pressed
• KeyUp - key is released
• KeyPress - KeyDown followed by KeyUp
• MouseDown, MouseUp - mouse clicks
• MouseMove - MouseDown and then you move the mouse (like a drag).

Yes the number of Properties, Methods, and Events is large, but taken individually, they aren't too confusing. The best way to learn about the PictureBox is to use it. So...

For next time

Using the Colors program,
- Add a PictureBox object and draw a filled box of the given color whenever the user Adds a color to the list. (Just have one colored box in the PictureBox at any given time. Draw the last added color.)
- When the user taps a key on the keyboard. Draw the letter inside the picturebox.
- When the user taps on the colored box, display a message with the name of the color being tapped.

We'll also go over the PRINT statement, the REDIM statement, and the TextBox object!

Cheers!

ARTICLE 11-DEJA-VU AGAIN

Wed, 11 Apr 2007 21:32:17 -0400

Programming Using NSBasicCE

ARTICLE 11-DEJA-VU AGAIN

All content (c)1999 Serg Koren.
All rights reserved.

Welcome to the eleventh installment of NSBasicCE.
This time around we talk about getting your programs to repeat commands, and we talk about our widget, the option button.

Leftovers from Last Time

Last time around we talked about getting your program to make decisions and I asked you to write a program,

That has:

A Listbox
A Label next to the listbox labelling it "Colors"
An array of colors: "Red", "Orange", "Yellow", "Green", "Blue", "Indigo", "Violet"
A CommandButton labelled "Remove"
A CommandButton labelled "Add"
A CommandButton labelled "Find Missing"
A CommandButton labelled "Find Duplicates"

The program should:

Load the colors into the listbox

When the user clicks on the "Remove" button , the selected color in the listbox is removed from the list.

When the user clicks on the "Add" button, the selected color is added to the end (bottom) of the listbox.

When the user clicks on the "Find Missing" button, the program should list all the missing colors in the listbox from the master set.

When the user clicks on the "Find Duplicates" button, the program should list all the colors in the listbox that occur more than once.

Here's my take on the solution:

'-------------code starts here
'
' Article 10
'
OPTION EXPLICIT
DIM Colors(7)' our color array
'-------------- create our UI
' create a listbo
SUB CreateMyListbox
ADDOBJECT "ListBox","MyListBox",120,10,100,120 ' leave room for label
' load the colors into the listbox...assumes you've set up the array first
MyListBox.AddItem Colors(1)
MyListBox.AddItem Colors(2)
MyListBox.AddItem Colors(3)
MyListBox.AddItem Colors(4)
MyListBox.AddItem Colors(5)
MyListBox.AddItem Colors(6)
MyListBox.AddItem Colors(7)
END SUB

' create a label
SUB CreateMyLabel
ADDOBJECT "Label","MyLabel",35,5,80,20 ' to the right of the listbox
MyLabel.Caption = "Colors"
END SUB

' create our Remove commandbutton
SUB CreateRemoveCommandButton
ADDOBJECT "CommandButton","Remove",10,35,100,20
Remove.Caption = "Remove"
END SUB

' create our Add commandbutton
SUB CreateAddCommandButton
ADDOBJECT "CommandButton","Add",10,65,100,20
Add.Caption = "Add"
END SUB

' create FindMissing commandbutton
SUB CreateFindMissingCommandButton
ADDOBJECT "CommandButton","FindMissing",10,95,100,20
FindMissing.Caption = "Find Missing"
END SUB

' create FindDuplicates commandbutton
SUB CreateFindDuplicatesCommandButton
ADDOBJECT "CommandButton","FindDuplicates",10,125,100,20
FindDuplicates.Caption = "Find Duplicates"
END SUB

'----------------event handlers
' Our Remove handler
SUB Remove_click
' remove the selected listbox item
MyListBox.RemoveItem MyListBox.ListIndex
' MyListBox.ListIndex returns the number (array index) of the selected item
END SUB

' Our Add handler
SUB Add_click
' add the selected listbox item to the end of the listbox list
MyListBox.AddItem MyListBox.List(MyListBox.ListIndex)
' MyListBox.List( ) returns the text in the list
END SUB

' Find missing event handler
SUB FindMissing_click
' you probably got stuck trying to figure out how to do this... don't worry this was a trick problem.
END SUB

' Find duplicates event handler
SUB FindDuplicates_click
' you probably got stuck trying to figure out how to do this... don't worry this was a trick problem.
END SUB

'----------------main routines here
' set up our color array
SUB SETUPCOLORS
Colors(1) = "Red"
Colors(2) = "Orange"
Colors(3) = "Yellow"
Colors(4) = "Green"
Colors(5) = "Blue"
Colors(6) = "Indigo"
Colors(7) = "Violet"
END SUB

' set up our user interface
SUB SETUPUI
CreateMyListBox
CreateRemoveCommandButton
CreateAddCommandButton
CreateFindMissingCommandButton
CreateFindDuplicatesCommandButton
END SUB

SUB INITIALIZE
SETUPCOLORS ' this has to be done first because its used by CreateMyListBox
SETUPUI
END SUB

SUB MAIN
INITIALIZE
END SUB

MAIN ' our normal kickstart
'-------------code ends here

Ok! I've left a couple of handlers empty because I think you would have a hard time completing this exercise without having the benefit of this lesson. Also, you'll notice that SETUPCOLORS and CreateMyListBox have code that's repetitive. You load a bunch of stuff into an array or list. Wouldn't it be nice to be able to simplify this? Well we can, and we do so using...
LOOPS
Your programs can not only make decisions, but they can do certain things over and over again--sort of like deja vu. There are three basic types of loops that you'll have to learn. One type is a "determinate" type. This just means you always know how many times to repeat the loop. In NSBasic, this loop is programmed using the FOR/NEXT statement. (There is also a nifty other FOR EACH/NEXT command we'll go over next time.)

The syntax for a FOR/NEXT command is:

FOR counter = start TO end [STEP increment]
...your stuff....
NEXT [counter]
The loop is bracketed by the FOR and NEXT statements. And where "counter" is a variable that keeps track of how many time you are about to go thru the loop. "start" is the first value of "counter" when the loop starts. The loop ends when "counter" executes the "end"th iteration of the loop. Each time through the loop, "counter" is incremented (or decremented) by "increment". Yup this seems confusing without an example. Here is a simple one:

FOR I = 1 TO 3
MSGBOX I
NEXT I

This loop will show the MSGBOX 3 times (start = 1 end = 3) and each time in the loop MSGBOX will show you the value of "counter". Now how about counting from 1 to 10 but only displaying the odd numbers? Easy:

FOR I = 1 TO 10 STEP 2
MSGBOX I
NEXT
Each time through the loop, the "counter" value of I will get 2 (the "increment") added to it, so the loop only executes 5 times instead of 10, and only with the odd values from 1 to 10! Cool! Also, note that we didn't specify the "counter" in the NEXT statment. NEXT instead of NEXT I. Either is fine, but explicitly stating it is better style (documentation again). Now how about counting downward by 2s?

FOR I = 10 TO 1 STEP - 2
MSGBOX I
NEXT I

Always remember that "start" is always where you start, whether you go up or down. Now you can also next loops (have one inside another. Try this:

FOR I = 1 TO 3
FOR J = 1 TO 3
MSGBOX "I=" & I & " J=" & J
NEXT J
NEXT I

That's all there is really to FOR statements, but they are powrerful when you know "start" and "end". But what happens when you don't know? A good example is our last assignment.

We don't know how many colors the user deleted or how many duplicates exist. In that case, we use something known as an "indeterminate" loop. NSBasic has two types of indeterminate loops; the WHILE/WEND and the DO/LOOP.

The two loops are very similar, but they have two important differences. The DO/LOOP always executes at least once, whereas the WHILE/WEND may not execute at all. This is due to the other difference. The DO/LOOP executes at least once because the check for whether the loop should loop is done at the end of the loop,

whereas the WHILE/WEND check is done at the beginning of the loop.

The syntax of a DO/LOOP is:

DO
...your stuff inside the loop
LOOP [WHILE|UNTIL condition]
and the WHILE/WEND WHILE condition
...your stuff inside the loop
WEND

Let's take the example of counting from 1 to 10 again, but this time lets use indeterminate loops.
I = 1
DO
MSGBOX I
I = I + 1
LOOP UNTIL I = 10
Note that you have to handle the "counter" and the incrementing of the counter. It doesn't happen like in the FOR/NEXT because NSBASIC doesn't know the start or end points. In our assignment we could do something like:
I = 1
DO
Colors(I) = ...
I = I + 1
LOOP UNTIL I = 7

We could also write this using the other variation of the DO/LOOP:
I =1
DO
Colors(I) = ...
I = I + 1
LOOP WHILE I < 8

Which one you use is really up to you, you can accomplish tasks either way. Now the same thing using the WHILE/WEND: I = 1

WHILE I <= 7
Colors(I) = ...
I = I + 1
WEND

Now I mentioned that DO/LOOPS always execute at least once and WHILE/WENDs may note even execute. Here is an example:

I = 2
DO
MSGBOX I
I = I + 1
LOOP UNTIL I = 3
I = 1

WHILE I = 3
MSGBOX I
I = I + 1
WEND

True, this is a forced example, but it shows the point! Option Buttons Now for our widget of the day! The option button is like a checkbox. It lets us toggle a value on and off, but unlike a checkbox, an option button usually occurs in groups, and only one option button can be on at a time. That is, turning one on, turns the others off.

There is nothing new about an OptionButton. You already know all the methods, events, properties, and how to create one! The only problem we have to deal with is the exclusive nature of the button. If you create two buttons:

ADDOBJECT "OptionButton","B1",10,10,100,20
ADDOBJECT "OptionButton","B2",10,30,100,20
ADDOBJECT "OptionButton","B3",10,50,100,20
B1.Caption = "B1"
B2.Caption = "B2"

B3.Caption = "B3"

and run it, you'll see that there is nothing inherently exclusive about the buttons! You can toggle them both on! This is a shortcoming in NSBasic, since VisualBasic and other environments handle the exclusivitiy automatically. So what do we do? We have to write our own code to handle option buttons. This is how:

SUB B1_Click
' we know that B1 is now on, so we turn the others off...
B2.Value = FALSE
B3.Value = FALSE
END SUB

SUB B2_Click
B1.Value = FALSE
B3.Value = FALSE
END SUB

SUB B3_Click
B1.Value = FALSE
B2.Value = FALSE
END SUB

That's it for option buttons really.

For next time

For next time, rewrite the colors exercise to use loops to initialize the colors and the listbox. Next time we'll go over the FOR EACH/NEXT statement and the PictureBox widget! Stay tuned! Cheers!

ARTICLE 10-DECISION, THE LABEL AND LISTBOX

Wed, 11 Apr 2007 21:31:38 -0400

Programming Using NSBasicCE

ARTICLE 10-DECISION, THE LABEL AND LISTBOX

All content (c)1999 Serg Koren.
All rights reserved.

Welcome to the 10th installment of NSBasicCE. This time around we talk about getting your programs to make decisions, and we talk about two widgets: the label, and the listbox.

Leftovers from Last Time

Last time around we talked about arrays and how they simplify coding. I also asked you to write a simple program that uses arrays.

The program should have:

3 CommandButtons labeled "A","B", and "C"
A CommandButton labeled "Do it!"

The program should:

Tally the numbers of times each of the three CommandButtons has been tapped. (Hint: This is what the array is for).
Prompt the user for his name when he taps the "Do it!" button, and then display a message in the format: " Hi <name here>, you've tapped button A x times, B y times, and button C z times."

Here's my code.

       '-------------------code starts here
       ' Assignment number 9
       '
       OPTION EXPLICIT
       DIM TapCount(3) ' we won't use element 0 for anything. Used to store the count of taps for a given button.
       DIM AButton, BButton, CButton ' used to index into TapCount array

       '--------------------create our objects
       ' Create our Command buttons
       SUB CreateMyCommandButtonA
      	  ADDOBJECT "CommandButton","A",10,10,100,30
      	  A.Caption = "A"
       END SUB

       SUB CreateMyCommandButtonB
      	  ADDOBJECT "CommandButton","B",10,50,100,30
      	  B.Caption = "B"
       END SUB

       SUB CreateMyCommandButtonC
      	  ADDOBJECT "CommandButton","C",10,90,100,30
      	  C.Caption = "C"
       END SUB

       ' Create our DoIt button
       SUB CreateMyCommandButtonDoIt
          ADDOBJECT "CommandButton","DoIt",10,130,100,30
       	  DoIt.Caption = "Do It!"
       END SUB

       '----------------- our event handlers
       SUB A_click
      	  TapCount(AButton) = TapCount(AButton) + 1
       END SUB

       SUB B_Click
      	  TapCount(BButton) = TapCount(BButton) + 1
       END SUB

       SUB C_Click
      	  TapCount(CButton) = TapCount(CButton) + 1
       END SUB

       SUB DoIt_Click
      	  DIM MyName ' this is local because it's not used anywhere else!
      	  MyName = INPUTBOX("Please enter your name",vbOKOnly,"PROMPT") ' ask user for name
      	 ' now display the message: "Hi , you've tapped button A x times, B y times, and button C z times."
      	 MSGBOX "Hi " & MyName & ", you've tapped button A" & TapCount(AButton) & " times, B " & TapCount(BButton) & ",times and button C" & TapCount(CButton) & " time."
       END SUB

       '----------------------------------Setup routines
       SUB SetupUI
      	  CreateMyCommandButtonA
      	  CreateMyCommandButtonB
      	  CreateMyCommandButtonC
      	  CreateMyCommandButtonDoIt
       END SUB

       ' Initialize global variables
       SUB Iniaialization
      	  AButton = 1 ' point to first element of TapCount array for button A
      	  BButton = 2 ' point to second element of TapCount array for button B
      	  CButton = 3 ' point to third element of TapCount array for button C
      	  TapCount(AButton) = 0 ' set count to 0 for first element
       	  TapCount(BButton) = 0 ' ...and so on
      	  TapCount(CButton) = 0
       END SUB

       ' Our main routine
       SUB Main
       	  Initialization
      	  SetupUI
       END SUB

       Main ' our IMMEDIATE command to start everything
       '--------------------code ends here

Not too bad! Now look at our Initialization routine in the above code. Seems like there should be an easier way of doing this....and there is! We'll talk about how later in this article, but first, we'll get your programs to make some decisions on their own!

IF THEN...ELSEIF....END IF (DECISIONS)

So far we've just dealt with programs that execute line by line by line by line...top to bottom. Now we'll talk a bit about altering the execution flow. That is, how to get your program to skip some code and execute other code. To do this, your program has to decide somehow that it should execute some portions of code while avoiding others. NSBasic has one statement that allows this: The IF/END IF statemennt. If you look in the manual under IF...THEN...ELSE you can see the hoary details. I'll break it down to simplify it and work up. In it's simplest form, the IF/END IF statement looks like:

      IF  THEN
         ....execute this code here, if  is TRUE
      END IF

This variation, just lets your program decide <something> and if the result is TRUE your program will execute everything between the IF...THEN and END IF statements. What happens if <something> is FALSE? NSBasic ignores everything betweent he IF...THEN and END IF statements and starts executing at the line after the END IF. Let's take at a more concret example.

   DIM TonsOfConcrete
   TonsOfConcrete = 3
   IF TonsOfConcrete < 5 THEN
      MSGBOX "You don't have enough concrete!"
   END IF 

   TonsOfConcrete = TonsOfConcrete + 3 ' buy more concrete
   IF TonsOfConcrete < 5 THEN
      MSGBOX "You still don't have enough concrete"
   END IF

In this example, the first IF statement returns TRUE (TonsOfConcrete IS less than 5), so you see the first MSGBOX. Once you add 3 to TonsOfConcrete the second IF statement returns FALSE (TonOfConcrete is now 6 which is not less than 5 (FALSE)), so you don't see the second MSGBOX. One thing to note here is that <something> returns a value. So you can use a FUNCTION there...



     IF INPUTBOX("Enter a number 1..10") < 5 THEN
        MSGBOX "Less than 5!"
     END IF

That's fairly easy to understand if you're following everything we've done so far! Ok now what happens if you want to display one message if the number entered is less than 5 and another if its greater than or equal to 5? Well you could do:

      Num = INPUTBOX("Enter a number 1..10") 

      IF Num < 5 THEN
          MSGBOX "Less than 5!"
      END IF

      IF Num >= 5 THEN
          MSGBOX "Greater than equal 5!"
      END IF

This is fine unless someone goes in and adds the line "Num = 3" between the first END IF and the next IF! NSBasic has a form that lets you execute one set of code under one condition and another if the condition is false...

	IF  THEN
	   < do this>
 	ELSE
	   < do this if  is false
 	END IF

Let's get concrete again..

 	IF TonsOfConcrete >= 5 THEN
	   MSGBOX "Lots of concrete!"
 	ELSE
     	   MSGBOX "Warning, you have less than 5 tons of concrete!"
 	END IF

And what if we want a special message for 2 tons? Well we use the form:

 	IF  THEN
	   < do stuff here>
	ELSEIF  THEN
	   < do other stuff here>
  	ELSE
           < do something different if none of the above is true>
  	END IF
	IF TonsOfConcrete = 2 THEN
      	   MSGBOX "2!"
        ELSEIF TonsOfConcrete < 5 THEN
       	   MSGBOX "Buy more!"
        ELSE
       	   MSGBOX "Enough!"
        END IF

And you can have as many ELSEIF...THEN statements in your IF statement as you need! One thing you should be careful of is that the order of the tests is important. The first one that evaulates to true gets done! The others are ignored. For example compare what happens with the prior IF and this one...

	IF TonsOfConcrete < 5 THEN
       	   MSGBOX "Buy more!"
        ELSEIF TonsOfConcrete = 2 THEN
           MSGBOX "2!"
        ELSE
           MSGBOX "Enough!"
        END IF

If you can understand what happens and why, you have IF/END IF statements down! Think about it.
Time to look at our UI widgets for this week..we handle two!

LABEL

The label widget places a line of text on your program's main window. You already know how to create a label, and what most of the Properties, Events and Methods do. You should still check out Label in the manual. There really isn't much new with this widget apart from the Alignment property. The alignment property lets you specify whether the text in the label lines up on the left, the right or in the center of the label. You use a number to determine alignment: 0 = left, 1 = right, 2 = center. For example:

      ADDOBJECT "Label","MyLabel",10,10,100,30
      MyLabel.Caption = "Hi!"
      MyLabel.Alignment = 2 ' center

Again, if your label isn't wide enough, the Alignment property won't have any visible effect.

And now onto something slightly similar...

LISTBOX

The Listbox is very similar to the ComboBox. Both present you with a list and let the user choose one of the items in the list. When would you use a ListBox, and when a ComboBox? Typically, I choose a ComboBox when the user needs to type a new item into the list (add an item to the list). I use a ListBox whenever the list items are fixed and the list items have to be visible (A ComboBox's list items are only visible when the user taps on the ComboBox to drop the list down.) Other than that the two serve identical purposes. Because of that the ListBox has similar Properties, Methods, and Events. The exceptions being, that there is no DropDown event in a ListBox. A ListBox also has a Property called ScrollBars. This is because a ListBox can have more items than will fit in the displayed size of the box. The manual implies you can have horizontal, vertical or both types of scrollbars. Actually, only vertical (2), is supported. Just like a ComboBox, you can add, remove items in the list, as well as clearing the entire ListBox. Play with the ListBox's scrollbar propery! But be aware, that you have to set the ScrollBars property immediately after you create the listbox.

      ADDOBECT "ListBox","MyListBox",10,10,100,100
      MyListBox.ScrollBars = 2 ' vertical
      MyListBox.AddItem "AAAAAAAAAAAAAAAA"
      MyListBox.AddItem "AAAAAAAAAAAAAAAA"
      MyListBox.AddItem "AAAAAAAAAAAAAAAA"
      MyListBox.AddItem "AAAAAAAAAAAAAAAA"
      MyListBox.AddItem "AAAAAAAAAAAAAAAA"
      MyListBox.AddItem "AAAAAAAAAAAAAAAA"
      MyListBox.AddItem "AAAAAAAAAAAAAAAA"
      MyListBox.AddItem "AAAAAAAAAAAAAAAA"
      MyListBox.AddItem "AAAAAAAAAAAAAAAA"

Nothing too complicated there, apart from having to set the Scrollbars property right after the ADDOBJECT statement. (This is indicated by a + sign in the manual on the page dealing with Properties).

For Next Time

The assignment for this time will test everything we've gone over so far. Write a program,

That has:

A Listbox
A Label next to the listbox labelling it "Colors"
An array of colors: "Red", "Orange", "Yellow", "Green", "Blue", "Indigo", "Violet"
A CommandButton labelled "Remove"
A CommandButton labelled "Add"
A CommandButton labelled "Find Missing"
A CommandButton labelled "Find Duplicates"

The program should:

Load the colors into the listbox
When the user clicks on the "Remove" button , the selected color in the listbox is removed from the list.
When the user clicks on the "Add" button, the selected color is added to the end (bottom) of the listbox.
When the user clicks on the "Find Missing" button, the program should list all the missing colors in the listbox from the master set.
When the user clicks on the "Find Duplicates" button, the program should list all the colors in the listbox that occur more than once.

Next time we'll go over getting your program to do things more than once (loops) as well as the OptionButton and PictureBox objects!
If you get stuck or have a question about anything we've gone over, feel free to e-mail me at Serg@VisualNewt.com

Cheers!

ARTICLE 9 -- ARRAYED THINGS AND INPUTBOX

Wed, 11 Apr 2007 21:30:48 -0400

Programming Using NSBasicCE

ARTICLE 9 -- ARRAYED THINGS AND INPUTBOX

All content (c)1999 Serg Koren.
All rights reserved.

Welcome to the ninth installment of NSBasicCE.
Here we discuss arrays, and the INPUTBOX widget.

Leftovers from Last Time

In our last article we discussed how to take a string and extract substrings from it. I then asked you to write a simple app that has:

a date object
a command button

It should:

Save the date the user taps on in a variable called TheDate
Display the message: "This is the i-th day of the j-th month." whenever the user taps the command button.

Note that i and j above are numbers you can get from TheDate.
Here is my solution:

       '--------begin code here--------------
       '
       ' Aricle 8 exercize
       '
       '
       '---------- Create our objects routines
       OPTION EXPLICIT ' force DIMensions
       DIM FullDate ' global variable to store the date string returned by Date        object
       DIM Day ' the part of the date string containing the Day (i-th day)
       DIM Month ' the part of the date string containing the Month (j-th month)

       ' Create a date object
       SUB CreateMyDateObject
       	  ADDOBJECT "Date","MyDateObject",10,10,100,30
       END SUB

       ' Create our command button
       SUB CreateMyCommandButton
       	  ADDOBJECT "CommandButton","MyCommandButton",10,50,100,30
       END SUB

       '----------- Set up our event handlers
       ' Date object event handler
       SUB MyDateObject_Change
          FullDate = MyDateObject.Text ' get the selected date and store it in our variable
       END SUB

       ' CommandButton event handler
       SUB MyCommandButton_click
         Day = MID(FullDate,4,2) ' extract the dd portion of mm/dd/yyyy
       	 Month = LEFT(FullDate,2) ' extract the mm portion of mm/dd/yyyy
       	 MSGBOX "This is the " & Day & "th day of the "        & Month & "th month."
       END SUB

       '------------- Our setup routines
       SUB SetupUI
       	  CreateMyDateObject
       	  CreateMyCommandButton
       END SUB

       SUB Main
       	  SetupUI
       END SUB

       Main ' our IMMEDIATE command to get things running
       '--------- end code here

That's basically it. However, you'll notice that if you choose the 1st day or month, your message is grammatically incorrect! You don't know enough at this point to fix it, but you will next time!

ARRAYS

Simply put, arrays are collections of things. In programming, arrays are  a powerful tool that lets you simplify your code by grouping collections of variables together under one name. An example would be the best way to understand this. For instance, assume you have to program a game having ten boxes and you need to put something into the third. You could set up variables for each box thusly:

DIM Box1
DIM Box2
DIM Box3
       ...
DIM Box10
Box3 = Something

This would work fine, but it's a lot of typing isn't it? Wouldn't it be simpler saying "here is a bunch of boxes, and I want the 3rd one."? In NSBasic you can do this by creating an array of variables and giving them a single name. In this example lets call our collection of boxes "Box". We specify the maximum number of things (boxes) in our collection by putting the number inside parentheses after the name in our DIMension statement! So if we want to have 10 boxes we would have a DIM statement:

DIM Box(10)

Now if you're just getting into programming and have been following these articles you may be thinking..."doesn't the parentheses mean that this is a function?" Well not in this case. You don't have the FUNCTION keyword. But actually in some languages (Smalltalk, etc.) This indeed would be a function-like object. But in NSBasic, this is just how you specify an array of variables. Ok, so back to our example...how do we put stuff into our third box?

 Box(3) = Something

Easy! So how do we see what is in the third box instead? Just as you would expect...

X = Box(3)

And likewise you can do things like...

Box(3) = Box(3) * 2

...which would multiply the value in array element 3 by 2. No, the number isn't 6. It depends on what is stored in Box(3). If we did:

Box(3) = 12
Box(3) = Box(3) * 2

...then Box(3) = 24! Can we do...

Box = Box(3) + 2

...no! You can't do something to the entire array. You have to specify which element in the array you want to operate on (again this is a limitation  of NSBasic, since other languages allow you to operate on the array as a whole).

So far we've been assuming arrays hold numbers, but arrays can hold any data type!

Box(4) = "Hello"
Box(5) = "There"
Box(6) = 12 * 2

MSGBOX Box(4) & Box(5) & " array element 6 has " & Box(6) & " in it."

You can't however put objects into arrays!

Box(7) = MyDateObject ' a Date object you create elsewhere

will give you a runtime error (an error that you get when you run the program) of "Object doesn't support this property or method." However, there are ways of creating arrays of objects (which we'll talk about in a future article.)

A couple of important things to note about arrays. The first element in the array is actually element 0! That means that in our box example our boxes are numbered 0 through 10, an d not 1 through 10! So what happens when we try:

Box(11) = 1

Try it!

Can we get the 3rd through the 5th box in our array? No, again you need to deal with each element in an array singly.

Arrays are very straightforward once you get past knowing how to DIM and reference (use) them. However, we've only been discussing one-dimensional arrays. That is arrays of things we can line up in a single line. But lets say you need to program a Bingo game board for your Auntie Ethel who is addicted to bingo! A bingo board consists of a two-dimensional array (a grid) Or a spreadsheet? In this case we use a two-dimensional array set up by a DIM statement that specifies the maximum number of elements in each axis (vertically and horizontally). So if we are building a mini-spreadsheet that has 10 rows and 30 columns we would use the DIMension statement:

DIM Sheet(10,30)

DIM Sheet(30,10)

Huh??? Well programming languages don't know anything about the concepts of "vertical" and "horizontal", so the order in which you declare them in the DIM statement is totally arbitrary. By convention, however we tend to think of row-column instead of column-row, so the first is more accepted. However, you can use the second and it will work fine, but you personally as the programmer have to remember which is the row and which is the column. So it's a good idea to put in a comment to remind you...

DIM Sheet (30,10) ' column, row
     

or better yet....


DIM MaxRow

DIM MaxColumn

MaxRow = 10

MaxColumn = 30

DIM Sheet (MaxColumn,MaxRow)

We explained before why this version is better programming style, although the single DIM statement is faster to type.

Also, note that in the above example we didn't DIM Sheet(29,9) (because of the 0th element in each dimension). This wastes a bit of space, but usually isn't critical, and it simplifies our programs so that we don't have to subtract one each time. You may be scratching your head here again...say we want to load cell 5,3 with a 2 if we had DIMmed the array as

DIM Sheet(29,9) ' because our sheet starts at Sheet(0,0) and not Sheet(1,1)
Sheet(4,2) = 2 ' would actually be cell (5,3) because our array starts at Sheet(0,0) and goes to (29,9)

but because we dimensioned

DIM Sheet(30,10) ' and not use cell (0,0) for anything
Sheet(5,3) = 2 ' is easier to deal with although it's actually (6,4), but we just ignore the (0,0) element to simplify our lives

Read that through a couple of times so you understand it. Draw it out on some graph paper too if you need to. It's not hard to understand, just a bit clumsy to explain.
That's basically it for arrays. Oh, how many dimensions can an array in NSBasic have? We've only discussed two. NSBasic arrays can have up to 60! dimensions. So you could have a DIM statement:

DIM Wow(20,340,1,40,...bunch more...,3) ' for 60 dimensions separated by commas

Don't ask why you would ever want to deal with this...

INPUTBOX

So far we've been dealing with programs that don't let the user type something in. The INPUTBOX is a widget that lets you do just that! It's similar to MSGBOX in that it displays a separate mini-window and display a message. It's different in that the window it displays also has a single text field that lets the user type something in. Refer to the manual page on INPUTBOX.

INPUTBOX (prompt[,title[,default[,xpox,ypos]]])

As you can see INPUTBOX is a function and it returns whatever string the user typed in. As you can also see from the manual, the only required parameter is the prompt. The prompt is the message to display to the user. The INPUTBOX is very easy to use. You don't have to create it or set up event handlers, you just use it.

A = INPUTBOX ("Type something please","My Input Box Title","Gee I can preload an answer",10,10)

Try that. The "default" parameter (the 3rd one), lets you set a default string in the input field to save the user some typing.

B = INPUTBOX ("What is your name?","My Name Input","enter your name here",10,10)

or it can be used to tell your user where to input stuff. (Yes I've seen this done, and I assume its for the computer-challenged among us, but I think this is bad design. Just leave it out!)
There is one really important thing you'll soon discover if you try to use INPUTBOX on a CasioE-105 and other PPC handhelds. INPUTBOX doesn't scale properly to the size of the screen. It doesn't fit! This is a Microsoft bug! To get around this problem, you can use the replacement INPUBOX routine I've written in NSBasic, and can be found at http://www.VisualNewt.com/CE/NSB/ Make sure you read the accompanying documentation, since it works a little differently from the normal INPUTBOX.

For Next Time

Write a simple program that uses arrays. The program should have:

3 CommandButtons labeled "A","B", and "C&quotl
A CommandButton labeled "Do it!"

The program should:

Tally the numbers of times each of the three CommandButtons has been tapped. (Hint: This is what the array is for).
Prompt the user for his name when he taps the "Do it!" button, and then display a message in the format:

"Hi , you've tapped button A x times, B y times, and button C z times."

That's it for this week. Next week we'll get into a very powerful programming concept. We'll discuss how your programs can make decisions and repeat things over and over and over and over and... And our widgets of the week will be the Label, and the ListBox. We're doing two because there's not a lot to the label. See you then!

If you get stuck or have a question about anything we've gone over, feel free to e-mail me at Serg@VisualNewt.com

Cheers!