Using Forms
A Form allows you to place any items on the display and let the user interact with them.
Design
You can use following CSS attributes for the Form:
| CSS Attribute | Default | Values | Explanation |
|---|---|---|---|
| always-include | false | true, false | Defines if a style should always be included, even if not used. |
| background | - | background definition | The background of an item or screen. The default background for items is "none", the default background for screens is a simple white background. |
| background-bottom | - | bottom, menubar | The bottom border of the background for this screen. Usually the background reaches to the very bottom of the screen which includes the menubar. By setting background-bottom: menubar; this background only reaches to the menubar. |
| background-top | - | top, title | The top border of the background for this screen. Usually the background reaches from the very top of the screen which includes the title. By setting background-top: title; this background starts after the title. |
| clip-screen-info | false | true, false | Enables or disables the clipping of the info-section. It is visible for TextFields in the direct input mode, for example. |
| columns | 1 | integer | The number of columns. This can be used to layout the items in a table. |
| complete-border | - | border | A border reference from the borders section. The border includes the label of the item and is independent of the item's normal border. |
| complete-background | - | background | A background name from the backgrounds section. The background includes the label of the item and is independent of the item's normal background. |
| border | - | border definition | The border of an item or screen. The default border is "none". |
| columns-width | normal | columns-width | Either "normal", "equal" or the width for each column in a comma separated list (e.g. "columns-width: 60,60,10"). |
| expand-items | false | true, false | Expands the items within a screen or container to the width of the largest item - in contrast to the expand layout not the full available width is being used. |
| focused-style | focused | style | The name of the style for the currently focused item, usually applied with a [style-name]:hover construct. |
| focused-style-first | - | style | The focused style for the first item in an Screen, ChoiceGroup, List, Container. |
| focused-style-last | - | style | The focused style for the last item in an Screen, ChoiceGroup, List, Container. |
| foreground-image | - | imageurl | The url of the image that should be shown at the topmost layer. You can also set the foreground-x and foreground-y positions. |
| foreground-x | - | integer | The x position of the foreground image. |
| foreground-y | - | integer | The y position of the foreground image. |
| inherit | true | true, false | Defines if a style that extends this style should inherit all attributes. |
| menubar-color | - | color | The color of the menu-bar. This overrides the settings in the predefined style "menu". This attribute is only used, when the "menu" fullscreen setting is activated in the "build.xml" file. |
| menubar-style | menubar | style | The name of the style for the menubar of the corresponding Screen. |
| table-selected-background | - | background | The background for selected cells of a table. |
| repaint-previous-screen | false | true, false | Specifies whether the previous screen should be repainted whenever the current screen changes, i.e. by user interaction. This makes sense when a translucent background is used for the current screen and the screen contains modifiable or selectable items. |
| screen-change-animation | - | An effect that should be shown whenever the screen is changed. | |
| screen-orientation-change-animation | - | screen-change-animation | Defines the animation that should be shown when the screen orientation is changed. Orientation changes need to be allowed by setting the preprocessing variable ScreenOrientationCanChangeManually to true. |
| scroll-mode | smooth | normal, smooth | Enables or disables the smooth scrolling function. |
| scrollbar-slider-color | black | color | The color of the slider, is ignored when a slider-image is defined. |
| scrollbar-slider-down-image | - | imageurl | The image used for signaling that the user can scroll downwards. By default nothing is painted. |
| scrollbar-slider-image-repeat | false | true, false | Either "true" or "false". When "true" is given, the slider image is repeated vertically, if necessary. |
| scrollbar-slider-mode | page | area, item, page | The mode of the slider, either "area", "item" or "page". In the "area" mode the slider represents the position of the current selection relative to the complete width and height. In the "item" mode the index of the currently selected item is taken into account relative to the number of items. In the "page" mode the height of the currently visible area will be set relative to the complete height of the screen. The default mode is "page". |
| scrollbar-slider-up-image | - | imageurl | The image used for signaling that the user can scroll upwards. By default nothing is painted. |
| scrollbar-slider-width | 2 | integer | The width of the slider in pixels, is ignored when a slider-image is defined. |
| scrollindicator-color | black | color | The color of the item which indicates that the user can scroll the current screen. Is ignored when a scrollbar is used. |
| scrollindicator-up-image | - | imageurl | The URL of the image indicating that the user can scroll upwards. |
| table-selected-row-background | - | background | The background for selected rows of a table. |
| scrollbar-slider-image | - | imageurl | The URL of image used for the slider. |
| scrollbar-style | scrollbar | style | The name of the style for the scrollbar of the corresponding Screen. |
| show-scrollbar | true | true, false | Can be used to deactivate the scrollbar for a specific screen. You need to activate scrollbar usage with polish.useScrollBar=true before using this CSS attribute. |
| table-selected-column-background | - | background | The background for selected columns of a table. |
| scrollindicator-down-image | - | imageurl | The URL of the image indicating that the user can scroll downwards. |
| separate-menu | true | true, false | Ensures that the menu is painted at the bottom of the screen without using the margins of the screen. You can apply the screen margins to the menubar as well by setting the "separate-menubar" property to "true". |
| ticker-position | top | top, bottom | You can specify the position of the ticker on the screen. |
| title-position | top | top, bottom | You can specify the position of the title on the screen. |
| title-style | title | style | The name of the style for the title of the corresponding Screen. |
| view-type | - | coverflow, dropping, fisheye, grayout, midp2, numbered, shuffle, verticalfixed | Defines another visualization for an Item or a Screen. |
| view-type-sequential-traversal | false | true, false | Defines if the cells of a table can only be traversered in sequential order. By default you can move to the next row by pressing down - when the sequential-traversal is enabled pressing down will move the focus to the next item instead. Only applicable when the columns attribute is being used. |
Programming
Use a javax.microedition.lcdui.Form as you would normally in your application and
use UiAccess for
using J2ME Polish specific functionalities like:
setStyle( Screen screen ): Sets a style in conjuntion with astylepreprocessing directive.setStyle( Screen screen, Style style ): Sets a style programmatically.getContentHeight( Screen screen ): Retrieves the height in pixels available for content on the specified screen.
JavaDoc
