Java Reference
In-Depth Information
stylesheets, as it is necessary to create many CSS classes for the various
components we are using: form, input, text, picture viewer, etc.
Now that we have our widget.xml file in place, let's analyze the
source code for the Flickr Viewer widget, discussing the most important
points for creating the application's UI and functionality.
A.4.2 Source Code
The first thing we notice is that this widget has much more complex views
than our simple Hello World example. Let us begin with the creation of
the Form view, used to input the search criteria:
Shell createForm() {
Flow content = new Flow(getStyle("default"));
content.setPreferredSize(-100, -100);
content.add(createHeaderText("Enter the search criteria (multiple
values must be separated by a comma):"));
// create some text components and choices
addText(content,"Tags");
addInput(content,"Tags");
addText(content,"Tagmode");
addChoice(content,["All","Any"]);
final Shell shell = new Shell(content);
shell.setStyle(getStyle("maxi"));
return shell;
}
First, we create a Flow object (named content ), which is the main
container for our view. We can think of a Flow object as the equivalent
of LCDUI's Form class, with the difference being that Flow uses HTML-
style positioning. An instance of the Style class is passed to content
so all components added to it use the same style definitions. We then
proceed to add several UI components: a header text, serving as this
view's title, then a text item, an input field, another text item and a
Choice object.
We used several helper methods to create and style these components,
and their source code is quite similar to each other: instantiate a compo-
nent, passing a Style defined in widget.xml , define a label for it, and
addittothe content container. For example, the addInput() method
is written like this:
void addInput(Flow content, String st) {
// create text-input that can contain any characters
// input is the equivalent of MIDP's TextField
input = new Input(getStyle("form.input"), st, &", ANY);
input.setPreferredWidth(-100);
Search WWH ::




Custom Search