Date post: | 24-Jan-2015 |
Category: |
Technology |
Upload: | betabeers |
View: | 886 times |
Download: | 1 times |
PhoneGap & jQueryMobile
A brief introduction by Binibook
Binibook Intro
What is Binibook?
● Binibook brings the YouTube concept to text
○ Anyone can publish books, poems, short stories... easily!
○ Anyone can read the texts through the platform.
The Binibook Platform
The Website
○ To publish, discover, read and share.
binibook.com
The Binibook Platform
Coming...
The Mobile Applications
○ To discover, read and share everything.
Binibook: Price by Popularity
Binibook offers to writers 3 payment methods for their publications:
● Always free● Payment (from € 0.99 to € 6.99)● Price by popularity
Writers can choose it freely. The 95% of publications have "Price computed by
popularity".
PhoneGap & jQueryMobile
PhoneGap: Intro
PhoneGap: Featured Apps
What does PhoneGap?
● Mobile platform abstraction
● Code unification: HTML5, CSS & JS● Mapping of
native functionalities (camera, files, geolocation, etc.)
PhoneGap: Supported Features
PhoneGap: Example
Take a photo and retrieve the image:
PhoneGap: Based On...
All mobile platforms has a native webview control.
For example, in Android, you can load a web page into your app doing:
PhoneGap: Based On...
Keypoint: the webview javascript interface.
The webview control offers access to native functionalities using the javascript interface.
webview.addJavascriptInterface( MyJSInterface, "MyJSInterface" );
public class MyJSInterface {
private WebView mAppView;public MyJSInterface (WebView appView) { this.mAppView = appView; }
public void doEchoTest(String echo) { Toast toast = Toast.makeText(mAppView.getContext(), echo, Toast.LENGTH_SHORT); toast.show(); }}
Android.doEchoTest('Holaaa');
JAVA
JAVASCRIPT
PhoneGap: Ugly Things
● No server-side process (PHP, JSP...)
○ Internationalization is difficult○ Database access○ Gallery access
● Solved by:○ Ajax calls to webservices. ○ HTML5 features: WebSQL, LocalStorage,
SessionStorage...
jQueryMobile: Intro
jQueryMobile: Featured Apps
What does jQueryMobile?
● Make a website looks like mobile app.● Offers a set of methods to make powerful apps.
jQueryMobile: Key Features
● Built on jQuery core.
● Compatible with all major mobile, tablet,
e-reader & desktop platforms.
● HTML5 Markup-driven configuration.
● Touch and mouse event support.
● Powerful Ajax-powered navigation
system.
jQueryMobile: Ajax Navigation
See a demo here
jQueryMobile: The Theme Roller
jQueryMobile has 4 default themes. You can create your own themes using:
See how it works here:http://jquerymobile.com/themeroller/
jQueryMobile: The Methods
jQueryMobile has powerful methods:● $.mobile.changePage()● $.mobile.showPageLoadingMsg()● $.mobile.silentScroll()
And events● Tap, taphold, swipe● Orientationchange● Page (load, beforeload, etc.)
That's all!
Some geek resources: