鍍金池/ 教程/ Android/ 提供向下與橫向?qū)Ш?/span>
檢測常用的手勢
優(yōu)化layout的層級
用戶輸入
管理應(yīng)用的內(nèi)存
聯(lián)系人信息
開發(fā)輔助程序
Android多媒體
添加語音功能
顯示位置地址
提供向下與橫向?qū)Ш?/span>
支持游戲控制器
訪問可穿戴數(shù)據(jù)層
處理多點觸控手勢
全屏沉浸式應(yīng)用
為多線程創(chuàng)建管理器
數(shù)據(jù)保存
Intent的發(fā)送
更新Notification
優(yōu)化下載以高效地訪問網(wǎng)絡(luò)
打印
打包可穿戴應(yīng)用
接收從其他App傳送來的數(shù)據(jù)
發(fā)送與接收消息
建立靈活動態(tài)的UI
處理鍵盤輸入
Building a Work Policy Controller
建立測試環(huán)境
創(chuàng)建表盤
分享文件
顯示Notification進(jìn)度
實現(xiàn)自適應(yīng)UI流(Flows)
使用設(shè)備管理策略增強(qiáng)安全性
使用能感知版本的組件
執(zhí)行網(wǎng)絡(luò)操作
建立文件分享
添加移動
更新你的Security Provider來對抗SSL漏洞利用
支持鍵盤導(dǎo)航
創(chuàng)建和監(jiān)視地理圍欄
發(fā)送并同步數(shù)據(jù)
使用BigView樣式
無線連接設(shè)備
提供向上導(dǎo)航與歷史導(dǎo)航
最小化定期更新造成的影響
實現(xiàn)向下的導(dǎo)航
支持不同的屏幕大小
Android 可穿戴應(yīng)用
添加動畫
顯示聯(lián)系人頭像
使用OpenGL ES顯示圖像
處理輸入法可見性
分享文件
保持設(shè)備喚醒
淡化系統(tǒng)Bar
使用NFC分享文件
保存到Preference
Android聯(lián)系人信息與位置信息
創(chuàng)建標(biāo)準(zhǔn)的網(wǎng)絡(luò)請求
使用Drawables
管理Bitmap的內(nèi)存使用
管理Activity的生命周期
按需加載視圖
傳輸資源
為可穿戴設(shè)備創(chuàng)建自定義UI
在一個線程中執(zhí)行一段特定的代碼
性能優(yōu)化
隱藏導(dǎo)航欄
創(chuàng)建目錄瀏覽器
為多種大小的屏幕進(jìn)行規(guī)劃
View間漸變
使用觸摸手勢
高效加載大圖
使用CursorLoader在后臺加載數(shù)據(jù)
創(chuàng)建抽屜式導(dǎo)航(navigation drawer)
管理音頻焦點
創(chuàng)建后臺服務(wù)
創(chuàng)建功能測試
創(chuàng)建使用Material Design的應(yīng)用
停止與重啟Activity
添加一個簡便的分享功能
啟動Activity時保留導(dǎo)航
TV應(yīng)用清單
創(chuàng)建向后兼容的UI
?# 優(yōu)化自定義View
創(chuàng)建單元測試
在UI上顯示Bitmap
建立OpenGL ES的環(huán)境
構(gòu)建表盤服務(wù)
JNI Tips
建立搜索界面
實現(xiàn)自定義View的繪制
使用HTTPS與SSL
按需操控BroadcastReceiver
分享簡單的數(shù)據(jù)
繪制形狀
Android位置信息
創(chuàng)建并運(yùn)行可穿戴應(yīng)用
執(zhí)行 Sync Adpater
獲取最后可知位置
創(chuàng)建 Android 項目
實現(xiàn)高效的導(dǎo)航
退出全屏的Activity
創(chuàng)建Card
兼容音頻輸出設(shè)備
同步數(shù)據(jù)單元
傳輸數(shù)據(jù)時避免消耗大量電量
保存到文件
緩存Bitmap
提供配置 Activity
調(diào)度重復(fù)的鬧鐘
實現(xiàn)輔助功能
重復(fù)的下載是冗余的
隱藏狀態(tài)欄
實現(xiàn)自定義的網(wǎng)絡(luò)請求
規(guī)劃界面和他們之間的關(guān)系
使用Sync Adapter傳輸數(shù)據(jù)
TV應(yīng)用內(nèi)搜索
響應(yīng)觸摸事件
使用Google Cloud Messaging(已廢棄)
控制相機(jī)
Android網(wǎng)絡(luò)連接與云服務(wù)
請求分享一個文件
處理TV硬件
響應(yīng)UI可見性的變化
使用網(wǎng)絡(luò)服務(wù)發(fā)現(xiàn)
指定輸入法類型
優(yōu)化電池壽命
創(chuàng)建TV應(yīng)用
獲取聯(lián)系人列表
拖拽與縮放
啟動與停止線程池中的線程
創(chuàng)建 Sync Adpater
使用 WiFi P2P 服務(wù)發(fā)現(xiàn)
開始使用Material Design
代理至新的APIs
使用include標(biāo)簽重用layouts
使得View可交互
高效顯示Bitmap
創(chuàng)建企業(yè)級應(yīng)用
Fragments之間的交互
創(chuàng)建與執(zhí)行測試用例
綜合:設(shè)計我們的樣例 App
繪制表盤
建立簡單的用戶界面
自定義動畫
開發(fā)輔助服務(wù)
避免出現(xiàn)程序無響應(yīng)ANR(Keeping Your App Responsive)
使用ViewPager實現(xiàn)屏幕滑動
設(shè)計高效的導(dǎo)航
Android分享操作(Building Apps with Content Sharing)
提供向后的導(dǎo)航
保持向下兼容
創(chuàng)建TV播放應(yīng)用
縮放View
使用 WiFi 建立 P2P 連接
Android后臺任務(wù)
連接到網(wǎng)絡(luò)
為 Notification 添加頁面
使TV應(yīng)用是可被搜索的
添加Action Bar
使用Material的主題
啟動另一個Activity
顯示正在播放卡片
適配不同的系統(tǒng)版本
輕松錄制視頻
創(chuàng)建可穿戴的應(yīng)用
創(chuàng)建自定義的布局
重新創(chuàng)建Activity
使用CursorLoader執(zhí)行查詢?nèi)蝿?wù)
使用舊的APIs實現(xiàn)新API的效果
使用備份API
安全要點
Android入門基礎(chǔ):從這里開始
保存并搜索數(shù)據(jù)
根據(jù)網(wǎng)絡(luò)連接類型來調(diào)整下載模式
使用Tabs創(chuàng)建Swipe視圖
SMP(Symmetric Multi-Processor) Primer for Android
解析 XML 數(shù)據(jù)
使用 Volley 傳輸網(wǎng)絡(luò)數(shù)據(jù)
建立ActionBar
Android交互設(shè)計
使用Intent修改聯(lián)系人信息
增加搜索功能
輕松拍攝照片
定義形狀
測試你的Activity
在 Notifcation 中接收語音輸入
與其他應(yīng)用的交互
管理系統(tǒng)UI
追蹤手勢移動
Android界面設(shè)計
執(zhí)行 Android 程序
顯示確認(rèn)界面
創(chuàng)建Lists與Cards
打印HTML文檔
創(chuàng)建TV應(yīng)用
為多屏幕設(shè)計
定義Shadows與Clipping視圖
使用Fragment建立動態(tài)UI
接收Activity返回的結(jié)果
布局變更動畫
定位常見的問題
自定義ActionBar的風(fēng)格
定義Layouts
發(fā)送簡單的網(wǎng)絡(luò)請求
啟動與銷毀Activity
與UI線程通信
非UI線程處理Bitmap
創(chuàng)建TV布局
提升Layout的性能
報告任務(wù)執(zhí)行狀態(tài)
判斷并監(jiān)測網(wǎng)絡(luò)連接狀態(tài)
兼容不同的設(shè)備
處理按鍵動作
優(yōu)化性能和電池使用時間
給其他App發(fā)送簡單的數(shù)據(jù)
Implementing App Restrictions
向后臺服務(wù)發(fā)送任務(wù)請求
展示Card翻轉(zhuǎn)動畫
管理ViewGroup中的觸摸事件
兼容不同的屏幕密度
通過藍(lán)牙進(jìn)行調(diào)試
為可穿戴設(shè)備創(chuàng)建Notification
控制音量與音頻播放
獲取聯(lián)系人詳情
在表盤上顯示信息
提供向上的導(dǎo)航
滾動手勢動畫
幫助用戶在TV上找到內(nèi)容
創(chuàng)建TV導(dǎo)航
為索引指定App內(nèi)容
ActionBar的覆蓋疊加
Android Wear 上的位置檢測
保護(hù)安全與隱私的最佳策略
Ensuring Compatibility with Managed Profiles
解決云同步的保存沖突
獲取位置更新
創(chuàng)建List
測試程序
管理網(wǎng)絡(luò)的使用情況
為App內(nèi)容開啟深度鏈接
推薦TV內(nèi)容
建立一個Notification
管理音頻播放
設(shè)計表盤
拍照
處理控制器輸入動作
判斷并監(jiān)測設(shè)備的底座狀態(tài)與類型
處理查詢的結(jié)果
保存到數(shù)據(jù)庫
支持多個游戲控制器
創(chuàng)建 Stub Content Provider
使得ListView滑動順暢
處理數(shù)據(jù)層的事件
創(chuàng)建TV應(yīng)用的第一步
使得你的App內(nèi)容可被Google搜索
將 Notification 放成一疊
創(chuàng)建 Stub 授權(quán)器
暫停與恢復(fù)Activity
管理設(shè)備的喚醒狀態(tài)
Android圖像與動畫
打印照片
云同步
創(chuàng)建TV直播應(yīng)用
為Notification賦加可穿戴特性
提供一個Card視圖
建立請求隊列(RequestQueue)
適配不同的語言
創(chuàng)建詳情頁
測試UI組件
接收其他設(shè)備的文件
創(chuàng)建自定義View
建立第一個App
創(chuàng)建2D Picker
監(jiān)測電池的電量與充電狀態(tài)
打印自定義文檔
抽象出新的APIs
通知提示用戶
獲取文件信息
運(yùn)用投影與相機(jī)視角
在IntentService中執(zhí)行后臺任務(wù)
多線程操作
創(chuàng)建一個Fragment
添加Action按鈕
在不同的 Android 系統(tǒng)版本支持控制器
維護(hù)兼容性
發(fā)送文件給其他設(shè)備
創(chuàng)建TV游戲應(yīng)用
創(chuàng)建自定義的View類
代碼性能優(yōu)化建議
Intent過濾
適配不同的屏幕

提供向下與橫向?qū)Ш?/h1>

編寫:XizhiXu - 原文:http://developer.android.com/training/design-navigation/descendant-lateral.html

一種提供查看應(yīng)用整體界面結(jié)構(gòu)的方式就是顯示層級導(dǎo)航。這節(jié)課我們討論 向下導(dǎo)航,它允許用戶進(jìn)入子界面。我們還討論 橫向 導(dǎo)航,它允許用戶訪問同級界面。

http://wiki.jikexueyuan.com/project/android-training-geek/images/app-navigation-descendant-lateral-desc.png" alt="app-navigation-descendant-lateral-desc" />

Figure 1. 向下和橫向?qū)Ш?/p>

有兩種同級界面:容器關(guān)聯(lián)和區(qū)塊關(guān)聯(lián)界面。容器關(guān)聯(lián)(Collection-related) 界面展示由父界面放入同個容器里地那些條目。區(qū)塊關(guān)聯(lián)(Section-related) 界面展示父界面不同部分的信息,例如:一個部分可能展示某對象的文字信息,可是另一個部分則提供對象地理位置的地圖。一個父界面的區(qū)塊關(guān)聯(lián)界面數(shù)量通常較少。

http://wiki.jikexueyuan.com/project/android-training-geek/images/app-navigation-descendant-lateral-children.png" alt="app-navigation-descendant-lateral-children" />

Figure 2. 容器關(guān)聯(lián)子界面和區(qū)塊關(guān)聯(lián)子界面。

向下和橫向?qū)Ш娇捎肔ist(列表),Tab(標(biāo)簽)或者其他 UI 模式來實現(xiàn)。 UI 模式, 與軟件設(shè)計模式很類似,是重復(fù)交互設(shè)計問題的一般化解決方案。下幾章,我們將探究一些常用的橫向?qū)Ш侥J健?/p>

Button和簡單的控件

Button設(shè)計

設(shè)計指南請閱讀 Android 設(shè)計文檔的Button指導(dǎo)

對于區(qū)塊關(guān)聯(lián)的界面,最直接和熟悉的導(dǎo)航界面就是提供可觸或鍵盤可得焦點的控件。例如,Button,固定大小的 List View 或 文本鏈接,雖然后者不是一個觸屏導(dǎo)航的理想 UI 元素。一旦點選了這些控件,子界面被打開,完全替代當(dāng)前上下文環(huán)境(屏幕)。Button或其他簡單地控件很少被用來呈現(xiàn)容器中的項目。

http://wiki.jikexueyuan.com/project/android-training-geek/images/app-navigation-descendant-lateral-buttons.png" alt="app-navigation-descendant-lateral-buttons" />

Figure 3. Button導(dǎo)航模式例子和對應(yīng)界面圖。Dashboard 模式見下文。

Dashboard(操作面板)模式是一種一般以Button為主來獲取不同應(yīng)用劃分模塊的模式。一個dashboard就是個大圖標(biāo)Button表格,它表示了父界面絕大部分內(nèi)容。這個表格通常是2、3行或列,取決于 App 的頂層劃分。此模式展示全部區(qū)塊的視覺效果非常豐富。巨大的觸摸控件也讓 UI 特別好使。當(dāng)每個區(qū)塊都同等重要時,Dashboard模式最好用。然而,這個模式在大屏上效果不佳,他讓用戶直接獲取 App 內(nèi)容時多走了一步彎路。

還有更多套用了各種其他 UI 模式來提升內(nèi)容即得性和獨特的展示效果,但仍保持著直觀特點的高級 UI 模式。

Lists, Grids, Carousels, and Stacks

List 和 Grid List 設(shè)計

設(shè)計指南請閱讀 Android 設(shè)計文檔的ListsGrid Lists指導(dǎo)。

對于容器關(guān)聯(lián)的界面,特別是文字信息,垂直滑動列表通常是最直接最熟悉的做法。對于視覺更豐富的內(nèi)容(例如,圖片,視頻),可用垂直滑動的 Grid,水平滾動的 List(有時被叫做 Carousel),或 Stack(有時叫做卡片,Card)來代替。這些 UI 元素通常用在呈現(xiàn)容器內(nèi)的條目,或大量子界面最好,而不是零星的毫無關(guān)聯(lián)的同級子界面。

http://wiki.jikexueyuan.com/project/android-training-geek/images/app-navigation-descendant-lateral-lists.png" alt="app-navigation-descendant-lateral-lists" />

Figure 4. 控件例子和對應(yīng)界面圖

這個模式還有些問題。深層列表導(dǎo)航常常叫 drill-down(鉆井)列表導(dǎo)航,它的list層層嵌套。這種導(dǎo)航笨拙低效。獲得某塊內(nèi)容需要點擊多次,帶給用戶很差的體驗,特別是活躍用戶。

使用縱向list也可能帶來尷尬的用戶交互,并且如果list條目簡單地的拉伸話也可能用不好大屏空白。解決方法就是提供額外的信息,例如用文字匯總填充那些可用的水平空間。或者在左右添加個視窗。

Tabs(標(biāo)簽)

Tab 設(shè)計

設(shè)計指南請閱讀 Android 設(shè)計文檔的Tab指導(dǎo)

Tab是非常流行的橫向?qū)Ш健_@個模式允許組合同級界面,就是說tab可嵌入原本可能成為另一個界面的子界面內(nèi)容。Tab適合用在小量的區(qū)塊關(guān)聯(lián)界面。

http://wiki.jikexueyuan.com/project/android-training-geek/images/app-navigation-descendant-lateral-tabs.png" alt="app-navigation-descendant-lateral-tabs" />

Figure 5. 手機(jī)和平板導(dǎo)航例子和對應(yīng)界面圖

幾個使用Tab時的最佳做法。Tab在關(guān)聯(lián)界面種應(yīng)該一直存在,只有指定內(nèi)容區(qū)域發(fā)生改變,并且tab提示在任何時候都可用。此外,tab切換不能算作歷史。例如,如果用戶從 Tab A 切換到 Tab B,按 Back 按鈕(詳情看下節(jié))不該重選 Tab A。Tab通常水平排布,可是有時其他tab展現(xiàn)形式,例如Action bar(詳見Android 設(shè)計的模式章節(jié))的下拉菜單,也是可以的。最后,最重要的是,tab應(yīng)該在界面頂端和內(nèi)容對應(yīng)。

tab導(dǎo)航相對于list和button導(dǎo)航,有很多即得的優(yōu)點:

  • 既然只有一個初始時既選的活動tab,用戶能立即從界面獲取tab的內(nèi)容。

  • 用戶可在相關(guān)界面內(nèi)快速導(dǎo)航,不用重新訪問父界面。

注意: 當(dāng)切換Tab時,保證立即切換很重要。不要加載時彈個確認(rèn)對話框來阻塞tab的訪問。

導(dǎo)致這個模式被批評常見的原因就是必須從展示內(nèi)容的屏幕空間分一些給tab提示欄。但是結(jié)果還能接受,權(quán)衡一般都向使用此模式的方向傾斜。你可以隨意個性化你的tab提示欄,加點文字或圖標(biāo)什么的讓縱向空間合理利用。但是調(diào)整tab寬度時,請確保tab夠大到能讓人無誤點擊。

水平分頁(Swipe View)

Swipe View 設(shè)計

設(shè)計指南請閱讀 Android 設(shè)計文檔的Swipe View指導(dǎo)

另一種橫向?qū)Ш降哪J骄褪撬椒猪?,也叫?Swipe View。這個模式在容器關(guān)聯(lián)的同級界面上最好用,例如類別列表(世界,金融,技術(shù)和健康新聞)。就像Tab,這個模式也允許組合界面,這樣父界面就能在布局內(nèi)嵌入子界面的內(nèi)容。

http://wiki.jikexueyuan.com/project/android-training-geek/images/app-navigation-descendant-lateral-paging.png" alt="app-navigation-descendant-lateral-paging" />

Figure 6. 水平分頁導(dǎo)航例子和對應(yīng)界面圖

在水平分頁 UI 中,一次只展示一個子界面(這兒叫page)。用戶能通過觸摸屏幕然后按想要訪問相鄰頁面的方向拖拽導(dǎo)航到同級界面。為補(bǔ)充這種手勢交互通常由另一種 UI 元素提示當(dāng)前頁和可訪問頁。這樣能幫助用戶發(fā)覺內(nèi)容并且也提供了更多的上下文環(huán)境信息給用戶。當(dāng)為區(qū)塊關(guān)聯(lián)的同級模塊使用這種模式的水平導(dǎo)航時,這個做法很有必要。這些提示界面元素的例子包括點標(biāo)(tick mark),滑動標(biāo)注(scrolling label)和標(biāo)簽(tab):

http://wiki.jikexueyuan.com/project/android-training-geek/images/app-navigation-descendant-lateral-paging-companion.png" alt="app-navigation-descendant-lateral-paging-companion" />

Figure 7. 搭配分頁的 UI 元件。

當(dāng)子界面包含水平平移視圖時(例如地圖)也最好避免使用這種模式,因為這些沖突的交互會威脅你界面的易用性。

此外,對于同級關(guān)聯(lián)界面,如果內(nèi)容類型具有一定相似性而且同級界面數(shù)量較少時,水平分頁再適合不過了。就這一點,這個模式可以和tab一起用。tab放在內(nèi)容上方來最大化界面直觀性。對于容器關(guān)聯(lián)界面,當(dāng)界面間有天然的順序時,水平分頁是最符合直覺的,例如頁面代表連續(xù)的日歷日。對于無窮無盡的數(shù)據(jù),特別是雙向都有內(nèi)容數(shù)據(jù),分頁機(jī)制效果非常棒。

下節(jié)課,我們討論在內(nèi)容層級中允許用戶往上和回退到之前訪問界面的導(dǎo)航的機(jī)制。

下節(jié)課:提供向上和時間導(dǎo)航