手把手教你用云服務(wù)構(gòu)建移動應(yīng)用
Tiggr是什么?
Tiggr是基于移動應(yīng)用程序的構(gòu)建器。它使你能夠構(gòu)建移動web和本地應(yīng)用程序。Tiggr使用PhoneGap庫可以得到一個本地應(yīng)用程序。 Tiggr移動應(yīng)用程序構(gòu)造器的優(yōu)點是不用下載、安裝、配置或者設(shè)置。在Tiggr中建立一個新的移動應(yīng)用程序使用的時間比傳統(tǒng)方法少。Tiggr在配置 項目的各種庫時為開發(fā)者節(jié)省了不少的時間。
用jQuery Mobile構(gòu)建移動界面
Tiggr使用jQuery Mobile組件:這是一個跨平臺和跨設(shè)備的移動組件。因為你已經(jīng)從屏幕截圖上看到,左側(cè)移動調(diào)色板含有所有組件,你可以非常容易的把它們拖到手機上。
你可以重新排列組件或者是設(shè)置屬性。強大的Grid組件可以簡化構(gòu)建復(fù)雜應(yīng)用程序的布局。一個應(yīng)用程序肯定會有很多界面。
添加HTML事件和行為
你可以在Tiggr中構(gòu)建真實的移動應(yīng)用。為了使它能夠構(gòu)建真實的移動應(yīng)用,我們需要能夠定義HTML事件,如點擊和值的變化,為事件添加一個調(diào)用 行為。這個行為可以導(dǎo)航到另一個界面、打開一個彈出窗口、設(shè)置JavaScript變量、或者是引用客戶的JavaScript。
看一下定義HTML事件:
引用客戶的JavaScript行為是一個強大的特性,因為它允許你在Tiggr初始化參數(shù)之外編寫你的應(yīng)用程序。你可以編寫并引用客戶的 JavaScript代碼,引用PhoneGap API訪問設(shè)備的特性,或者是導(dǎo)入其他第三方類庫,并在你的應(yīng)用程序中使用。例如,這里有一個使用PhoneGap API的例子,使手機震動2秒:
以下是引用片段:
- navigator.notification.vibrate(2000);
定義REST服務(wù)并在屏幕中使用
什么是沒有數(shù)據(jù)的應(yīng)用?你可以在Tiggr中定義并使用任何可用的REST服務(wù)。建立一個REST服務(wù)通常要設(shè)置服務(wù)的URL,然后定義服務(wù)的輸入 和輸出。例如,點擊URL,http://search.twitter.com/search.json?q=html5, 可以看到從Twitter的搜索REST服務(wù)的結(jié)果。在這個例子中,輸入是q,輸出是你在Web瀏覽器上看到的內(nèi)容。
指定REST服務(wù)的URL:
指定REST服務(wù)的輸入:
指定REST服務(wù)的輸出:
服務(wù)定義完之后,可以在屏幕中使用它,特殊的數(shù)據(jù)資源組件必須關(guān)聯(lián)屏幕。數(shù)據(jù)資源組件關(guān)聯(lián)完后(通過拖、拽到屏幕上),它用來指定界面輸入組件的映射,為服務(wù)提供輸入數(shù)據(jù)。當(dāng)服務(wù)執(zhí)行完后,數(shù)據(jù)資源用來指定結(jié)果的映射,并作為輸出返回的截面組件上。
測試應(yīng)用程序
這是Tiggr最具創(chuàng)新的特性之一。在應(yīng)用程序的開發(fā)期間,可以在瀏覽器和移動設(shè)置上測試它。啟動后,第一個組件出現(xiàn)在屏幕上,點擊測試按鈕,就會在默認(rèn)的瀏覽器上打開應(yīng)用程序。你就可以看到應(yīng)用程序的樣子了。
這是Tiggr中的測試窗口:
在桌面瀏覽器中測試肯定是很偉大的事情,但是,那不是應(yīng)用程序運行的地方,對嗎?你想在移動設(shè)備的瀏覽器上測試它。為了在移動設(shè)備上得到應(yīng)用程序,使應(yīng)用程序是公開的。這時,你會有一些選項:
◇ 發(fā)送應(yīng)用程序的URL到移動設(shè)備
◇ 掃描QA碼(用QA掃描儀)
◇ 在移動瀏覽器中輸入URL
下面是在桌面移動瀏覽器測試的結(jié)果:
測試本地應(yīng)用
你會認(rèn)為在web瀏覽器(桌面或移動)上測試一切都很好,但是,僅僅是構(gòu)建移動web應(yīng)用。我們怎樣能看到,使用PhoneGap API訪問設(shè)備時發(fā)生了什么呢?在web瀏覽器測試是不會顯示的。
Tiggr移動測試儀應(yīng)用(Android和iOS)旨在移動設(shè)備上簡化本地應(yīng)用的測試。在設(shè)備上安裝后,輸入Tiggr帳號,你的移動應(yīng)用程序會顯示出來。只需點擊一個應(yīng)用,本地的應(yīng)用程序就會啟動。
下面是Tiggr Mobile測試儀的結(jié)果:
這是一個很棒的測試本地應(yīng)用程序的方法。你不需要每次都安裝應(yīng)用程序,你需輕按,就可以得到最新的本地應(yīng)用程序的版本。
導(dǎo)出應(yīng)用程序
完成應(yīng)用后,你可以導(dǎo)出應(yīng)用為移動Web(HTML,、avaScript、CSS)或者是本地。本地選項,你可以把每一個Android或iOS 源碼和PhoneGap的配置導(dǎo)入到Eclipse項目。這可以讓你在Tiggr外繼續(xù)工作。Android選項,你可以生成發(fā)布包(.apk文件),并 可以發(fā)布到Android Market。
需要一個BlackBerry應(yīng)用?導(dǎo)出為HTML/JavaScript/CSS,使用honeGap Build,為BlackBerry或者其他PhoneGap支持的平臺,構(gòu)建一個本地應(yīng)用。
社交應(yīng)用程序的開發(fā)
在Tiggr中有內(nèi)置的社交的特性。不僅可以共享測試應(yīng)用的鏈接,還可以邀請與你工作和協(xié)作的人。用戶可以同一時間或不同時間工作在應(yīng)用程序上。也有內(nèi)置的聊天特性?;旧?,你可以得到Google Docs的移動原型?,F(xiàn)在看來,這是很酷的事情。