Assemble the GUI

---

You will now begin to assemble the graphical components for your file browser. All of the graphical components can be found in the Object Palette window. This application is based around one screen, which will accept input and display the results.

1. In the MIDlet composer, make sure that the TextBrowser node is expanded in the Parts tree. You will see the nine built-in nodes of the MIDlet. These are important, fundamental parts of the MIDlet and cannot be moved or deleted. Note the last node, 'Display'. This is where all screens which will be added to the MIDlet will be dropped.
2. On the Mobile Devices Palette, make sure that the first page, 'Displayables', is visible. (If not, click the mouse button on the 'Displayables' Tab.)
3. You will see icons for all of the basic screen types. Click the icon named 'Form' with the mouse and drag the form to the Display node. The tree will display a cancel icon if an attempt is made to drag the form to an inappropriate place. If the drag is valid, a line appears in the tree showing where the part will appear. Release the mouse to create the new part at that place in the tree.
4. If the Form is properly dragged to the tree, it will appear under Display in the tree, and also in the Emulator as a new screen with a name similar to form0. If the Form was dropped into the recycling bin, it may be dragged to the Display node. In this case, the button Display this Form, located on the property sheet of the Form, must be pressed to show it in the Emulator.

Now you will add some components to the Form. The Form needs a text area where the URL can be entered, and an area where the text that is returned may be displayed.

5. On the Palette, click on the 'Form Items' tab to display the different items which a form may display.
6. Drag a TextField from the Palette to the form0 item on the Parts tree. Note that this is the only currently appropriate place on the tree (other than the Recycling Bin). If the TextField is properly dragged to the tree, it will appear under the form in the tree with a name similar to textField1, and also in the Emulator as an item in the form with a bold label titled 'textField1' and a text area with the words 'initial text'.
7. Set the label of the textfield to 'url' by changing the text in the item label box of the Properties area of the composer. Note that the label in the Emulator changes immediately.
8. Set the Starting text to 'http://palm.datarp.com/palm.txt'. Again the changes are reflected in the Emulator as you make them.
9. Drag a StringItem from the Mobile Devices Palette to beneath the textfield in the Parts tree. The order of the items in the tree determines their order on the screen, so if you accidentally put the StringItem above the textField, you can drag it in the tree so that it appears below. The string item displays in the Emulator as the word 'stringItem2'
10. In the Composer, set the Item text for the StringItem to 'not yet loaded'. This will be the initial text that the user sees.

There is still one important item to add: a way to tell the MIDlet to load the url. MIDlets execute code in response to user actions through Commands. We will create one in the next section.