mWabaDemo Walkthrough


When the demo starts up an intro dialog box will appear. This is an example of a MessageBox class. This particular box is moveable (but not resizable). To move it around the screen simply drag it by its title bar. Click on the OK button to dismiss it.

After the box is dismissed the main window will appear. This window contains a pull-down menu bar and a TabbedPanel. The first set of controls on the first tab will be visible and consists on some edit fields (mInput), radio buttons, a choice control and normal buttons. If you select a different tab you will see the next set of controls appearing one by one as they are being drawn on the screen. This is because the program initially sets the mWaba system not to use double buffering. Switching on double buffering will change the way it operates such that a control or container is not drawn on the screen until all of it and its children have been drawn on an image buffer. This buffer is then drawn on the screen. This provides a much smoother transition from one set of controls to another, at the expense of incurring a delay while the drawing goes on in the background. To switch on double buffering and see the difference (this difference may not be noticable under Java running on a very fast processor) it makes, go to the Controls submenu of the Config menu. Then select the Buffered item at the bottom. This takes effect immediately and you can see the difference by switching from one tab to another.

The Main window is resizable and you can resize it by pressing on the very bottom of the window, just above the bottom edge. There is a recessed bar running across the bottom though it may be difficult to see at first. When you press it a reverse L will appear and will follow the pen as you drag it over the screen. This icon represents where the bottom right corner of the window will appear after you release it.

Resizing the window will cause the container within it to attempt to relocate and resize its components (in a way specified by how the components were added) to fit the window. Some components (such as labels) will not resize and so some may fall off the edge of the window. However the demo can be set up so that instead of shrinking the contents of the window the contents will stay at its preferred size but scroll bars will appear instead if it is too wide or too long for the frame. To select this mode go to the Application submenu of Config and select Scroll instead of Shrink/Stretch. Now the contents of the window will size itself to its preferred size (which is somewhat wide) with scroll bars allowing you to view different portions of it. I would advise though, that when you use the toolkit that you try to fit any set of containers to the screen size by shrinking or stretching. I would also advise that you keep the setting on Shrink/Stretch for the rest of the walkthrough.

The Tabbed Panel

You will note that the Tabbed panel has buttons at the top left and right to allow the tabs to scroll left and right. This means that you can have as many tabs as you want without having to worry about screen size.

The first tab demonstrates Splittable Panels. These panels provide vertical or horizontal splitter bars which can be moved to increase or decrease the areas of the container panel immediately before and after it. They are moved by dragging with the pen, but can also be set to move to predefined positions with a pen tap. There are several on this page for you to try out.

The second tab ("Personal Info") you will see a Choice (mChoice) control next to the "Smokes:" prompt. Choices work as you would expect them to except that they have the added feature that they can be set to always bring down the choice menu whenever you click them or they can be set to bring down the menu pnly when you click on the arrow, and will simply cycle through the choices when you click to the left of the arrow. This particular choice is set to work this way.

The next tab ("Contact Info") has three edit(mInput) controls. These work as normal but you will notice that clicking on a prompt (an mLabel control) will automatically activate its associated edit control. These three edits also have a further feature enabled. By double clicking on the edits you will automatically bring up a popup input window. This is a movable dialog frame that contains a single edit control containing the contents of the original control. You can enter data within it and then click OK to transfer the data to the original control or X to cancel the data entry. This feature is useful really for WinCE systems only. If you have an edit control at the bottom of the screen and you bring up one of the available input methods (Jot, T9 or Keyboard) it may end up covering the edit control itself. If you anticipate that this may happen for a particular edit control then enabling this feature will allow the users to see what they are entering even though the input panel may be up. This feature can be enabled for single or double clicks. The edit control at the bottom of the "List" tab is set to generate a pop-up box for a single click.

The next tab ("User Info") shows a couple more edits and three CheckBoxes. The only thing of note here is that the send edit control is in Password mode and so will only display '*' for each character.

The next tab ("List") shows a list control. The list control is placed in a scrollable holder so that as items are added or removed scroll bars will appear or disappear as necessary. The list can also be set to allow multiple selections or single selections. Clicking on an item causes the associated text to appear in the edit control at the bottom. Pressing Remove will remove any selected items from the list. Pressing Add will add the text in the edit control into the list.

The next tab ("Text Area") shows a TextArea control. This allows multi-line text entry with automatic scroll bars and area selection via pen drags. Resize the main window to see the effect on the scroll bars.

The next tab ("Images") shows a an image control (ImageControl) on the left and a choice control on the right. Changing the chosen item in the choice will change the image being displayed. You will notice the scrollbars appearing and disappearing as you change the image.

The final tab ("Font/Frame Test") allows you to test the available fonts on your system and demonstrates some of the windowing capabilities of the system. Pressing the "Test Font" button brings up a dialog box containing text of the font type you specified in the edits. Pressing "Test Frames" will bring up a non-modal frame. Each of these will contain two buttons, "Spawn Sibling" and "Spawn Child". The first button will bring up another frame which is a sibling of the original frame. They will both exist independently within their parent frame. Pressing "Spawn Child" will bring up another similar frame which exists only within the original frame. All these frames are moveable and resizable, so you can experiment with the capabilities and limitations of the system.

The Menus

The Config menu allows you to change various characteristics of the system. The first item is Controls which will bring up a submenu. These control the appearance of the controls (3D vs Flat and Gray vs Black&White), the state of the controls (Enabled vs Disabled and Editable vs Not Editable) and whether double buffering is being used (as explained briefly above).

The other items in the Config menu are self-explanatory except for the last one (All). This one brings up a dialog box which you can use to modify a sub-set of the config options. It has three buttons at the top, Palm, WinCE and Custom. Pressing Palm will set the system to Palm defaults (B/W, Flat controls at 160x160). Pressing WinCE will set the system to WinCE defaults (Gray, 3D controls at 240x320). Pressing Custom will set the system to be the parameters as specified in the controls below the buttons. You will notice that this dialog will always reset itself to the top left hand corner of the screen just in case changing the screen size suddenly renders it off the screen.

The File menu is really for demo only. It does not perform any function apart from the "Exit" item which will exit the demo.

The Help menu simply displays the About box for the application. This is also available by pressing the "i" button at the top of the frame.