App.js实现使用js开发app的应用，此文是中文文档
在閱讀前，在此說明下，本人英文一直不好，所以該文檔是借助翻譯工具翻譯的，閱讀起來可能有點(diǎn)不好，請(qǐng)各位諒解，哪位大神有標(biāo)準(zhǔn)的中文文檔請(qǐng)分享下
?
Github下載地址：https://github.com/kikinteractive/app
?
App.js幫助文檔
目錄：
一、Pages
1、Controllers 控制器
? ? ?2、Page Arguments 參數(shù)
? ? ?3、Templating? 模板
? ? ?4、Events? 事件
? ? ?5、Navigation stack 導(dǎo)航
? ? ?6、Back stack 返回按鍵
? ? ?7、Pick a page 渲染頁面
? ? ?8、Transitions 切換模式
? ? ?9、Restore stack 恢復(fù)會(huì)話
? ? ?10、Stack manipulation 移除會(huì)話
二、UI Components
1、Topbar 頭部工具欄
? ? ?2、Content 內(nèi)容組件
? ? ?3、Buttons 按鈕
? ? ?4、Lists & scrolling 列表
? ? ?5、Infinite scroll 列表冬天加載
? ? ?6、Inputs 輸入框
? ? ?7、Sections 塊組件
? ? ?8、Dialogs 彈窗
?
? ? ?9、PhotoViewer? 圖片瀏覽
?
下面是App.js webpages的標(biāo)準(zhǔn)格式：
<!DOCTYPE html> <html><head><title>My App</title><meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no,minimal-ui"><link rel="stylesheet" href="//cdn.kik.com/app/3.0.0/app.min.css"><style>/* put your styles here */</style></head><body> <!-- （5）put your home pages start 編寫頁面--> <div class=”app-page” data-page=”home”></div> <!-- put your pages end --><script src="//zeptojs.com/zepto.min.js"></script><script src="//cdn.kik.com/app/3.0.0/app.min.js"></script><script>/* （6）put your javascript here */</script></body> </html>1、app.min.js是包含所有庫功能的核心模塊。
2、app.min.css是帶有App.js的默認(rèn)樣式表。它包含了所有包含小部件的ios/android樣式。
3、zepto.min.js是一個(gè)類似于jQuery-like的庫，專注于輕量級(jí)和移動(dòng)友好型。它不是對(duì)app.js的依賴，但仍然很好地編寫簡(jiǎn)潔的、
跨平臺(tái)的代碼。如果你愿意的話，用jQuery替換它。
4、meta viewport標(biāo)記只是確保在它運(yùn)行的任何設(shè)備上正確地大小窗口。這對(duì)于在不同的平臺(tái)上獲得一致的規(guī)模和規(guī)模是很重要的。
5、pages的注釋是HTML頁面元素的位置，如UI部分所描述的那樣。
6、javascript的注釋是控制器和導(dǎo)航代碼的位置。
7、styles是頁面的樣式。
?
由于App.js應(yīng)用程序本質(zhì)上是靜態(tài)的，你所要做的就是把你的代碼放到一個(gè)HTML文件中，（也就是說在手機(jī)上瀏覽的不同頁面其實(shí)是一個(gè)
html頁面的不同div對(duì)應(yīng)的page頁），然后在瀏覽器中打開它進(jìn)行測(cè)試。
?
一、Pages
App.js是為單個(gè)靜態(tài)頁的應(yīng)用提供服務(wù)的。這意味著它可以在網(wǎng)頁的會(huì)話中保持所有頁面導(dǎo)航，將“Page”定義為可以實(shí)例化的DOM節(jié)點(diǎn)。
page是具有某些通用組件的HTML元素，如topbar和內(nèi)容區(qū)。注意，雖然這些組件是完全可選的，但是“app-page”格式是HTML的唯一要求。
如下代碼：
<div class="app-page" data-page="home"><div class="app-topbar"></div><div class="app-content"></div> </div>“app-page”必須有一個(gè)“data-page”屬性，該屬性表示頁面的名稱。每當(dāng)任何JavaScript代碼試圖加載該頁面時(shí)，都會(huì)使用這個(gè)名稱。
如下加載頁面：
App.load('home');?
這一行JavaScript指示app.js加載名為“home”的頁面。在引擎蓋下，app.js用這個(gè)名字克隆HTML“app-page”元素，并使其對(duì)用戶可見。
通過這種方式，我們可以創(chuàng)建同一頁面的多個(gè)實(shí)例，并在不同的上下文中使用它。
?
1、Controllers
每當(dāng)使用“app.load”加載一個(gè)新頁面時(shí)，都會(huì)調(diào)用一個(gè)特殊的函數(shù)來準(zhǔn)備HTML頁面app-page元素。這允許您在向用戶
顯示頁面之前將頁面的任何動(dòng)態(tài)方面連接起來。例如，按鈕可以被綁定來執(zhí)行他們需要做的任何動(dòng)作。
/* in your javascript */ App.controller('home', function (page) {// this runs whenever a 'home' page is loaded// 'page' is the HTML app-page element $(page).find('.app-button').on('click', function () {console.log('button was clicked!');}); });
控制器也可以是一個(gè)JavaScript，這樣你就可以擁有從彼此繼承的控制器。如下
function HomeController(page) {// this runs whenever a 'home' page is loadedthis.foo = 'bar';this.print(); } HomeController.prototype.print = function () {console.log(this.foo); }; App.controller('home', HomeController);如果您已經(jīng)在HTML中描述了多個(gè)頁面，那么您將希望為每個(gè)頁面創(chuàng)建一個(gè)控制器，以便在加載時(shí)能夠正確地構(gòu)造它們。
?
2、Page Arguments
控制器可以有動(dòng)態(tài)參數(shù)，這樣您就可以根據(jù)輸入構(gòu)造一個(gè)稍微不同的頁面。例如，如果我正在創(chuàng)建一個(gè)聯(lián)系人列表應(yīng)用程序，
我將想要為我列表中的任何給定聯(lián)系人加載一個(gè)聯(lián)系人頁面。我們要做的是描述一個(gè)帶有空白字段的通用聯(lián)系人頁面，并根據(jù)頁面
的加載方式來填充它們。
要加載帶有特殊參數(shù)的頁面，只需在“app.load”調(diào)用中添加一個(gè)JSON對(duì)象，您就可以相應(yīng)地在populator中使用該對(duì)象。
如下:
<!-- in your html --> <div class="app-page" data-page="contact"><div class="app-topbar"><div class="app-title">Contact</div></div><div class="app-content"><div class="first-name"></div><div class="last-name"></div></div> </div> /* in your javascript */ App.controller('contact', function (page, contact) {$(page).find('.first-name').text(contact.firstName);$(page).find('.last-name' ).text(contact.lastName ); }); /* somewhere else in javascript */ var contact = { firstName : 'Bruce' , lastName : 'Lee' }; App.load('contact', contact);在上面的第二行代碼中，“聯(lián)系人”對(duì)象可以有任何一個(gè)姓氏和名稱，控制器將相應(yīng)地設(shè)置頁面。
這些類型的參數(shù)與Zepto或jQuery結(jié)合在一起，可以有效地讓您對(duì)HTML進(jìn)行模板。
?
3、Templating
模板HTML元素是一種非常常見的范例，雖然app.js在模板上沒有任何專門的特性，但它絕對(duì)不會(huì)妨礙它。一般來說，
你可以使用任何你想要的框架/庫，如果你想在沒有任何框架的情況下使用它，那么就會(huì)有一些模式讓它變得簡(jiǎn)單：
<!-- in your html --> <div class="app-page" data-page="contact"><div class="app-topbar"><div class="app-title">Contact</div></div><div class="app-content"><div class="contacts"><div class="contact"><div class="first-name"></div><div class="last-name"></div></div></div></div> </div> /* in your javascript */ App.controller('contact', function (page, contacts) {var $template = $(page).find('.contact').remove();var $contacts = $(page).find('.contacts');contacts.forEach(function (contact) {var $contact = $template.clone(true);$contact.find('.first-name').text(contact.firstName);$contact.find('.last-name' ).text(contact.lastName );$contacts.append($contact);}); });
4、Events
1、 appLayout：可能是最重要的事件，這是由方向改變、窗口大小調(diào)整、DOM中的頁面放置或任何可能使頁面布局無效的事件引起的。
綁定到這個(gè)事件，并在這里放置任何與布局相關(guān)的代碼。
2、 appShow：每當(dāng)用戶導(dǎo)航到這個(gè)頁面時(shí)就會(huì)被觸發(fā)。如果用戶導(dǎo)航到另一個(gè)頁面并最終返回，那么這個(gè)過程可能會(huì)多次觸發(fā)。
3、 appHide：當(dāng)用戶從這個(gè)頁面導(dǎo)航時(shí)，就會(huì)被觸發(fā)。請(qǐng)注意，這并不一定意味著頁面將被銷毀，例如，當(dāng)用戶導(dǎo)航到另一個(gè)頁面并可能返回時(shí)。
4、 appBack：當(dāng)用戶從這個(gè)頁面中向后導(dǎo)航時(shí)，就會(huì)被觸發(fā)。
5、 appBack：當(dāng)用戶從這個(gè)頁面中向后導(dǎo)航時(shí)，就會(huì)被觸發(fā)。
6、 appBeforeBack：當(dāng)用戶即將在堆棧中導(dǎo)航時(shí)，就會(huì)被觸發(fā)。這個(gè)導(dǎo)航可以通過在事件處理程序中返回false來取消（類似于窗口。onbeforeunload作品)。
7、 appReady：這實(shí)際上被稱為第一次在頁面上調(diào)用appShow。它在確保窗口方面有額外的好處。onload被調(diào)用，這使得它對(duì)于網(wǎng)絡(luò)綁定的初始化代碼非常有用。
8、 appDestroy：當(dāng)頁面的實(shí)例即將被完全銷毀時(shí)觸發(fā)。這通常發(fā)生在用戶完成從頁面向后導(dǎo)航時(shí)。
?
要處理這些事件，需要在控制器中綁定它們。
App.controller('home', function (page) {$(page).on('appShow', function () {console.log('the user can see it!');}); });
或者，所有事件都可以被綁定為控制器類的方法。
function HomeController(page) {// stuff } HomeController.prototype.onShow = function () {console.log('the user can see it'); }; App.controller('home', HomeController);?
在銷毀時(shí)，重要的是取消綁定到頁面范圍之外的事件，以允許JavaScript垃圾收集器完成其工作。
App.controller('home', function (page) {function doStuff() {// handle event }window.addEventListener('keypress', doStuff);$(page).on('appDestroy', function () {window.removeEventListener('keypress', doStuff);}); });
5、Navigation stack
正如前面所討論的，app.load對(duì)所選頁面進(jìn)行克隆，為其創(chuàng)建一個(gè)控制器，然后將其呈現(xiàn)給用戶。
App.load('home');
這可以在任何時(shí)候在代碼的任何地方調(diào)用。如果在一個(gè)正在進(jìn)行的過程中嘗試導(dǎo)航，那么導(dǎo)航將在當(dāng)前完成之后排隊(duì)執(zhí)行。
此外，當(dāng)導(dǎo)航完成時(shí)，可以提供一個(gè)回調(diào)來運(yùn)行。
如下：
App.load('home', function () {// done! });
因?yàn)榘粹o通常直接加載頁面，所以有一個(gè)特性允許這是一種快速、簡(jiǎn)潔的方式。
<!-- in your html --> <div class="app-button" data-target="page2">Go to page 2</div> <div class="app-button" data-target="contact" data-target-args='{"firstName":"Bruce","lastName":"Lee"}'>Open contact</div>當(dāng)?shù)谝粋€(gè)按鈕被單擊時(shí)，load（'page2'）將自動(dòng)被調(diào)用。第二個(gè)按鈕是類似的，但也提供了要傳遞的
頁面參數(shù)(app.load('contact'，firstName：'Bruce'，lastName：'Lee') )
?
6、Back stack
當(dāng)你從一個(gè)頁面切換到另一個(gè)頁面時(shí)，app.js將會(huì)有一段你曾經(jīng)擁有的頁面的歷史，能夠?qū)Ш降剿鼈儭?/span>
返回是應(yīng)用程序的概念上的反轉(zhuǎn)，加載在導(dǎo)航欄中返回到前一個(gè)頁面加載（當(dāng)導(dǎo)航完成時(shí)破壞當(dāng)前頁面）。
// load home // load page2 App.back(function () {// back to home// page2's appDestroy event has been called });如果沒有前頁導(dǎo)航回應(yīng)用，返回將返回false。
與數(shù)據(jù)目標(biāo)特性一樣，app.back有一個(gè)概念上的反向特性。
<!-- in your html --> <div class="app-button" data-back>Go back</div>
當(dāng)點(diǎn)擊上面的按鈕時(shí)，App.back() 將自動(dòng)被調(diào)用。
回到一個(gè)特定的頁面，而不是簡(jiǎn)單地返回一個(gè)頁面是很常見的。
// load home // load page2 // load page3 App.back('home', function () {// back to home// page2's and page3's appDestroy events have been called });后退按鈕的另一個(gè)常見的做法是根據(jù)前一頁命名它。App.js提供了一種方便，可以自動(dòng)地將后退按鈕命名為它將指向的頁面。
<div class="app-button" data-back="true" data-autotitle></div>?
7、Pick a page
頁面的一個(gè)常見用例是為用戶提供一種方法，讓用戶可以選擇在呼叫頁面上使用的內(nèi)容或數(shù)據(jù)。這可以通過以下方式完成：
App.controller('selector', function (page, request) {// 'request' is data from the requestor// respond to the caller// will implicitely call App.back and destroy the pagethis.reply({ some: 'data' }); }); App.pick('selector', { some: 'data' }, function (data) {// 'data' is the reply data// do something with it });
8、Transitions
App.js在默認(rèn)情況下會(huì)嘗試在頁面之間轉(zhuǎn)換，使用最適合你的應(yīng)用程序運(yùn)行的平臺(tái)。例如，在iOS上，
你的頁面標(biāo)題會(huì)隨著淡出而逐漸消失，模擬原生的iOS轉(zhuǎn)換風(fēng)格。
有許多在轉(zhuǎn)換中構(gòu)建的，每個(gè)對(duì)“app.load”的調(diào)用都可以指定直接使用哪個(gè)轉(zhuǎn)換（覆蓋默認(rèn)值）。
App.load('home', 'fade'); // fade between pages
轉(zhuǎn)換是由Swapper.js提供的。到文檔中查看可用的轉(zhuǎn)換列表。
此外，您還可以為所有導(dǎo)航設(shè)置全局缺省躍遷。
App.setDefaultTransition('transition-name'); // global// set per platform App.setDefaultTransition({ios : 'transition-name' , // iOSiosFallback : 'transition-name' , // iOS <5android : 'transition-name' , // AndroidandroidFallback : 'transition-name' , // Android < 4fallback : 'transition-name' // non-iOS, non-Android });
默認(rèn)的轉(zhuǎn)換也可以設(shè)置為每一頁。
App.controller('page2', function (page) {this.transition = 'fade'; });
9、Restore stack
因?yàn)?/span>app.js知道您的導(dǎo)航堆棧以及如何構(gòu)造頁面，所以它還提供了自動(dòng)恢復(fù)用戶會(huì)話的能力，
使其恢復(fù)到上次關(guān)閉時(shí)的位置。啟用這個(gè)特性需要以下的習(xí)語：
// in your apps main method try {// try to restore previous session App.restore(); } catch (err) {// else start from scratchApp.load('home'); }下面是一個(gè)例子，說明如果最后一個(gè)會(huì)話在最后5分鐘內(nèi)，如何只恢復(fù)堆棧。
try {App.restore({ maxAge: 5*60*1000 }); } catch (err) {App.load('home'); }注意：maxAge是以毫秒為間隔的。
?
單獨(dú)的頁面可以防止自己被恢復(fù)（例如，如果它們是模態(tài)的）。
App.controller('page2', function (page) {this.restorable = false; });?
page2和堆棧前面的任何頁面都不會(huì)恢復(fù)（但是以前的頁面將會(huì)）。
?
10、Stack manipulation
雖然通常是一種糟糕的實(shí)踐，但通常需要在沒有用戶交互的情況下操縱導(dǎo)航堆棧。
注意，在不調(diào)用App.back或app.load的情況下，刪除當(dāng)前可見的頁面是不可能的。
// stack = [home, page2, page3] App.removeFromStack(0,1); // remove home from stack // stack = [page2, page3] App.addToStack(1, ['home', 'page4']); // add two pages at index 1 // stack = [page2, home, page4, page3]?
?
二、UI Components
App.js頁面通常有一個(gè)topbar和內(nèi)容區(qū)域。topbar包含標(biāo)題和按鈕（用于導(dǎo)航和其他操作），而內(nèi)容則具有頁面的實(shí)際內(nèi)容。
<div class="app-page"><div class="app-topbar"></div><div class="app-content"></div> </div>?
App.js附帶了一些內(nèi)置的UI組件，并且已經(jīng)設(shè)計(jì)好了。幾乎所有這些都將在你的應(yīng)用程序中結(jié)束。
注意，擁有特定于平臺(tái)的樣式通常很方便。例如，在這個(gè)頁面頂部的演示中，topbar在iOS和Android上的風(fēng)格略有不同。
為了適應(yīng)這個(gè)應(yīng)用，app.js在文檔的主體上添加類，表示它正在運(yùn)行哪個(gè)平臺(tái)。使用這個(gè)類作為過濾選擇器可以讓您為單個(gè)小部件有單獨(dú)的樣式。
.my-widget {/* cross-platform styles */ } .app-ios .my-widget {/* ios only styles */ } .app-android .my-widget {/* android only styles */ }
1、Topbar
與許多原生移動(dòng)應(yīng)用一樣，App.js topbar通常由幾個(gè)按鈕和一個(gè)標(biāo)題組成。
<div class="app-topbar"><div class="app-title">Page title</div> </div> 或者： <div class="app-topbar"><div class="app-button left" data-back>Back</div><div class="app-title">Page title</div><div class="app-button right">Forward</div> </div>?
點(diǎn)擊按鈕部分，了解如何在你的topbar中添加按鈕。
?
2、Content
應(yīng)用程序內(nèi)容包含頁面的所有內(nèi)容，包括按鈕、列表和輸入。雖然這些小部件是有用的，但通常情況下，
應(yīng)用程序的自定義HTML結(jié)構(gòu)會(huì)在這里。
默認(rèn)情況下，它會(huì)自動(dòng)為它進(jìn)行滾動(dòng)管理。要關(guān)閉自動(dòng)滾動(dòng)，可以將屬性數(shù)據(jù)無滾動(dòng)條添加到內(nèi)容元素中。
?
<div class="app-content"></div>?
3、Buttons
按鈕是任何應(yīng)用程序和應(yīng)用程序的基本組件。App.js有幾個(gè)內(nèi)置的方便操作。任何帶有類app-button的元素都將自動(dòng)進(jìn)行相應(yīng)的樣式化，
并在按下適當(dāng)?shù)南聽顟B(tài)時(shí)對(duì)觸摸做出響應(yīng)。
<div class="app-button">My button</div>?
最常見的按鈕位置之一是topbar。
<div class="app-topbar"><div class="app-button left" data-back>Back</div><div class="app-title">Page title</div><div class="app-button right">Forward</div> </div>?
你可以想象，“后退”按鈕會(huì)出現(xiàn)在左邊和右邊的“轉(zhuǎn)發(fā)”按鈕上。您會(huì)注意到，樣式與內(nèi)容區(qū)域中的按鈕有很大的不同，
因?yàn)樵谶@個(gè)上下文中，我們希望一個(gè)更小的按鈕適合于導(dǎo)航，等等。
?
4、Lists & scrolling
列表對(duì)于顯示批量數(shù)據(jù)或提供一組可供選擇的選項(xiàng)非常有用。
?
<!-- in your app-content --> <ul class="app-list"><li>Item 1</li><li>Item 2</li><li>Item 3</li> </ul>?
另外，列表項(xiàng)可以是按鈕。
<ul class="app-list"><li class="app-button">Button item</li> </ul>?
列表通常有將項(xiàng)目劃分為邏輯部分的標(biāo)簽。
?
<ul class="app-list"><label>Animals</label><li>Dogs</li><li>Cats</li><label>Fruits</label><li>Apples</li><li>Oranges</li> </ul>?
?
5、Infinite scroll
列表經(jīng)常在用戶滾動(dòng)時(shí)創(chuàng)建動(dòng)態(tài)加載內(nèi)容的需求。App.js可以幫你處理這個(gè)問題。
App.infiniteScroll(listElement, function (next) {// dynamically fetch datavar list = [];// add html elements to list next(list); });?
請(qǐng)注意，listElement是將元素動(dòng)態(tài)插入到的HTML元素。
?
在等待動(dòng)態(tài)內(nèi)容加載時(shí)，有一個(gè)加載元素是一個(gè)常見的用例。
App.infiniteScroll(listElement, { loading: loadingElem }, function (next) {next([ stuff ]); });?
請(qǐng)注意，loadingElem將被克隆并在列表的底部使用，而內(nèi)容正在被獲取。
?
?
6、Inputs
App.js提供標(biāo)準(zhǔn)組件來收集用戶輸入，無論是HTML輸入還是文本區(qū)域，都可以很容易地構(gòu)造表單。
?
<!-- in your app-content --> <input class="app-input"> <input type="search" class="app-input"> <!-- will have search icon --> <textarea class="app-input"></textarea>?
?
7、Sections
“section”是app.js UI中的一個(gè)概念，它允許您將組件塊分割成方便的塊。
在你的應(yīng)用程序的內(nèi)容中試試這個(gè)：
<!-- in your app-content --> <div class="app-section"><input class="app-input" placeholder="Subject"><textarea class="app-input" placeholder="Message"></textarea><div class="app-button">Send</div> </div>?
你會(huì)注意到，上面描述的相同的輸入現(xiàn)在都在一個(gè)圓形的部分中。此外，該部分還有一個(gè)邊界，以及適當(dāng)?shù)倪吔纭?/span>
這些特性可以應(yīng)用于頁面內(nèi)容區(qū)域中所描述的任何小部件。
?
<ul class="app-list app-section"><li>Item 1</li><li>Item 2</li><li>Item 3</li> </ul> <div class="app-section"><div class="app-button">Send</div> </div> <div class="app-section"><input class="app-input"> </div>?
注意，您可以在一個(gè)小節(jié)中放置盡可能多的小部件，并且它們將被相應(yīng)地處理。
?
8、Dialogs
App.js對(duì)話框執(zhí)行與傳統(tǒng)模態(tài)對(duì)話框和動(dòng)作表單相似的任務(wù)。它們是可以將文本（或HTML元素）呈現(xiàn)給用戶的modals，
可以選擇關(guān)閉的按鈕。
App.dialog({title : 'Network Error',text : 'Looks like the connection is flaky. Try again in a bit'okButton : 'Try Again',cancelButton : 'Cancel' }, function (tryAgain) {if (tryAgain) {// try again } });
這里dialog只展示了文本，有時(shí)我們希望dialog展示的是表單或者是其他組件元素，這是就需要用的rawHTML屬性，
這個(gè)屬性值是一個(gè)元素對(duì)象，而不是字符串
//獲取login的元素var loginForm = $(page).find(‘.login’)[0]; App.dialog({title : 'Network Error',rawHTML : loginForm，okButton : 'Try Again',cancelButton : 'Cancel' }, function (tryAgain) {if (tryAgain) {// try again } });?
9、PhotoViewer
PhotoViewer.js?是為App.js提供的可定制的照片庫，這對(duì)于設(shè)置來說是微不足道的。它是一種帶有滑動(dòng)手勢(shì)、縮放和放大功能的原生感覺。
? ? ? ? ? ? ? ?
<!-- in your html --> <script src="http://cdn.kik.com/photo-viewer/1/photo-viewer.js"></script><div class="app-page dark-page" data-page="viewer"><div class="app-topbar"><div class="left app-button" data-back data-autotitle></div><div class="app-title">Viewer</div></div><div class="app-content"></div> </div> // in your js App.controller('viewer', function (page, data) {var photoViewer = new PhotoViewer(page, data.urls); }); // to use the viewer App.load('viewer', {urls: ['http://i.imgur.com/yDK68Ff.jpg','http://i.imgur.com/rKIESYd.jpg','http://i.imgur.com/OTaodxO.jpg'] });請(qǐng)閱讀PhotoViewer文檔，了解更多選項(xiàng)和定制。
?
?Github下載地址：https://github.com/kikinteractive/app
?
轉(zhuǎn)載于:https://www.cnblogs.com/wind-wang/p/9696196.html
總結(jié)
以上是生活随笔為你收集整理的App.js实现使用js开发app的应用，此文是中文文档的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： Actionbarsherlock De
- 下一篇： 如叶梦想！