Form-based Applications in Smart Pascal

We have demonstrated the use of an EditBox, Button and Label in Getting Started with Visual Components Projects and also a PaintBox to display a Julia Set fractal. The web version of WaveInterference shows you how to generate a grid of EditBoxes in code. It also uses a CheckBox and ListBox.

Our demonstration of accessing data in a MySQL database uses a Panel inside a ScrollBox. (The table of data is displayed by assigning the HTML code of the table to the innerHTML property of the panel).

You can follow links to examples of the uses of visual components from this part of the Smart Pascal general index (where each type has the TW3 prefix).

Follow the numbered links at the bottom of the page for demonstrations of the use of other visual components in Smart Mobile Studio.

Using the Property Inspector

Drag up the boundary between the Project manager and the Property inspector to see more of the latter. Select the component you wish to modify using the drop-down list at the top of the Property inspector or by clicking within its outline in the design view of the form. Click in the edit box to the right of the property name and type in the new value for the property. You must press Enter or click elsewhere within the Property inspector to enable the typed value to be accepted. If, when you click in the edit box, you see an ellipsis then you can click the ellipsis to access a specialised property editor. This is the easy way to change the Color property.

Select the Events tab of the Property inspector and double click in the edit box of the event for which you wish to write code. This automatically gives you an empty procedure in the code editor and positions the cursor ready for you to start typing. To delete an unwanted event procedure, remove the automatically inserted name of the procedure from the edit box and delete the procedure declaration and code in the editor. (You can also remove a reference to a procedure by closing the project, editing (with Notepad++) the XML towards the bottom of the .proj file, then reopening the project. A typical line of XML to remove would be <OnClick>W3Memo1Click</OnClick>).

Programming - a skill for life!

Developing graphical web pages including 3D, input from keyboard and mouse and storing and loading data