LIGHTWEIGHT UI TOOLKIT MAKING COMPELLING JAVA ME APPLICATIONS EASY

Transcription

1 LIGHTWEIGHT UI TOOLKIT MAKING COMPELLING JAVA ME APPLICATIONS EASY Chen Fishbein, Software Architect Shai Almog, Software Architect Yoav Barel, Senior Manager TS-4921

2 Agenda What is LWUIT? Why? Key Benefits Key Features Demo Samples Tools Advanced Concepts Get Started Q&A 2

3 What Is LWUIT? Lightweight library bundled with the application Compelling UI Consistent across different devices Today's handsets MIDP 2.0/CLDC 1.1 only requirement! Inspired by Swing Resource editor 3

4 Why? Developed in-house to support project Hydrazine Complex UI requirements on existing devices High portability Developer's feedback Bridges the gap between today and tomorrow 4

5 Key Benefits Rapid development Familiar API Clean & Simple Easy deployment One JAR many devices Mass market devices Consistent Extendable Filthy Rich UI Brand-able 5

6 Key Features Swing Like MVC Layouts PLAF & Themes Fonts Touch Screen Animations & Transitions Rich widgets 3D Integration Painters Modal Dialog Synchronous Model External Tools I18N/L10N 6

7 Approach 7

8 LWUIT Demo 8

9 LWUIT Demo 9

10 Samples Hello World Form frm = new Form( Hi ); frm.addcomponent(new Label( World )); frm.addcommand(exitcommand); frm.show(); Now Make It Beautiful... Resources r = Resources.open( /mytheme.res"); UIManager.getInstance().setThemeProps(r.getTheme( theme ); 10

11 Samples List Form frm = new Form( List ); frm.setlayout(new BorderLayout()); List lst = new List(new String[] { Item 1, Item 2, Item 3, Item 4 }); lst.setlistcellrenderer(new MyRenderer()); frm.addcomponent(borderlayout.center, lst); frm.addcommand(exitcommand); frm.show(); 11

12 Samples Renderer class MyRenderer extends Label implements ListCellRenderer { private Image sady, smily;... public Component getlistcellrenderercomponent(list list, Object value, int index, boolean isselected) { settext(value.tostring()); setfocus(isselected); if (isselected) { seticon(sady); getstyle().setbgtransparency(100); } else { seticon(smily); getstyle().setbgtransparency(0); } return this; } public Component getlistfocuscomponent(list list) { return getlistcellrenderercomponent(list,"",0,true); } } 12

13 Samples Renderer (cont) 13

14 Samples Form Form frm = new Form( Survey ); frm.setlayout(new BoxLayout(BoxLayout.Y_AXIS)); frm.addcomponent(new Label( Are you happy? )); final RadioButton yes = new RadioButton( Yes ); RadioButton no = new RadioButton( No ); frm.addcomponent(yes); frm.addcomponent(no); ButtonGroup bg = new ButtonGroup(); bg.add(yes); bg.add(no); Button submit = new Button( Submit ); frm.addcomponent(submit); submit.addactionlistener(new ActionListener() { public void actionperformed(actionevent ev) { String text = Too bad :-( ; if(yes.isselected()) { text = Yay!!! ; } Dialog.show( Result, text, OK, null); } }); frm.show(); 14

15 Resource Editor Optional Tool Built For Designers Standalone Resources: Themes Fonts Animations/Images Localization Arbitrary Data LWUITDemo live preview 15

16 Matisse GUI Builder Award Winning, Mature Group Layout Baseline alignment Relative spacing/grow Event Handling Code D&D/C&P Styles & Themes Component Palette Custom Components 16

17 Tools Demo 17

18 Advanced Concepts Uses native rendering engine Renders onto GameCanvas Optional M3G rendering integration Planned: SVG support Abstracts physical motion Animations/Transitions based on internal engine Threading approach of Swing coupled with builtin Foxtrot Single EDT for rendering and events 18

19 Performance & Portability Testing heavily on Sprint devices, Nokia, SE, Motorolla and phoneme Many additional phones are tested Designed for small size/overhead Most overhead is in resources IndexedImage & light mode for low end Doesn't require preprocessor 19

20 Footprint Jar size as low as 50kb for a small application Memory depends on theme/functionality/resolution UI Demo runs on 320x240x24bpp Nokia S40 using under 1mb and no more than 2mb Themes can be light or heavy depending on their features 20

21 FAQs... MIDP 2.0 devices support LCDUI, why do I need LWUIT? LWUIT offers a rich UI alternative that sits on top of MIDP Both complement each other and LWUIT remains strictly optional Will I need to learn a new API?How similar is it to Swing? LWUIT was inspired by Swing. Developers should find it easy to move between LWUIT and AGUI/Swing APIs How will LWUIT assist me in dealing with fragmentation? LWUIT is Implemented on top of Canvas therefore highly portable Not a device API but bundled together with the application There are other UI toolkits out there why LWUIT? We believe LWUIT offers very attractive functionality for developing consistent and compelling Java ME apps LWUIT remains strictly optional Due to the open source nature of LWUIT we hope cross-pollination will occur for the benefit of the entire industry 21

22 Get Started Early access on java.net (binary) Online Tutorial Available in Sprint WTK 3.3 Come visit us at: The Mobility Village pod Please send us feedback Open Source soon!!! 22

23 Q&A 23

24 Chen Fishbein, Software Architect Shai Almog, Software Architect Yoav Barel, Senior Manager TS