Phone gap & jquerymobile
Upcoming SlideShare
Loading in...5
×
 

Phone gap & jquerymobile

on

  • 1,384 views

Phonegap y desarrollo en JQuery Mobile por @binibook en el primer Betabeers Mallorca

Phonegap y desarrollo en JQuery Mobile por @binibook en el primer Betabeers Mallorca

Statistics

Views

Total Views
1,384
Slideshare-icon Views on SlideShare
1,303
Embed Views
81

Actions

Likes
0
Downloads
8
Comments
0

2 Embeds 81

http://betabeers.com 78
https://twitter.com 3

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Phone gap & jquerymobile Phone gap & jquerymobile Presentation Transcript

    • Gap & jQu eryMobilePhone ookA brief introduction by Binib
    • Bin ibook 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.
    • T he Biniboo k PlatformThe Website ○ To publish, discover, read and share. binibook.com
    • T he Biniboo k PlatformThe Mobile Applications ○ To discover, read and share everything. Coming...
    • ok: Price by Popularity BiniboBinibook offers to writers 3 payment methodsfor 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".
    • neGap & jQ ueryMobileP ho
    • PhoneGap: Intro
    • neGap: Fea tured AppsPho
    • W hat does P honeGap?● Mobile platform abstraction● Code unification: HTML5, CSS & JS● Mapping of native functionalitie s (camera, files, geolocation, etc.)
    • p: Supporte d FeaturesPhoneGa
    • PhoneGap: ExampleTake a photo and retrieve theimage:
    • P honeGap: Based On...All mobile platforms has a native webviewcontrol.For example, in Android, you can load a web page intoyour app doing:
    • P honeGap: 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; Android.doEchoTest(Holaaa);public MyJSInterface (WebView appView) { this.mAppView = appView; } JAVASCRIPT public void doEchoTest( String echo) { Toast toast = Toast.makeText(mAppView.getContext(),echo, Toast.LENGTH_SHORT); toast.show(); }} JAVA
    • P honeGap: 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...
    • jQueryMo bile: Intro
    • ry Mobile: Fe atured AppsjQue
    • at does jQu eryMobile? Wh● Make a website looks like mobile app.● Offers a set of methods to make powerful apps.
    • ry Mobile: Ke y Features jQue● 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.
    • bile: Ajax N avigation jQueryMoSee a demo here
    • il e: The The me Roller j QueryMobjQueryMobile has 4 default themes. You cancreate your own themes using: See how it works here: http://jquerymobile.com/themeroller/
    • ry Mobile: Th e Methods jQuejQueryMobile has powerful methods:● $.mobile.changePage()● $.mobile.showPageLoadingMsg()● $.mobile.silentScroll()And events● Tap, taphold, swipe● Orientationchange● Page (load, beforeload, etc.)
    • T hats all!Some geek resources: