1. Java Mobile Apps with GWT & PhoneGap Josh Marinacci, webOS Developer Advocate

2. overview the problem what are gwt & phone gap building an app device apis fun stuff!

3. josh: java ninja

4. Open Source Project Founder

7. Swing, JavaFX, JavaStore

11. JavaScript

14. the problem no Java on iOS, webOS, PlayBook OS and others we want to code in Java we want to use web technologies

15. the solution GWT cross compiler PhoneGap build scripts Open source API bindings

16. what is GWT? Google Web Toolkit compiler: Java to JavaScript UI Toolkit & JavaSE APIs optimized by smart Googlers works on any WebKit!

17. How GWT works write Java code against GWT APIs debug with your Java IDE compile to optimized JavaScript run in any browser client and server side code

18. First GWT App download: code.google.com/webtoolkit/ work through online tutorial mobilize

19. generate new project webAppCreator -out MyApp com.myco.MyApp

20. localhost:gwt-2.0.4 joshmarinacci$./webAppCreator -out MyApp com.joshondesign.myapp.MyAppNot creating tests because - junit argument was not specified.Created directory MyApp/srcCreated directory MyApp/warCreated directory MyApp/war/WEB- INFCreated directory MyApp/war/WEB-INF/libCreated directory MyApp/src/com/joshondesign/myappCreated directory MyApp/src/com/joshondesign/myapp/clientCreated directory MyApp/src/com/joshondesign/myapp/serverCreated directory MyApp/src/com/joshondesign/myapp/sharedCreated directory MyApp/test/com/joshondesign/myappCreated directory MyApp/test/com/joshondesign/myapp/clientCreated file MyApp/src/com/joshondesign/myapp/MyApp.gwt.xmlCreated file MyApp/war/MyApp.htmlCreated file MyApp/war/MyApp.cssCreated file MyApp/war/WEB-INF/web.xmlCreated file MyApp/src/com/joshondesign/myapp/client/MyApp.javaCreated file MyApp/src/com/joshondesign/myapp/client/GreetingService.javaCreated file MyApp/src/com/joshondesign/myapp/client/GreetingServiceAsync.javaCreated file MyApp/src/com/joshondesign/myapp/server/GreetingServiceImpl.javaCreated file MyApp/src/com/joshondesign/myapp/shared/FieldVerifier.javaCreated file MyApp/build.xmlCreated file MyApp/README.txtCreated file MyApp/.projectCreated file MyApp/.classpathCreated file MyApp/MyApp.launchCreated file MyApp/war/WEB-INF/lib/gwt-servlet.jarlocalhost:gwt-2.0.4 joshmarinacci$web.xml

21. GWT App Structure client/ GUI code, define services & proxies server/ implement services shared/ common code

22. build run ant gwtc will compile your app to javascript generates permutations & war run in appserver

23. [demo]

24. Web Technology: Browser Page or App? Browser: always remote easy deployment 100% connection required App: always local loads faster, easy to launch have to submit to app catalog

25. What is PhoneGap? packages HTML into native apps iPhone -> generate ObjC wrapper -> app Android -> generate Java wrapper -> app webOS -> app

26. Build a Mobile App Turn the client code into an app Don’t use server code OR put server side code on a real server Generate native projects with Phone Gap Compile and submit for each platform

27. GWT + PhoneGap create phonegap dir copy phonegap-palm copy /war/myapp/ to framework/www/myapp/ copy /war/MyApp.html to framework/www/index.html package, install, and run webOS app repeat for other platforms

28. [demo]

29. Mobilize your App

30. Customizing for Mobile improve your UI design for tapping shrink everything with CSS support multiple resolutions hook into device APIs use HTML Canvas

31. UI Styling with CSS [example] [master detail app with transitions]

32. Device Sizes media-queries [show same app on phone and touchpad]

33. Device Access: Camera [example] [simple app to take a picture, show it, then upload it to twitpic]

34. HTML Canvas 2D drawing api in HTML direct GWT support good for games and graphics

35. Canvas [demo of doing some charts]

36. GWT Play [demo]

37. Tools code.google.com/p/gwt-mobile-webkit/ github.com/dennisjzh/GwtMobile- PhoneGap Chrome w/ Developer Tools

38. developer.palm.com 100% free: docs & forums tools & sdk app submission Use any tools or language you want!

39. Questions? josh.marinacci@palm.com JoshOnDesign.com @joshmarinacci Developer.Palm.Com Come by the HP Booth!