Embed Size (px)
Citation preview
MOBILE APPLICATION DEVELOPMENT
Curix InfoTech Pvt. Ltd.
From a Web Developer’s Perspective
Today’s Mobile Technology
Today’s Mobile Technology
High-speed Internet Edge/3G: 100 Kbps–1.5
Mbps Wifi: 10+ Mbps Significant processor
speeds Significant graphical
capabilities Touch interfaces
Web App vs. Native App
Web App vs. Native AppEasy to developDon’t require approvalMaintained centrallyNot on App StoreLimited to HTML/CSS/JavaScript capabilities
Better UI More powerful More control Access to GPU Costly to develop Requires approval
Web App vs. Native App
Mobile & Smartphone Style sheets • Viewport Definition • Optimized Graphics
…vs. Mobile Website
Technologies• Objective-C & Cocoa Touch (iPhone-only)• Java (Blackberry, Android, Symbian)• Palm Mojo [HTML5, JS, CSS + Dojo-based framework] (Palm-only)• Visual C#/Visual Basic/.NET (Windows Mobile-only)• C++ (Symbian, Windows Mobile)• HTML5, JavaScript and CSS• PhoneGap• Titanium Mobile• RhomobileCross-platform w/ single API
HTML5, JavaScript & CSSThe basics
CSS2“Handheld” Media Stylesheets
CSS3 Media Queries Apple* Viewport
Advanced • HTML5 Offline Caching • HTML5 SQLite-compatible Offline
Storage • CSS3 CSS Animations • W3C API Geo location • HTML5 Canvas
HTML5, JavaScript & CSS
Mobile JS/CSS Frameworks
jQTouchjQuery plugin for iPhone UIhttp://www.jqtouch.com/SafireiPhone UI clonehttp://code.google.com/p/safire/iWebKitExtensive iPhone UI clonehttp://iwebkit.net/WebApp.NetiPhone UI clone + frameworkhttp://webapp-net.com/DashcodeApple’s Dashboard Toolkithttp://bit.ly/7sntmM
IUI(Older) iPhone UI clonehttp://code.google.com/p/iui/XUIMobile-focused frameworkhttp://xuijs.com/CiUICNET’s iPhone UI clonehttp://bit.ly/5p4tMYUiUIKitCSS-only iPhone UI clonehttp://bit.ly/7QtnhxMagic FrameworkiPhone UI clonehttp://bit.ly/6zJ4eK
PhoneGapPhoneGap
WebKit-wrapper application Consistent APIs for device
functions Geolocation Vibration Accelerometer Etc Supports many devices
PhoneGap Device Support
Titanium MobileTitanium Mobile
Accelerometer Database File system Geolocation Mapping Media Networking
+Native UI
Components
Titanium 0.9/1.0 iPad & Blackberry
support Less reliance on web views (slow) Dynamic APIs More extensible 5x+ performance increases
New APIs Animation Streaming Audio Proximity Sensor Low-level Graphics Network Streaming
PhoneGap vs. Titanium Easier to
start Supports
more Platforms
Mobile & desktop
Native UI Poor
documentationBoth fully open source!
PhoneGap vs. Titanium
PhoneGap vs. Titanium
Objective-C/Cocoa Touch 100% Native Application
Full native performance Access to entire iPhone SDK & UI
Components Interface Builder iPhone/iPad-only Mac development-only*
* No matter what you need a Mac to compile for iPhone
DEMOHTML5 Offline Caching
HTML5 Offline Caching
Mobile StylesheetsTo account for Windows Mobile, conditional
comments are required (not shown).
Mobile StylesheetsTo account for Windows Mobile, conditional
comments are required (not shown).
Mobile StylesheetsTo account for Windows Mobile, conditional
comments are required (not shown).
Mobile StylesheetsTo account for Windows Mobile, conditional
comments are required (not shown).
Viewport Scaling
Width Height initial-scale minimum-scale maximum-scale user-scalable
Tip:When setting the width/heightyou can use “device-width” and“device-height” to match thesize of the user’s device.
HTML5 SQLite Storage
CSS3 Transitions Properties: none, all, <property> Timing: ease, ease-in, ease-out, ease-in-out, cubic-bezier(x1, y1, x2, y2)
Geolocation API
Geolocation API
Geolocation API
Geolocation API
Geolocation API
Phone-Specific Tags apple-mobile-web-app-capable (yes/no) apple-mobile-web-app-status-bar-style
(default,black, black-translucent)
format-detection (telephone=no)
Philly New Media Hub Mobile
IUI Code Example
IUI Code Example
IUI Code Example
IUI Code Example
G-19, Sec – 63 Noida-201301
Curix InfoTech Pvt. Ltd.
Sandeep Verma (Director)Curix InfoTech Pvt. Ltd.Ph:0120-4331955 Web: http://www.curixinfotech.comEmail: [email protected]
