詳細介紹Android設計輔助類庫

jopen 9年前發布 | 27K 次閱讀 Android
 

原作者 Ian Lake , Developer Advocate

翻譯,胡坤, 楊智行, 陳慶滔

相比于以前,Android 5.0版本是一個比較大的發布,引入了Material Design作為全新的設計語言,從而讓Android整體體驗煥然一新。開發者學習Material Design可以從 規范網站

開始,但是我們也理解這對于開發者確實是一個挑戰,尤其是對于對老版本Android的向后兼容問題。幸運的是,通過最新的Android設計輔 助類庫,我們可以將許多重要的設計組件兼容Android 2.1以及以上的版本,包括navigation drawer view, floating labels for editing text, a floating action button, snackbar, tabs, 還有用來連接他們的動畫或者滑動的框架。

導航視圖

Navigation drawer對于標識和應用內導航是一個非常重要的視覺焦點,而且一致性的設計風格也可以讓用戶更加容易理解,尤其是第一次進入的用戶。 NavigationView

類提供了navigation drawer需要的框架技術,以及通過菜單資源配置導航項目的能力,從而讓實現變得更加簡單。

可編輯文本的浮動標簽

Material Design中的 EditText 還是有改進空間的。目前的EditText,在你輸入第一個字節后會隱藏掉提示文本,你也可以將提示文本放到 TextInputLayout 中,從而讓提示內容成為EditText之上的浮動標簽,保證用戶明白自己所處的上下文。

FAB:Floating Action Button

FAB浮動在用戶界面之上,代表某個主要的動作。設計類庫中的 FloatingActionButton

提供了一個一致性的實現方案,缺省情況下,使用theme中的colorAccent進行著色。

詳細介紹Android設計輔助類庫

除了正常大小的FAB,如果有其他更重要的視覺元素需要展示,它也可以支持更小的尺寸(fabSize="mini")。因為FloatingActionButton擴展自ImageView,你也可以利用android:src或者其他的方法 setImageDrawable 來控制顯示哪個圖標。

Snackbar

某個操作之后, snackbar 可以完美的展示一些輕量級的快速反饋。Snackbars通常展示在屏幕下方,包含一些信息文本,也可以包含一個動作按鈕。在超過設定的時間之后,它會自動的隱藏掉屏幕。另外,用戶也可以通過滑動的方式刪掉。

Tabs

利用Tabs進行不同的視圖切換,并不是Material Design的新概念,他們被設定為了一組 top level navigation pattern 或者用來組織應用內的不同內容,例如,不同類型的音樂。

詳細介紹Android設計輔助類庫

設計類庫中的 TabLayout 即實現了固定tabs,也實現了滾動tabs。固定tabs的寬度根據當前視圖平均分配,滾動tabs的寬度大小不一定相同。Tabs也可以通過編程的方式動態增加:

但是,在不同tabs的每個垂直頁面中,如果你使用了 ViewPager ,你需要從 PagerAdapter 調用 getPageTitle() ,然后通過setupWithViewPager函數將他們鏈接起來。這個用來保證tab的選擇事件可以更新ViewPager,頁面變化也可以更新被選中的tab。

CoordinatorLayout, 動畫、滾動

獨特的視覺體驗只是Material Design中的一部分:動畫是Material Design中的另外一個重要因素。Material Design中有了 touch ripples meaningful transitions 等動畫效果,新的設計類庫引入了 CoordinatorLayout ,這是一種可以對子視圖進行控制的布局效果。這種布局效果,設計類庫中的很多組件都受益。

CoordinatorLayout和FAB

一個非常好的例子就是,把FAB加入到CoordinatorLayout布局效果中,然后將CoordinatorLayout 傳遞到Snackbar.make函數中。snackbar不再是顯示FAB之上,FAB通過來自于CoordinatorLayout的回調函數,自動 的向上移動當snackbar顯示的時候。snackbar消失后,在回歸到原來的位置。這個功能在Android 3.0以上的設備都是支持的,并不需要修改代碼。

CoordinatorLayout也提供了layout_anchor屬性,配合layout_anchorGravity使用,可以把一些浮動組件例如FAB放置到其他視圖的相對位置。

CoordinatorLayout和app bar

CoordinatorLayout其他的主要使用方法,就是會影響到app bar和 scrolling techniques 的使用。你可能已經在布局中使用了 Toolbar ,為了更容易的定制化界面或者讓圖標風格和應用更加一體化。設計類庫對此提供了更好的支持:使用 AppBarLayout

允許你的工具條和其他組件(例如TabLayout的tabs)在帶帶有ScrollingViewBehavior屬性的兄弟視圖中響應滾動事件。

可折疊工具條

在AppBarLayout上直接放置一個工具條,可以讓你訪問enterAlwaysCollapsed和andexitUntilCollapsed這兩個scroll標簽,但是不能控制不同的元素的折疊行為。如果需要,可以使用 CollapsingToolbarLayout

CoordinatorLayout和自定義窗口

有一個非常重要值得注意的事情是,CoordinatorLayout對于FloatingActionButton和AppBarLayout的運作方式是沒有理解的,它僅僅提供一個額外的API Coordinator.Behavior

,可以允許子視圖更好的控制觸摸事件、手勢,還有彼此之間被定義的各種依賴,以及通過 onDependentViewChanged

來接受回調。視圖可以通過指定theCoordinatorLayout.DefaultBehavior annotation來定義一個缺省的行為,或者通過 app:layout_behavior="com.example.app.YourView$Behavior"屬性在layout文件中設置。這個 框架可以讓任何組件集成到CoordinatorLayout中。

開始使用

設計類庫現在已經可以使用了,使用之前,還請在SDK manager中更新Android Support Repository。只用加入一個新的依賴, compile 'com.android.support:design:22.2.0', 就 可以使用設計類庫了。注意的是,因為設計類庫依賴Support v4和AppCompat Support Libraries,這些類庫也會被自動加載進來。在Android Studio的布局編輯器的設計窗口中,這些新的視圖小工具也都是可以使用的,讓你可以通過更簡單的方式,提前預覽新的組件效果。

設計類庫、AppCompat、還有所有的Android Support Library都是非常重要的工具,可以幫助你創建一個更加現代和時尚的Android應用。

想了解更多內容,請查閱 這里

 本文由用戶 jopen 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。
 轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!