JavaME UI - JMDF 2007

852 views

Published on

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
852
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
0
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

JavaME UI - JMDF 2007

  1. 1. Java ME User Interface Development User Interface Development - “Flash Lite vs. JavaME”, Bologna 29-01-2007 - http://www.jmdf.org
  2. 2. Agenda • Netbeans support for High level UI – Visual Designer – Fragmentation – Localization Support • Graphics APIs CLDC based – LCDUI – Mobile 3D Graphics – SVG Support • References User Interface Development - “Flash Lite vs. JavaME”, Bologna 29-01-2007 - http://www.jmdf.org
  3. 3. User Interface APIs - Today User Interface Development - “Flash Lite vs. JavaME”, Bologna 29-01-2007 - http://www.jmdf.org
  4. 4. Netbeans Mobile Visual Designer High Level UI • Flow Designer – Map out navigation – Visually represents the different paths that can be taken between your application’s different screens – You can add or remove screens, as well as the transitions between them • Screen Designer – Simulates how the screen will appear on a real device • Corresponding code automatically generated – Hint: Plan out your entire application flow before diving into the code manually User Interface Development - “Flash Lite vs. JavaME”, Bologna 29-01-2007 - http://www.jmdf.org
  5. 5. Layout with Mobile Visual Designer • The Component Palette – Screens – Commands – Form Items – Elements – Resources – Custom Components • Special Components – Splash Screen – Table – Wait Screen • Inspector and Properties Windows User Interface Development - “Flash Lite vs. JavaME”, Bologna 29-01-2007 - http://www.jmdf.org
  6. 6. Netbeans Mobile Visual Designer User Interface Development - “Flash Lite vs. JavaME”, Bologna 29-01-2007 - http://www.jmdf.org
  7. 7. Demo • Visual Designer Demonstration: – creating Mobile Splash Screens – using the TableItem User Interface Development - “Flash Lite vs. JavaME”, Bologna 29-01-2007 - http://www.jmdf.org
  8. 8. Optimize The Application For Different Devices - Configuration Manager • Writing a single application that will run on disparate platforms can be challenging: – screen size – free memory – software issues – available API’s • One configuration for each distribution JAR file you plan on building for your project • Existing configuration template • Customizable User Interface Development - “Flash Lite vs. JavaME”, Bologna 29-01-2007 - http://www.jmdf.org
  9. 9. Example of APIs support on Nokia Devices User Interface Development - “Flash Lite vs. JavaME”, Bologna 29-01-2007 - http://www.jmdf.org
  10. 10. Multiple Device Configurations User Interface Development - “Flash Lite vs. JavaME”, Bologna 29-01-2007 - http://www.jmdf.org
  11. 11. Optimize The Application For Different Devices - Resource Locations • Handling Project Resources – Use Different Resource Locations and match the resources to the configurations in Libraries & Resource panel /res/small/splashScreen.png /res/medium/splashScreen.png /res/large/splashScreen.png Image splashScreen = Image.createImage("splashScreen.png"); – Using Configuration-Specific Code Blocks and Abilities User Interface Development - “Flash Lite vs. JavaME”, Bologna 29-01-2007 - http://www.jmdf.org
  12. 12. Defining and Using Preprocessor Directives • Using Preprocessor Directives • Directive Syntax and Functions – Identifiers – Variables – Operators – Expressions • Compilation Based on Device Platform Versioning User Interface Development - “Flash Lite vs. JavaME”, Bologna 29-01-2007 - http://www.jmdf.org
  13. 13. Optimize The Application For Different Devices - Preprocessor • Using the Preprocessor – CPP-like syntax – Example: //#if mmedia //#if nokia //#if s60_ver=="1.0" import com.nokia.mmapi.v1 //#elif s60_ver=="2.0" import com.nokia.mmapi.v2 //#else import com.nokia.mmapi.def //#endif //#else import javax.microedition.mmapi //#endif //#endif User Interface Development - “Flash Lite vs. JavaME”, Bologna 29-01-2007 - http://www.jmdf.org
  14. 14. Optimize The Application For Different Devices - Preprocessor User Interface Development - “Flash Lite vs. JavaME”, Bologna 29-01-2007 - http://www.jmdf.org
  15. 15. Abilities User Interface Development - “Flash Lite vs. JavaME”, Bologna 29-01-2007 - http://www.jmdf.org
  16. 16. Optimize The Application For Different Users - Localization • Using the Localization Support Class LocalizationSupport.getMessage("PROPERTY_NAME") • The message.properties file PROPERTY_NAME=My Translatable Text String • This technique uses the microedition.locale property of the phone to determine which version of the message.properties file should be used • You can force a particular region to be used LocalizationSupport.initLocalizationSupport("en_US") User Interface Development - “Flash Lite vs. JavaME”, Bologna 29-01-2007 - http://www.jmdf.org
  17. 17. Overview of Graphics APIs • LCDUI for MIDP • JSR 184 - Mobile 3D Graphics API for J2ME • JSR 226 - Scalable 2D Vector Graphics API for J2ME User Interface Development - “Flash Lite vs. JavaME”, Bologna 29-01-2007 - http://www.jmdf.org
  18. 18. LCDUI for MIDP - Canvas • Immediate mode API • All drawing done within a paint() callback • Can also draw to an off screen mutable image • Suited for event based interaction • High performance, low system overhead User Interface Development - “Flash Lite vs. JavaME”, Bologna 29-01-2007 - http://www.jmdf.org
  19. 19. LCDUI for MIDP - Game Canvas • Immediate mode synchronous drawing • Ideal for “platformer” games • Sprite and tiled background • Well suited for games • Only on MIDP 2.0 User Interface Development - “Flash Lite vs. JavaME”, Bologna 29-01-2007 - http://www.jmdf.org
  20. 20. JSR 184 - Mobile 3D Graphics API for J2ME • 3D retained mode and immediate mode API • Focus is retained mode (display list, scene graph) • Defines standard file format—m3g • Tools available to export graphics models in m3g format • Easier to develop using 3D authoring tools • Some animation support • HW acceleration likely to be through OpenGL User Interface Development - “Flash Lite vs. JavaME”, Bologna 29-01-2007 - http://www.jmdf.org
  21. 21. JSR 184 – Mobile 3-D Graphics API • Description: – Provide an efficient 3D Graphics API suitable for the J2ME platform, in particular CLDC/MIDP • Key Features: – Scene graph API (high-level) – Immediate API (low-level, subset of OpenGL) – Importer functions for textures, meshes, animations, and scene hierarchies – Tight integration with MIDP User Interface Development - “Flash Lite vs. JavaME”, Bologna 29-01-2007 - http://www.jmdf.org
  22. 22. JSR 184 – Mobile 3-D Graphics API • Dependencies: – CLDC 1.1 (requires floating point support) • Resources: – http://developer.sonyericsson.com/site/global/newsande vents/campaigns/java_3d/p_java3d.jsp User Interface Development - “Flash Lite vs. JavaME”, Bologna 29-01-2007 - http://www.jmdf.org
  23. 23. Scalable Vector Graphics ● W3C recommendation on vector graphics ● Scalable ● Animated ● Interactive ● Lossless ● Compact User Interface Development - “Flash Lite vs. JavaME”, Bologna 29-01-2007 - http://www.jmdf.org
  24. 24. JSR 226 • SVG provides functionality handsets need • JSR 226 brings scalability to Java ME apps • JSR 226 allows creation of programmable, dynamic SVG content – User interaction – Real time network data (traffic, weather) – Location-based information • JSR 226 unleashes the power of Java and SVG User Interface Development - “Flash Lite vs. JavaME”, Bologna 29-01-2007 - http://www.jmdf.org
  25. 25. JSR 226 Background and motivation • Increasing demand for mobile multimedia (vector graphics) applications • Mobile devices are diverse • Different screen sizes • Want to avoid re-authoring content • Use cases • Map visualization • Rich animations • Simple UI applications • Enterprise applications User Interface Development - “Flash Lite vs. JavaME”, Bologna 29-01-2007 - http://www.jmdf.org
  26. 26. Simple SVG Application - 1 import javax.microedition.lcdui.Canvas; import javax.microedition.lcdui.Graphics; import javax.microedition.m2g.*; class MapApplication extends Canvas { private ScalableImage myMap; private ScalableGraphics gc; public MapApplication(InputStream stream) { myMap = ScalableImage.createImage(stream, null); gc = ScalableGraphics.createInstance(); } public void paint(Graphics g) { gc.bindTarget(g); //Bind Target gc.render(0, 0, myMap); //Render SVG document gc.releaseTarget(); //Release target } } User Interface Development - “Flash Lite vs. JavaME”, Bologna 29-01-2007 - http://www.jmdf.org
  27. 27. Simple SVG Application - 2 // Create empty SVG Image, get root <svg> Element SVGImage myImage = SVGImage.createEmptyImage(); Document myDoc = myImage.getDocument(); SVGSVGElement root = (SVGSVGElement) myDoc.getDocumentElement(); // Create new SVGElement SVGElement myRect = myDoc.createElementNS(SVGNS, "rect"); // Set attributes and properties myRect.setId("button"); myRect.setFloatTrait("x", 30.0f); myRect.setFloatTrait("y", 50.0f); // Also width, height SVGRGBColor myColor = root.createSVGRGBColor(100, 0, 0); myRect.setRGBColorTrait("fill", myColor); // Append to document root.appendChild(myRect); User Interface Development - “Flash Lite vs. JavaME”, Bologna 29-01-2007 - http://www.jmdf.org
  28. 28. References • Netbeans: http://www.netbeans.org • Sony-Ericsson 3D: http://developer.sonyericsson.com/site/global/newsandevents/campai gns/java_3d/p_java3d.jsp • JSR 184: http://jcp.org/en/jsr/detail?id=184 • JSR 226: http://jcp.org/en/jsr/detail?id=226 User Interface Development - “Flash Lite vs. JavaME”, Bologna 29-01-2007 - http://www.jmdf.org
  29. 29. Java ME User Interface Development User Interface Development - “Flash Lite vs. JavaME”, Bologna 29-01-2007 - http://www.jmdf.org
  30. 30. Speaker Edoardo Schepis Java ME Tech Lead at Funambol JMDF Founder email: edoardo.schepis@funambol.com weblog: http://www.edschepis.net Java Mobile Developers Forum: http://www.jmdf.org User Interface Development - “Flash Lite vs. JavaME”, Bologna 29-01-2007 - http://www.jmdf.org

×