HTML5 & CSS3 "Mobile": PhoneGap

  • 945 views
Uploaded on

Catania GTUG - Bootcamp pre-startup weekend. …

Catania GTUG - Bootcamp pre-startup weekend.
Andrea Cannella's Presentation

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
    Be the first to like this
No Downloads

Views

Total Views
945
On Slideshare
0
From Embeds
0
Number of Embeds
1

Actions

Shares
Downloads
0
Comments
0
Likes
0

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n

Transcript

  • 1. HTML5&CSS3 “Mobile”: PhoneGap Catania, 19 Maggio 2012 GTUG BootCamp pre Startup Weekend
  • 2. Mercato Mobile2011 Vendite Smartphone 480.000 unità Vendite PC 410.000 unità
  • 3. Previsioni2013 Rapporto 2 a 1 tra dispositivi mobile e PC.
  • 4. Tempo 32%32% Telefonia 47%9% Posta Elettronica 9% 12%12% Navigazione Web47% Applicazioni (Social Network,mappe, ecc) Telefonia Email Web App
  • 5. Stats Browser OS01/2011 8% 1% 9% 2% 5% 5% 31% 52% 28% 46% 9% 1% 1%4% Win7 Vista Win2003 WinXP Linux Mobile Mac 04/2012
  • 6. Stats Browser Mobile 13% 17% iPhone iPad iPod Android 31% Others 37% 3%
  • 7. Android Versions
  • 8. PhoneGap
  • 9. Esempio webapp con WebView() package web.app; import android.app.Activity; import android.webkit.WebView; import android.webkit.WebViewClient; import android.os.Bundle; public class WebAppActivity extends Activity { /** Called when the activity is first created. */ WebView myWebView; public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); WebView myWebView = (WebView) findViewById(R.id.webview); myWebView.getSettings().setJavaScriptEnabled(true); myWebView.setWebViewClient(new WebViewClient()); myWebView.loadUrl("http://www.blogf1.it"); } }
  • 10. Esempio con PhoneGap package blogF1; import org.apache.cordova.*; import android.os.Bundle; public class itAppActivity extends DroidGap { /** Called when the activity is first created. */ @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); super.loadUrl("file:///android_asset/www/index.html"); } }
  • 11. API Native (alcune)AccelerometroCameraConnessioniContattiNotifiche
  • 12. Pubblicazione Get cross-platform mobile apps in three easy steps1.Write your app using HTML, CSS and JavaScript2.Upload it to the PhoneGap Build service3.Get back app-store ready apps for Apple iOS, Google Android, Windows Phone 7, Palm, Symbian, Blackberry and more.
  • 13. PhoneGap Build Center
  • 14. JQueryMobile
  • 15. ConclusioniIl mondo mobile è in continuaespansione e da oggi spazio a nuovefigure professionali.I webdesigner di ieri devono oggiscontrarsi con i dispositivi mobile.Applicazione Nativa vs WebApp?