Tutorial
This tutorial will show you how create your own application. You may want to print this tutorial, it will make it easier to follow interactively.
Start Visual MacStandardBasic and select the menu item New Project in the File menu.
A Save dialog box will appear requesting the name of the project you are going to create. Most of the time you will want a project and all the project's files to be in their own folder.
==> Select the New command button in the dialog and and another diolog box will appear allowing you to name the new folder to be created.
==> Enter Tutor1 Folder for this example and click OK. You will then return to the original Save Dialog box.
==> After the folder is created enter the name of the project to create, in this example enter Tutor1 Project and click the Save button.
When you create a new project, Visual MacStandardBasic creates and displays Form1 with default code stationary. This code stationary provides the necessary framework of procedures so you are ready to go. The following are the procedures that are preinstalled in Form1.
Start
Dim A CreateTheMenus Form Form1 A=0 Do While A=0 Loop
Finish Sub CreateTheMenus( )
MenuApple MenuAddItem 1, "About Application", "", AboutTheApp MenuDesk MenuAdd 2, "File", None MenuAddItem 2, "Quit", "Q", QuitTheApp
EndSub Sub QuitTheApp( )
End
EndSub Sub AboutTheApp( )
Dim a
a = MsgBox ("Application Info", 0)
EndSub
==> To see these procedures yourself, double-click anywhere in the context area of the Form1. Click on the listbox in the editor's window to select a procedure to edit.
We will examine these procedures in depth.
The procedure CreateTheMenus first creates the Apple menu and then adds the menu item About Application. If this menu item is selected the Sub procedure AboutTheApp is called. You will probably want change the text About Application to the name of the application that you are creating. The MenuDesk command will add the remainder Apple menu items automatically.
The MenuAdd command creates a File menu. The only menu item added to the File menu is Quit. If this menu item selected by the mouse or called by the command-Q keys the Sub procedure QuitTheApp will be called.
The only thing that the QuitTheApp procedure does is end the program. The END command will closes all windows and terminate the application.
In the START procedure after CreateTheMenus is the statement:
Form Form1
The Form command will open the specified form. In this case, Form1 will displayed with any controls that you may add later.
The last three statements are a continuos loop that waits for events to happen. If these statements were not there, execution would go to the end of the START procedure. This would cause the application to terminate as if the END command was executed.
==> If you have opened the edit window for Form1, close it now by clicking in the closebox of the window.
Let's change the form...
You should see the new windows on the screen from left to right they should be the Tool Palette, Form1, and the Properties windows.
==> Single-click anywhere on Form1 to bring it to the front. You should see the Properties window on the right side of the screen ( If not, it as been closed, so select View Properties in the Preferences menu ). This contains the properties of Form1. You may need to use the scrollbar or expand the window to see all the properties.
Let's change the background color of Form1.
==> Scroll down in the Properties window until you see the property BackColor. The default is white so we'll change it to another color.
==> Click anywhere in the boxed area around the word BackColor. A Color Selection dialog window will appear. Use the controls in this window to select the desired color for Form1's background. When you click on the OK button of this window, Form1 will now have it's new background color.
Note: Some properties you edit in a textbox, others have pulldown menus, and color selection you have already seen.
Let's change the title of Form1.
==> Scroll up in the Properties window until you see the property Title. The default title is the same as the name of the form, Form1.
==> Click anywhere in the boxed area around the word Title. You can now edit the title, enter My Window
When you are done you can:
- Press Return or click anywhere on the screen to end editing and apply changes.
- Or you can press the ESC key (the escape key) which will end editing of the property and revert the property's value to what it was before you started editing.
Now let's save Form1.
==> Select Save File in the File menu and we will use the default name of the form, Form1, as the filename.
If you check the Tutor1 Project menu in the menubar you will see there are 3 submenus: Forms, Modules, and Resources. Form1 should now be listed in the Forms submenu.
We will compile now and see what our application looks like.
==> Select Compile & Run in the Run menu.
Your application will compile and start execution.
You should see My Window in front now with a simple File menu (you'll also see a Help menu in MacOS 8). You can drag the window around and close it. To end the application select Quit in the File menu.
That wasn't hard, you have an application and you haven't even had to write any BASIC code manually. It is not a very useful application so...
Now we will create some controls ...
The tool palette allows you to select and create controls on a form.
We will first create a command button.
==> Select command button icon in the Tool Palette window.
==> Now, anywhere in Form1's content area, single-click and hold the mouse button down as you drag the mouse cursor to create a stretching rectangle. Release the mouse button when done.
To move the location of Button1:
==> Single-click in the middle of the control and hold the mouse button down as you drag Button1 to it's new location.
To resize the location of Button1:
==> Single-click in the lower right sizebox of the control and hold the mouse button down as you drag Button1 to it's new size.
We need to change the text of Button1.
==> Scroll up in the Properties window until you see the property Text. The default text is the same as the name of the control, Button1.
==> Click anywhere in the boxed area around the word Text. You can now edit the title, let's enter Beeper.
Note: if you double-click in the boxed area, it will highlight all the text allowing you delete it by typing over it.
Well with a button titled Beeper, it should probably beep so:
==> Double-click in the middle of the Button1 (now with the titled Beeper).
An edit module window will appear with the Button1_Click procedure in view. You can use the edit module's droplist to select any procedure to edit.
==> In the Button1_Click procedure type Beep
You will notice that the Sub Proc. property in the Properties window has the name of this procedure Button1_Click .
When the application is started, if the user clicks on the Beeper button this Sub procedure will be called and the Beep command will be executed.
Let's try it.
==> Select Compile & Run in the Run menu.
It will ask you if you want to save Form1.
==> Confirm yes by selecting the Save button.
The application should compile without errors and execute. If you single-click on the Beeper button will emit a single system beep. To end the application select Quit in the File menu.
How about a little speech...
Let's allow this application to talk. We will add a textbox and a command button so that a single-clicked on the command button will cause the contexts of the textbox to be spoken.
Please note that you need to be sure the Speech extension is installed on your system. If you are not sure you can check the Extentions Manager in the Controls Panel.
We will create a textbox control.
==> Select textbox control icon in the Tool Palette window.
==> Now, anywhere in Form1's content area, single-click and hold the mouse button down as you drag the mouse cursor to create a stretching rectangle. Release the mouse button when done.
As with the command button above you can move or resize the textbox to the desired location and size.
We need to remove the default text of TextBox.
==> Scroll up in the Properties window until you see the property Text. The default text is the same as the name of the control, TextBox1.
==> Double-click anywhere in the boxed area around the word Text. This will highlight the text, now press the delete key.
Now we will create a second command button control.
==> Select command button icon in the Tool Palette window.
==> Now, anywhere in Form1's content area, single-click and hold the mouse button down as you drag the mouse cursor to create a stretching rectangle. Release the mouse button when done.
We need to change the text of Button2.
==> Scroll up in the Properties window until you see the property Text. The default text is the same as the name of the control, Button2.
==> Click anywhere in the boxed area around the word Text. You can now edit the title, let's enter Speak and press Return.
We need to have Button2 speak the text contents of TextBox1 so we need a Sub procedure for it.
==> Double-click in the middle of the Speak button (named called Button2 ).
An edit module window will appear with the Button2_Click procedure.
==> In the Button2_Click type Say CtlText( TextBox1 ) as shown below:
You will notice that the Sub Proc. property in the Properties window has the name of this procedure Button2_Click .
Let's try it now.
==> Select Compile & Run in the Run menu.
It will ask you if you want to save Form1.
==> Confirm yes by selecting the Save button.
The application should compile without errors and execute. You can enter text into the textbox and when you single-click on the Speak button it will speak the contents of textbox1. To end the application select Quit in the File menu.
This is the end of this tutorial. There are several example projects in the Samples folder. You may want to try those projects and see how they work.