移動開發(fā)app技術(shù)ppt演示課件

1、移動開發(fā)APP技術(shù)及微信小程序,,1,,三大移動操作平臺,2,,三大平臺對比,3,,移動開發(fā)技術(shù),原生開發(fā)技術(shù)（Native app）網(wǎng)頁開發(fā)技術(shù)（Web app）混合開發(fā)技術(shù)（Hybrid app）,4,,Native app,是某一個移動平臺所特有的，使用相應(yīng)平臺支持的開發(fā)工具和語言（比如iOS平臺支持Xcode和Objective-C，安卓平臺支持Eclipse和Java）。有很強(qiáng)的交互，是一個完整的App，可拓展性強(qiáng)，需要

2、用戶下載安裝使用。模式通常是由“云服務(wù)器數(shù)據(jù)+APP應(yīng)用客戶端”兩部份構(gòu)成，APP應(yīng)用所有的UI元素、數(shù)據(jù)內(nèi)容、邏輯框架均安裝在手機(jī)終端上。原生應(yīng)用程序看起來（外觀）和運(yùn)行起來（性能）是最佳的。舉例：攝像頭，揚(yáng)聲器等,5,,原生開發(fā)優(yōu)點(diǎn),速度更快、性能穩(wěn)定、整體用戶體驗(yàn)不錯。訪問本地資源（通訊錄，相冊）可線下使用（因?yàn)槭窃诟鶺eb相對地平臺上使用的）。支持大量圖形和動畫，出色的動效比移動Web App運(yùn)行快容易發(fā)現(xiàn)（應(yīng)用

3、商店里面）和重新發(fā)現(xiàn)（應(yīng)用圖標(biāo)會一直在主頁上），對于蘋果而言，應(yīng)用下載能創(chuàng)造盈利官方賣場的應(yīng)用審核流程會保證讓用戶得到高質(zhì)量以及安全的App官方會發(fā)布很多開發(fā)工具或者人工支持來幫助你的開發(fā) 擁有系統(tǒng)級別的貼心通知或提醒,6,,原生開發(fā)缺點(diǎn),開發(fā)成本高，尤其是當(dāng)需要多種移動設(shè)備來測試時因?yàn)槭遣煌拈_發(fā)語言，所以開發(fā)，維護(hù)成本也高因?yàn)橛脩羰褂玫腁pp版本不同，維護(hù)起來很困難支持設(shè)備非常有限（一般是哪個系統(tǒng)就在哪個平臺專

4、屬設(shè)備上用）官方賣場審核流程復(fù)雜且慢，發(fā)布進(jìn)程受影響上線時間不確定（App Store審核過程不一）內(nèi)容限制（App Store限制）獲得新版本時需重新下載應(yīng)用更新（提示用戶下載跟新，用戶體驗(yàn)差）,7,,Web app,Web應(yīng)用本質(zhì)上是為移動瀏覽器設(shè)計(jì)的基于Web的應(yīng)用，它們是用普通Web開發(fā)語言（html,java,asp.net,php,JavaScript）開發(fā)的，可以在各種智能手機(jī)瀏覽器上運(yùn)行指采用html5語言寫出

5、的App，不需要下載安裝。依托于瀏覽器，基本上可以說是觸屏版的網(wǎng)頁應(yīng)用。HTML5應(yīng)用程序使用標(biāo)準(zhǔn)的Web技術(shù)，通常是HTML5、JavaScript和CSS。只需編寫一次、可到處運(yùn)行的移動開發(fā)方法構(gòu)建的跨平臺移動應(yīng)用程序可以在多個設(shè)備上運(yùn)行。,8,,Web APP,Web App開發(fā)即是一種框架型APP開發(fā)模式（html5 APP 框架開發(fā)模式），具有跨平臺的優(yōu)勢，通常由“HTML5云網(wǎng)站+APP應(yīng)用客戶端”兩部份構(gòu)成，

6、APP應(yīng)用客戶端只需安裝應(yīng)用的框架部份，而應(yīng)用的數(shù)據(jù)則是每次打開APP的時候，去云端取數(shù)據(jù)呈現(xiàn)給手機(jī)用戶。雖然開發(fā)人員單單使用HTML5和JavaScript就能構(gòu)建功能復(fù)雜的應(yīng)用程序，但仍然存在一些重大的局限性，具體包括會話管理、安全離線存儲以及訪問原生設(shè)備功能（攝像頭、日歷和地理位置等）。,9,,Web開發(fā)優(yōu)點(diǎn),跨平臺開發(fā)、用戶不需要去賣場來下載安裝App,開發(fā)速度快任何時候都可以發(fā)布App，因?yàn)楦静恍枰俜劫u場的審核，可即時

7、上線支持設(shè)備廣泛開發(fā)成本較低無內(nèi)容限制用戶可以直接使用最新版本（自動更新，不需用戶手動更新）頁面存放于web服務(wù)器（減少了內(nèi)存，但是會增加服務(wù)器的壓力）純H5 APP快速開發(fā)、低成本、多平臺，與很多APP開發(fā)方式不同的是-圖文混合的排版（正是這些復(fù)雜多變的CSS樣式消耗了性能，但是它帶來了排版的多樣性，能夠細(xì)致到每一個字寬行高和風(fēng)格的像素級處理）,10,,Web開發(fā)缺點(diǎn),只能使用有限的移動硬件設(shè)備功能,無法使用很多移動硬件設(shè)

8、備的獨(dú)特功能要同時支持多種移動設(shè)備的瀏覽器讓開發(fā)維護(hù)的成本也不低（也要適配不同的瀏覽器對于用戶來說，這種App很難被用戶發(fā)現(xiàn)這里的數(shù)據(jù)獲取都是在資源頁面上異步完成的，因?yàn)橹挥羞@樣才能讓這些資源頁面完成預(yù)加載或者渲染。（耗時）表現(xiàn)差（對聯(lián)網(wǎng)的要求比較大） 頁面跳轉(zhuǎn)更加費(fèi)力，不穩(wěn)定感更強(qiáng)，圖片和動畫支持性不高，交互動態(tài)效果受到限制，更小的頁面空間，用戶體驗(yàn)沒那么炫沒法在App Store中下載、無法通過應(yīng)用下載獲得盈利

9、機(jī)會，安全得不到保障無法體會包括會話管理、安全離線存儲以及訪問原生設(shè)備功能（攝像頭、日歷和地理位置等）,11,,Hybrid app,Hybrid APP指的是半原生半Web的混合類App。需要下載安裝，看上去類似Native App，但只有很少的UI Web View，訪問的內(nèi)容是 Web ?；旌蠎?yīng)用大家都知道是原生應(yīng)用和Web應(yīng)用的結(jié)合體，采用了原生應(yīng)用的一部分、Web應(yīng)用的一部分，所以必須在部分在設(shè)備上運(yùn)行、部分在Web上運(yùn)行

10、。不過混合應(yīng)用中比例很自由，比如Web 占90%，原生占10%；或者各占50%。有些應(yīng)用最開始就是包了個原生客戶端的殼，其實(shí)里面是HTML5的網(wǎng)頁，后來才推出真正的原生應(yīng)用。比較知名的APP，比如手機(jī)百度和淘寶客戶端 Android版，走的也是Hybrid App的路線，不過手機(jī)百度里面封裝的不是WebView，而是自己的瀏覽內(nèi)核，所以體驗(yàn)上更像客戶端，更高效。,12,,Hybrid 開發(fā)優(yōu)缺點(diǎn),Native架構(gòu)重（主流）優(yōu)點(diǎn)：交互

11、層的效率上由Native的東西解決了，而且架構(gòu)上基本就是在App內(nèi)寫網(wǎng)頁，App Store就是采用了該種方案；缺點(diǎn)：團(tuán)隊(duì)至少需要兩個工程師，一個是Web的，一個是iOS或者Android的。運(yùn)行效率，要權(quán)衡好多少界面采用Web來渲染，畢竟WebView的效率會相對降低。,13,,三種應(yīng)用比較,14,,教你一招,原生app,Web app,混合APP,15,,開發(fā)app流程,明確你的構(gòu)想和理念：誰用，做什么用，設(shè)計(jì)用戶界面：交互的地

12、方，簡結(jié)美觀，用戶體驗(yàn)定義交互方式：交互的啟用都是通過用戶操作的事件來觸發(fā)的，比如手指的點(diǎn)擊， 滑動，捏合等部署用戶行為：代碼來實(shí)現(xiàn)這些定義好的行為數(shù)據(jù)交互的部署：數(shù)據(jù)存儲問題，界面與數(shù)據(jù)之間必須要定義明確的交互方式測試，修改與發(fā)布,16,,17,,什么是微信小程序,簡稱小程序，是一種不需要下載安裝即可使用的應(yīng)用用戶掃一掃或者搜一下即可打開應(yīng)用。體現(xiàn)了“用完即走”的理念，用戶不用關(guān)心是否安裝太多應(yīng)用的問題。不同的小程序，可

13、以實(shí)現(xiàn)不同的功能不會推送信息騷擾你，只能用戶觸發(fā)。,18,,開發(fā)微信小程序的技術(shù),語言：JavaScript/WXML/WXSS工具：1.微信小程序官方開發(fā)工具-可以調(diào)試和預(yù)覽，手機(jī)預(yù)覽，代碼 提交審核 2. 即速應(yīng)用-可視化操作，直接拖拽組件生成頁面，電商模板居多 3.Subline Text3-代碼編輯器，簡結(jié)高效