Tutorial 03: Adding Two Numbers

April 18, 2008

© NS BASIC Corporation. All rights reserved.

Contributed by Tom Newman, Mission Peak Designs

Introduction

The purpose of this tutorial is to demonstrate simply adding two numbers together using NS Basic/Desktop. You should have completed Tutorial #1 before beginning this tutorial.

The program to be developed will start out adding two numbers and displaying the answer in a message box. After that we will create a program that allows the user to enter the two numbers on a form and display the answer when the Add button is clicked.

Getting Started

Start NS Basic/Desktop from the Start menu and select Formless from the project dialog box. This will open a code window.

Adding Two Numbers Using MessageBox

To demonstrate how simple it is to create a program to add two numbers together, we will enter code to add two numbers and display the answer in a MessageBox.

1. Creating the Code

First we declare three variables to hold our values:

FirstNumber, contains the first half of our math equation
SecondNumber, contains the second half of our math equation
Total, contains the answer

Next we set FirstNumber to equal 10 and SecondNumber to 7.

We then add the two number and store the result in Total.

Finally, we display the result in a MessageBox using the CStr function to convert the number into a string we can display.

Your code should look like the following:

Option Explicit
ShowOKButton True

Sub main
   Dim FirstNumber
   Dim SecondNumber
   Dim Total
   
   FirstNumber = 10
   SecondNumber = 7
   
   Total = FirstNumber + SecondNumber
      
   MsgBox "And the total is: " + CStr(Total),0,"NS Basic"
   
End Sub

2. Saving the Project

Save the project by selecting File from the top main and select Save Project. Name the project Add2MsgBox.nsd and click Save

3. Testing the Program

Select Start from the Run menu (or press F5).

Adding Two Numbers Using Form

Displaying the total of two fixed numbers in a MessageBox is not very practical since you need to modify the program every time you want to change the numbers. We will create a new version of the program that will allow the user to enter the numbers on a form and display the total when the user clicks a button.

1. Creating the Form

Start NS Basic/Desktop from the Start menu and select Standard from the project dialog box. (If NS Basic is already running, select File and New Project instead.) This will open a form window.

Add a text box for entering the first number:

Click on the TextBox object in the Toolbox ("ab" icon)
Move the cursor to the form and click the left mouse button to place the object on the form
Click on the object to select it.
In the Properties window, change the Name to "txtFirstNo"
Scroll down in the Properties Window and delete the value of Text
Use the mouse to expand the size of the TextBox and reposition on the form.

Add a text label before the first number:

Select label object in the Toolbox ("A" icon)
Place it on the form before the text box and click on it to select.
In the Properties window, change the Name to "lblFirstNo" (This is optional since we will not need to refer to it in our program.)
In the Properties window, change the Caption to "First Number"

Add a text box for entering the second number:

Click on the TextBox object in the Toolbox ("ab" icon)
Move the cursor to the form and click the left mouse button to place the object on the form
Click on the object to select it.
In the Properties window, change the Name to "txtSecondNo"
Scroll down in the Properties Window and delete the value of Text
Use the mouse to expand the size of the TextBox and reposition on the form.

Add a text label before the second number:

Select label object in the Toolbox ("A" icon)
Place it on the form before the text box and click on it to select.
In the Properties window, change the Name to "lblSecondNo" (This is optional since we will not need to refer to it in our program.)
In the Properties window, change the Caption to "Second Number"

Add a text box for displaying the Total:

Click on the TextBox object in the Toolbox ("ab" icon)
Move the cursor to the form and click the left mouse button to place the object on the form
Click on the object to select it.
In the Properties window, change the Name to "txtTotal"
Scroll down in the Properties Window and change the value of Locked to True (makes the field read-only)
Scroll down in the Properties Window and delete the value of Text
Use the mouse to expand the size of the TextBox and reposition on the form.

Add a label before the Total field:

Select label object in the Toolbox ("A" icon)
Place it on the form before the text box and click on it to select it
In the Properties Window, change the Name to "lblTotal" (optional)
In the Properties window, change the Caption to "Total ="
Expand the label to hold the text

Add a button to add the two numbers:

Select the CommandButton object in the Toolbox (blank rectangle box).
Place it on the form and click on it to select it.
In the Properties window, change the Name to "cmdAdd"
In the Properties window, change the Caption to "Add"
Use the mouse to expand the size of the CommandButton to display the text all on the same line and reposition on the form.

2. Saving the Project

Save the project by selecting File from the top main and select Save Project. Name the project Add2Form.nsd and click Save

3. Testing the Form

At this point we have a finished form but have not entered any code to actually add the numbers and display the results. You can still run the program to see how the form will appear on the desktop. You may find that some tweaks are needed in the size and position of some of the controls and labels.

Select Start from the Run menu (or press F5).

Note: As a shortcut, you can use F5 to both Save and Start the program. If you are working with a new project, you will be prompted for a project name before the program is started.

4. Creating the Code

We are now ready to add code to our form to make it actually do some work. We will use the same variables we declared in our first example but read their values from the fields entered by the user. Reading the user's input and adding the numbers will be performed when the user clicks on the Add button.

NS Basic will automatically open the Code Window and generate the Add button subroutine when you double click the button on the form. You can also open the Code Window by right clicking on the form and selecting View Code.

Enter the code so it looks like the following screen.

Option Explicit
ShowOKButton True

Dim FirstNumber
Dim SecondNumber
Dim Total
   
Sub cmdAdd_Click   
   FirstNumber  = CSng(txtFirstNo.Text)
   SecondNumber = CSng(txtSecondNo.Text)
   
   Total = FirstNumber + SecondNumber
   
   txtTotal.Text = Total
End Sub

The CSng function is used to convert the number string the user enter into a single precision number.

Note: The code uses variables to hold the user's numbers and the total. You could also eliminate all the variables by directly accessing the fields directly and not storing anything.

	txtTotal.Text = CSng(txtFirstNo.Text) + CSng(txtSecondNo.Text)

Either way works but I feel the program is easier to understand when the variables are used.

5. Testing the Program

Select Start from the Run menu (or press F5).

There are three TextBox fields on the form. The first two accept user input and the third (Total) has it's Locked property set to True, making it a read-only field. This property can be set in the Property window or as a line of code.

6. Error Checking

The above program is very simple in terms of it's function and lack of any type of error checking. As an additional exercise, code was added to verify that the user has entered the proper values when the Add button is clicked. The IsNumeric function is used to verify that the user has enter a proper number into both text box fields. An error message is displayed if the field is left blank or does not contain a valid number.

The final program with error checking:

Option Explicit
ShowOKButton True

Dim FirstNumber
Dim SecondNumber
Dim Total
   
Sub cmdAdd_Click
   If Not IsNumeric(txtFirstNo.Text) Then
      MsgBox "First Number must be a number!",0,"NS Basic"
      Exit Sub
   End If

   If Not IsNumeric(txtSecondNo.Text) Then
      MsgBox "Second Number must be a number!",0,"NS Basic"
      Exit Sub
   End If
         
   FirstNumber  = CSng(txtFirstNo.Text)
   SecondNumber = CSng(txtSecondNo.Text)
   
   Total = FirstNumber + SecondNumber
   
   txtTotal.Text = Total
End Sub