Android Bazaar and Conference 2011 Winter
•
32 likes•4,726 views
GREE developed mobile games using HTML5, JavaScript and Android. They used features like CSS3 animations, transforms and placeholders to build responsive UIs. They encountered issues on older Android versions with animated GIFs and Unicode characters which were addressed. Caching strategies like manifest files, application cache and web SQL databases were employed to improve performance.
![Selectors Level 3
• :last-child/:first-child
• :not(.loading)
• input[type='text']
• etc.](https://image.slidesharecdn.com/abc2011wku-san-110111005012-phpapp02/85/Android-Bazaar-and-Conference-2011-Winter-14-320.jpg)
Android Bazaar and Conference 2011 Winter
- 1. GREE HTML5+JavaScript & Android (@ku) http://t.gree.jp/ku0522
- 2. • GREE • HTML5 • • GREE Android • HTML
- 3. GREE • 2010/8/9 • ajax • iOS, android(xperia) • HTML5+CSS3+javascript • http://t.gree.jp/
- 4. ajax +
- 7. android,iOS webkit • ajax • HTML5 • CSS3, animation, transform
- 8. HTML Forms • placeholder • • • UI
- 9. placeholder <input placeholder=‘ ’ /> • • • android1.6 • iOS4.0 textarea
- 10. <input type=email /> • android •
- 12. • url • date • search UI
- 13. CSS3 • 3 • • • • device-pixel-ratio
- 14. Selectors Level 3 • :last-child/:first-child • :not(.loading) • input[type='text'] • etc.
- 16. -webkit-transition CSS • jQuery • fps • • height: auto → height: 0
- 18. transform3d • 3 • iPhone GPU Google Code Blog: CSS3 Transitions and Transforms in Gmail for the iPad http:// googlecode.blogspot.com/2010/08/css3-transitions-and-transforms-in.html
- 19. GIF Issue 3422 - android - Animated GIF not working in browser • canvas • js Issue 3422 - android - Animated GIF not working in browser http://code.google.com/p/android/issues/detail?id=3422
- 20. devicePixelRatio • devicePixelRatio=1.5 • 1 1.5 • •2 • <meta name=viewport target-densitydpi=device-dpi />
- 21. Android • • IS03
- 23. class GreeAppJs WebView WebView.addJavascriptInterface void uploadImageFile WebView.loadUrl('javascript:setMoodImage(b64Img)')
- 24. iOS • webView:shouldStartLoadWithRequest:navigationType: • stringByEvaluatingJavaScript: • HTML android iOS •
- 25. • HTML5 • • • android HTML
- 27. Issue 10059 - android - Browser does not render Unicode snowman character (U+2603) http://code.google.com/p/android/issues/detail?id=10059
- 28. Application cache • manifest (~10M) • ( ) •
- 29. Web SQL Database • SQLite • (~10M) • SQL • js HTML
- 30. Web Storage • Key Value Store • 5M~10M • cookie js • cookie