Projects, Forms, and Controls: Difference between revisions
C185driver (talk | contribs) |
|||
(21 intermediate revisions by 2 users not shown) | |||
Line 1: | Line 1: | ||
== Controls == | |||
A control is a visual object used by your program. Controls have Properties which can be queried and set, Methods which can be called as FUNCTION or SUB procedures, and Events which can be triggered by user actions, the operating system, or other programs. | |||
== | A number of controls are included with App Studio. These include [[CheckBox|CheckBox]], [[Button|Button]], [[List|List]], [[Grid|Grid]], [[TextBox|TextBox]], and other common objects. | ||
Controls are normally child elements of a specific [[Form|Form]], and display only on that form. To reuse a control so that it displays globally on all forms, move the control to become a child of the NSBPage object, which contains all of the forms. The appendChild() function accomplishes this. | |||
<pre> | |||
Sub Main() | |||
NSBPage.appendChild(HeaderBar1) | |||
End Sub | |||
</pre> | |||
Create the control once on any form at design time. To hide the control, use <code>HeaderBar1.hide()</code> at runtime. | |||
== Control Events == | |||
An event is a call that a control makes to your program, as a result of an action in the control. For instance, if you have a commandbutton in your program, an event will take place when the user taps the button. If your button's name is "MyButton", App Studio will call the function MyButton_onclick() in your program. If you do not have such a function, the event is ignored. <br /> | An event is a call that a control makes to your program, as a result of an action in the control. For instance, if you have a commandbutton in your program, an event will take place when the user taps the button. If your button's name is "MyButton", App Studio will call the function MyButton_onclick() in your program. If you do not have such a function, the event is ignored. <br /> | ||
Another example would be if you were performing an SQL operation. Incoming data will cause the Success_Function event to be sent, which will then call Function Success_Function in your program. | Another example would be if you were performing an SQL operation. Incoming data will cause the Success_Function event to be sent, which will then call Function Success_Function in your program. | ||
== | == Control Methods == | ||
A control can be hidden by using <br /> | A control can be hidden by using <br /> | ||
<tt>myControl.hide</tt> <br /> | <tt>myControl.hide()</tt> <br /> | ||
A control can be shown by executing <br /> | A control can be shown by executing <br /> | ||
<tt>myControl.show</tt> | <tt>myControl.show()</tt> | ||
== Forms == | |||
A Form is a group of controls that are shown and hidden at the same time. Form names should be unique: not used also for a variable or another control. A good convention is to add frm in front as in frmHelp. Forms can be full screen or partial screen. More than one form can show at a time, so it’s possible to have two forms side by side on devices with large screens. Do this by setting the bounds of the form in the form’s properties. See also the [[Form]] page. | |||
== Form Methods == | |||
== | |||
A form can be hidden by using <br /> | A form can be hidden by using <br /> | ||
<tt>formName.hide</tt> <br /> | <tt>formName.hide()</tt> <br /> | ||
A form can be shown by executing <br /> | A form can be shown by executing <br /> | ||
<tt>formName.show</tt> | <tt>formName.show()</tt> | ||
To go to a new form, <br /> | To go to a new form, <br /> | ||
<tt>ChangeForm(Form2)</tt> | <tt>[[ChangeForm]](Form2)</tt> | ||
To see the name of the current form <br /> | To see the name of the current form <br /> | ||
Line 44: | Line 50: | ||
</pre> | </pre> | ||
== | == Form Events == | ||
Show and Hide events are called when you use ChangeForm() to go to a new form. | Show and Hide events are called when you use [[ChangeForm]]() to go to a new form. | ||
'''Example''' | '''Example''' | ||
Line 61: | Line 67: | ||
</pre> | </pre> | ||
== | == Program Events == | ||
When a program is started, code is run in the following order: | When a program is started, code is run in the following order: | ||
# Global code in forms, in the order the forms appear in the [[Project Explorer]]. 'firstform' does not affect this. | # Global code in forms, in the order the forms appear in the [[Project Explorer]]. 'firstform' does not affect this. | ||
# Global code in Project Properties and Global Code | # Global code in Project Properties and Global Code. | ||
# Sub Main(), if present. Sub Main() is not called until loading is complete. | |||
# Form code in the first form's onshow() event. This is also the point where first form appears on the display. If you want to reconfigure some controls when the form first displays, this is the place to do it. | # Form code in the first form's onshow() event. This is also the point where first form appears on the display. If you want to reconfigure some controls when the form first displays, this is the place to do it. | ||
For clarity, it is best to always put all your global code in the Project Properties and Global Code section. <br /> | For clarity, it is best to always put all your global code in the Project Properties and Global Code section. <br /> | ||
The forms are created at the same time as the global code is run.<br /> | The forms are created at the same time as the global code is run.<br /> | ||
A call is made to Sub Main() before the first form is shown. If you have such a function, it will be executed. <br /> | |||
When you exit the program, the window_onbeforeunload function is called. This is a good place to do housekeeping or save some data. If you return anything from this function, it is used in a confirm script. | When you exit the program, the window_onbeforeunload function is called. This is a good place to do housekeeping or save some data. If you return anything from this function, it is used in a confirm script. | ||
Line 77: | Line 83: | ||
<pre> | <pre> | ||
'Put this in your global code | 'Put this in your global code | ||
Print "This is the global code" | |||
Sub Main() | Sub Main() | ||
Print "Main" | |||
End Sub | End Sub | ||
Function window_onunload() | Function window_onunload() | ||
Print "Unloading!" | |||
End Function | End Function | ||
</pre> | |||
== | window_onunload does not work on all browsers. In particular, it does not work on Chrome. | ||
===Browser Warning Message === | |||
On startup, AppStudio apps call a function to check if the browser being used will work. If it won't, the message in [[Properties Window|browserwarningmsg]] will be displayed. You can change the message in Project Properties. There are two more things you can do to customize how the warning message appears: | |||
' | |||
1. Create your own browserWarningMessage script. This will be called instead of the default script. | |||
<pre> | |||
Sub browserWarningMessage() | |||
End | NSB.MsgBox "App will run on all browsers. May not be compatible." | ||
End Script | |||
</pre> | |||
2. You can also create your own browserWarningMessageAfterScript. This will be called only if the default script is used, and the user needs to be warned. | |||
<pre> | <pre> | ||
Sub browserWarningMessageAfterScript() | |||
NSB.MsgBox "OK, you have been warned!" | |||
End Sub | |||
</pre> | </pre> |
Latest revision as of 00:05, 11 October 2015
Controls
A control is a visual object used by your program. Controls have Properties which can be queried and set, Methods which can be called as FUNCTION or SUB procedures, and Events which can be triggered by user actions, the operating system, or other programs.
A number of controls are included with App Studio. These include CheckBox, Button, List, Grid, TextBox, and other common objects.
Controls are normally child elements of a specific Form, and display only on that form. To reuse a control so that it displays globally on all forms, move the control to become a child of the NSBPage object, which contains all of the forms. The appendChild() function accomplishes this.
Sub Main() NSBPage.appendChild(HeaderBar1) End Sub
Create the control once on any form at design time. To hide the control, use HeaderBar1.hide()
at runtime.
Control Events
An event is a call that a control makes to your program, as a result of an action in the control. For instance, if you have a commandbutton in your program, an event will take place when the user taps the button. If your button's name is "MyButton", App Studio will call the function MyButton_onclick() in your program. If you do not have such a function, the event is ignored.
Another example would be if you were performing an SQL operation. Incoming data will cause the Success_Function event to be sent, which will then call Function Success_Function in your program.
Control Methods
A control can be hidden by using
myControl.hide()
A control can be shown by executing
myControl.show()
Forms
A Form is a group of controls that are shown and hidden at the same time. Form names should be unique: not used also for a variable or another control. A good convention is to add frm in front as in frmHelp. Forms can be full screen or partial screen. More than one form can show at a time, so it’s possible to have two forms side by side on devices with large screens. Do this by setting the bounds of the form in the form’s properties. See also the Form page.
Form Methods
A form can be hidden by using
formName.hide()
A form can be shown by executing
formName.show()
To go to a new form,
ChangeForm(Form2)
To see the name of the current form
Msgbox NSBCurrentForm.id
To change the background color of a form, blank out 'backgroundimage' in Project Properties, then add these statements to your code:
Sub Main() document.body.style.backgroundColor=vbRed End Sub
Form Events
Show and Hide events are called when you use ChangeForm() to go to a new form.
Example
ChangeForm(Form2) Function Form1_onhide() 'save our work End Function Function Form2_onshow() 'put in initial values End Function
Program Events
When a program is started, code is run in the following order:
- Global code in forms, in the order the forms appear in the Project Explorer. 'firstform' does not affect this.
- Global code in Project Properties and Global Code.
- Sub Main(), if present. Sub Main() is not called until loading is complete.
- Form code in the first form's onshow() event. This is also the point where first form appears on the display. If you want to reconfigure some controls when the form first displays, this is the place to do it.
For clarity, it is best to always put all your global code in the Project Properties and Global Code section.
The forms are created at the same time as the global code is run.
A call is made to Sub Main() before the first form is shown. If you have such a function, it will be executed.
When you exit the program, the window_onbeforeunload function is called. This is a good place to do housekeeping or save some data. If you return anything from this function, it is used in a confirm script.
Example
'Put this in your global code Print "This is the global code" Sub Main() Print "Main" End Sub Function window_onunload() Print "Unloading!" End Function
window_onunload does not work on all browsers. In particular, it does not work on Chrome.
Browser Warning Message
On startup, AppStudio apps call a function to check if the browser being used will work. If it won't, the message in browserwarningmsg will be displayed. You can change the message in Project Properties. There are two more things you can do to customize how the warning message appears:
1. Create your own browserWarningMessage script. This will be called instead of the default script.
Sub browserWarningMessage() NSB.MsgBox "App will run on all browsers. May not be compatible." End Script
2. You can also create your own browserWarningMessageAfterScript. This will be called only if the default script is used, and the user needs to be warned.
Sub browserWarningMessageAfterScript() NSB.MsgBox "OK, you have been warned!" End Sub