web開發者如何開發手機應用?袁錫

新浪移動云為什么要學習移動開發?世界都在移動化設備在移動開發商布局在移動化用戶需求也在移動化利用移動設備訪問的時間超過PC移動互聯網一定是必然趨勢如何開發手機應用?whatmakesaniphoneapp？常規方法特定語言針對于的某個平臺開發的應程序NativeappObjective-CipaiosappJavaandroidFrameworksapkandroidappC#WPFrameworksxapwpappiosFrameworksIphoneSymbianWindowsMobileJavaMeC++.NetCompactBlackBerryCPalmAndroidipadWebOSappleappstoreNokiastoreAndroidplayC#S60object-cXcodeEclipseS40其他平臺iosAppandroidappwpappGenericcode新方法iosAppandroidappwpappHTML5+CSS+JSweb語言技術基于瀏覽器開發跨平臺的應用WebappNativeappVS.Webapp本地能力成本高低依賴性基于平臺瀏覽器性能高低發布更新build打包云端???Hybridapphybridapppackagesawebappintoanativeapp吸引者>15,000+hybirdappintheAppStoreBridgingthegapbetweenwebandmobiledevicewebappHTML5CSSJavaScriptAndroidNativeAPIsSymbianiosblackBerrywebosetc...phoneGap使用HTML5、CSS3、JavaScript技術構建跨平臺APPphoneGap跨平臺能夠訪問本地功能攝像頭重力感應GPS電話本照片庫本地通知設備信息phoneGap本地功能jsjsjsjsjsjsjs通過

phoneGapbuildingphoneGap打包不提供UI設計解決方案不具備服務端不支持設備調試

打包付費不幫助開發者銷售推廣未知新浪移動云計算開發平臺簡單快速低成本產生Hybridapp流水線...組成與特點永遠免費低門檻高效率提供運營支持除了本地接口調用以外的支持應用商店云窗調試器為開發者提供最大的支持與幫助創建調試打包機打包跨平臺發布創建應用代碼模版服務端數據庫RestAPIOAuth認證phonegap-plugins調試工具能夠直觀的查看界面效果和實際運行環境，并且可以調用手機本地功能云端調試實時查看一鍵安裝在線跟蹤智能菜單自動獲取應用打包將webapp變成Hybirdapp打包成安裝文件可以發布到

應用商店新浪移動云計算開發平臺原理client調試器ServerSAE訪問復制打包機clientapkipa打包...hybrid基于新浪移動云

開發移動應用新浪移動云劉蕾@草丁2012.05.1229默認模版默認模版+服務器端Tab應用模版Tab應用+服務器模版社交應用模版微博模版……不使用模版創建應用SAESVN+IDEPhoneGap??Coding云窗調試器各種瀏覽器模擬器/真實設備：安裝包??移動端調試apk文件[android平臺]ipa文件[iOS平臺]??打包推廣WhateverUWant應用模版提供了哪些方便？怎么去調試、測試打包效果？打包選項設置怎么調用本地設備接口？301、應用模版提供了哪些方便？2、怎么通過JS調用本地設備接口？3、移動端調試4、打包選項設置DEMO311、應用模版提供了哪些方便？32MobileBoilerplate/mobile針對移動Web優化的HTML5空白模版1、應用模版提供了哪些方便？33LazyMobile模版/p/lazymobile/基于Tab/List頁的移動應用模版1、應用模版提供了哪些方便？34LazyRest/lazyrest/可以通過Web頁面快速配置的RestServerLazyMobile模版/p/lazymobile/基于Tab/List頁的移動應用模版1、應用模版提供了哪些方便？3536oPath社交模版/p/o-path//2011/12/30/how-to-build-a-path-like-app-using-html5-and-phonegap/HTML5+PhoneGap社交應用1、應用模版提供了哪些方便？37簡微——微博模版/2012/04/18/build-a-weibo-client-using-phonegap/HTML5+SAE移動云PhoneGap插件

1、應用模版提供了哪些方便？38PhoneGap（Cordova）2、怎么通過JS調設備本地接口？39NativeAPIUIWebView|JavaScriptPhoneGapframeworkphonegap.jsNativeAPIPhoneGapframeworkWebView|JavaScriptHTML|JavaScript?2、怎么通過JS調設備本地接口？402、怎么通過JS調設備本地接口？<phonegap></phonegap>注入phonegap.jsphonegap標簽是否存在將對應平臺的phonegap.js置入源文件中phonegap標簽是否存在YESYES云窗調試器打包文件HTML文件NONO41PhoneGapAPI文檔:/?page_id=402PhoneGap源碼:/repos/asf移動云插件API文檔：/?m=devcenter&catId=252Accelerometer三軸加速Camera相機/相冊Capture音視頻采集Compass指南針Connection網絡連接狀態Contacts通訊錄Device設備描述信息Events應用生命周期狀態File本地文件及目錄Geolocation地理位置Media錄制/回放音頻Notification本地通知StorageSQL數據庫……Weibo微博ImageFilter圖像濾鏡*2、怎么通過JS調設備本地接口？IFTRecognizer訊飛語音識別*42functiononSuccess(contacts){ alert(’共搜到‘+contacts.length+’

位聯系人.');}functiononError(message){ alert('onError:’+message);}varoptions=newContactFindOptions();options.filter="張";varfields=[”name",”phoneNumbers”,”emails”];navigator.service.contacts.find(fields,onSuccess,onError,options);Contacts獲取通訊錄2、怎么通過JS調設備本地接口？43UI布局調試本地設備接口測試云端實時調試打包后一鍵安裝測試3、移動端調試44Android平臺iOS平臺圖標32x32,48x48,72x7257x57,114x114分辨率(啟動畫面)240x320,320x480,480x800320