BUILD GREAT UI WITH LWUIT FOR NOKIA ASHA SOFTWARE PLATFORM 1.0

Cao PhongDeveloper Tech Support ManagerAug 07, 2013

LWUIT FOR NOKIA ASHA SOFTWARE PLATFORM 1.0• New port of LWUIT, targeting

specifically new Asha platform• Based on the LWUIT for Series

40 v1.0• Adds Nokia Asha Software

Platform 1.0 Theme• Adds 8 new components• Changes and adaptations of

existing components to new Asha platform

• Improved performance especially in themes memory usage.

• 24 Examples in SDK

LWUIT SDK PLUGIN AND DEV GUIDES

LWUIT plugin and examples in Asha SDK 1.0 Beta:

C:\Nokia\Devices\Nokia_Asha_SDK_1_0\plugins\lwuit

Brand new LWUIT Developer’s Library, covering Asha, Series 40 and UX:

https://www.developer.nokia.com/Resources/Library/LWUIT

THE NEW LWUIT UI COMPONENTS FOR NOKIA ASHA SOFTWARE PLATFORM:• ContextMenu• DatePicker• GroupHeader• HeaderBar• InfiniteProgressIndicator• NotificationBar• PopupChoiceGroup• RefreshLoadBar

ContextMenu• It allows the developer to create and show the

menu in the most suitable way for the MIDlet. The ContextMenu extends from dialog therefore the API is very similar.

• To have the same behavior as the platform menu, the developer should use the LONG_TAP gesture to show the menu. The easiest way to use the ContextMenu is to call the static show() method which will return the selected command.

DatePicker• Extends Form and cannot be added as

component on Form. Instead you can directly call its show() method to display it on the screen.

• DatePicker allows to set date using different implementations such as:

• Three columns date picker (Day, Month, and Year)

• Two columns date picker (Month and Year)

• Grid view date picker (Day)• The DatePickerListener can be used

to listen to the event of DatePicker.

GroupHeader• Allows to create a header which can be added on

Form, and is used to separate a group of items.• GroupHeader has different implementations such

as:• Simple GroupHeader• GroupHeader with separator• GroupHeader with spinner

HeaderBar• Allows the user to create a custom HeaderBar which can

be added on Form. It is used to create informative and interactive header bars, and has action buttons.

• HeaderBar has different implementations such as:• Static HeaderBar• HeaderBar with spinner• HeaderBar with sub-text• HeaderBar with icon• HeaderBar with icon and spinner• HeaderBar with icon and sub-text• Interactive HeaderBar

• HeaderBar should be only used with Display.getInstance().setForceFullScreen(true) and should be added as the first component in the Form to get the same look and feel of the platform header bar.

InfiniteProgressIndicatorAllows to show an infinite progress Indicator.InfiniteProgressIndicator has different implementations such as:

– SMALL ProgressIndicator– MEDIUM ProgressIndicator– LARGE ProgressIndicator– CUSTOM ProgressIndicator

NotificationBar• Allows to show a UI to user as notification.

NotificationBar uses GlassPane to paint on top of a displayable object.

• NotificationBar has different implementations such as:

• NotificationBar with and without icon

• NotificationBar with single, multiline or continuos text

• Notification bar with the combination of the above

PopupChoiceGroup• Similar to the platform ChoicePicker. As it

extends Container, you can create an instance of PopupChoiceGroup and add it on to a Form.

• PopupChoiceGroup has two implementations:• Single selection ChoicePickerThis

is used to provide the platform look and feel to the MIDlet, and as a replacement for the ComboBox.

• Multiple selection ChoicePickerThis is used for allowing selection of multiple items from a list.

• The PopupChoiceGroup component opens up to show selectable items when the user presses the component.

RefreshLoadBarAllows to show an interactive UI to user to refresh a page or screen.

SUMMARY – DETAILED WHAT’S NEW• This release is based on the LWUIT for Series 40 v1.0

package, and it adds the Nokia Asha software platform theme and new components.

• Added new LWUIT UI components for Nokia Ashasoftware platform — DatePicker, GroupHeader, HeaderBar, InfiniteProgressIndicator, NotificationBar, PopupChoiceGroup, RefreshLoadBar, TimePicker.

• Added Single and Multiple ChoicePicker components.• Added Cancel command in ComboBox.• Added method for creation of DirectUtils Font.• Added getMode() and setMode() methods to

CategoryBar provider to support tabs and actions in CategoryBar.

• Added CategoryBarProvider that acts as a wrapper for CategoryBar API.

• Added 3D effects for Button text.• Set the default Font of Button at 18px.

• Set BoxLayout as default layout for Form.• Added automatic localization support.• Styled CheckBox, ComboBox, DatePicker, Dialog,

FormItem, RadioButton, ScrollBar, Slider, Tab, Table, TextArea, and TextField to match the UI of Nokia Asha software platform.

• Created theme for Nokia Asha software platform.• Added Nokia Asha SDK 1.0 theme template to

ResourceEditor.• Added coloured buttons to Nokia Asha software

platform theme file.• Improved performance especially in memory

usage of theme.• Removed JUnit dependency from the desktop

version of ResourceEditor project.• Added 24 example MIDlets

THANK YOU!Nokia Vietnam – Developers Experience: https://www.facebook.com/groups/viet.nok.dev/