Material Design基本控件的說明

1.什么是Material Design
2.為什么使用Material Design
3.Material Design主要的控件和使用

什么是Material Design

中文翻譯為材料設(shè)計,由谷歌2014年I/O大會上推出的全新設(shè)計語言。對于Android系統(tǒng)會提供API供開發(fā)使用。

為什么使用Material Design

首先先問下為什么要推出這個設(shè)計語言?為了構(gòu)建一種跨平臺和超越尺寸的統(tǒng)一體驗的設(shè)計體系。題外話是,嫉妒蘋果的統(tǒng)一性設(shè)計,想擴大自己在軟件上的設(shè)計影響力。但是對于Android開發(fā)者來說,還是具有界面美觀,便捷開發(fā)的優(yōu)勢。

Material Design主要的控件和使用

對于Android應(yīng)用開發(fā),需要引入Design設(shè)計包,才可以使用。

dependencies {
      implementation "com.android.support:design:26.0.2"
}
  • DrawerLayout + NavigationView (ActionBarDrawerToggle)模式可以制作一個側(cè)滑攔的布局,非常簡潔好用。

  • CoordinatorLayout:協(xié)調(diào)性布局,目前是分為兩部分:可收縮布局和可滑動布局??墒湛s布局主要是由AppBarLayout包裹一些控件來收縮布局,比如CollapsingToolbarLayout,Toolbar;可滑動布局明確規(guī)定必須實現(xiàn)NestedScrollingChild接口才能實現(xiàn)滑動效果,可直接使用的控件有NestedScrollView,SwipeRefreshLayout和RecyclerView。

AppBarLayout中scrollFlags的五個值:
scroll:表示子布局可以滑動來展現(xiàn)或者隱藏AppBar布局,這是其它四個條件的必要條件
snap:表示界面顯示完整的AppBar布局或者不顯示AppBar布局,或者只顯示Toolbar的高度
exitUtilCollapsed:表示Toolbar固定在頂部顯示,AppBar根據(jù)子布局展示頂部時才全部顯示
enterAlways:內(nèi)容向下拉時顯示完整Appbar,內(nèi)容向上推時隱藏Appbar
enterAlwaysCollapsed:內(nèi)容向下拉到頂部時顯示Appbar,否則不顯示Appbar
這幾種可以組合使用,效果會有些微的變化:
scroll enterAlways enterAlwaysCollapsed 內(nèi)容向下拉時只顯示Toolbar,內(nèi)容向上拉時隱藏AppBarLayout布局

  • BottomNavigationView是實現(xiàn)底部導(dǎo)航欄的控件,官方指導(dǎo)2-4控件放在底部比較合適,通過設(shè)置app:menu="@menu/bottom_navigation_menu"來顯示控件。
    TabLayout是和BottomNavigationView控件類似的一組導(dǎo)航欄控件,常放于屏幕頂部,子控件數(shù)量不限,所以它本身設(shè)置了好多種模式,滑動的,平分的,居中的,各種效果都有。
    這兩種控件都可以展示許多個View,一般都與View Pager一起使用,里面包含F(xiàn)ragment顯示。

  • 另外有一些常用的控件,例如FloatingActionButton,放在CoordinatorLayout布局中具有可收縮功能,其它好像跟一個ImageView沒有太多的區(qū)別。SnackBar,是底部顯示通知消息的一種控件,并且可以設(shè)置操作功能,相比于以前的Toast只能提示信息,多了可以操作的功能。CardView,可以方便的實現(xiàn)圓角,陰影等效果的布局,繼承于FrameLayout。TextInputLayout控件,里面常包裹輸入框,可以將hint內(nèi)容在輸入內(nèi)容時移動輸入框頂部,可以在輸入庫底部顯示錯誤的信息,可以顯示輸入字符的數(shù)量等等功能,算是一個集成的功能。


具體使用可參考Material Design基本控件使用Demo

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 178,928評論 25 709
  • 原文鏈接:https://github.com/opendigg/awesome-github-android-u...
    IM魂影閱讀 33,149評論 6 472
  • 內(nèi)容抽屜菜單ListViewWebViewSwitchButton按鈕點贊按鈕進度條TabLayout圖標(biāo)下拉刷新...
    皇小弟閱讀 47,146評論 22 665
  • 團團和圓圓是一對雙胞胎,長得跟名字一樣,圓圓的臉蛋,圓圓的肚子。 嘿,別看兩個小家伙長得胖乎乎的,身體可是靈活得很...
    小饞媽閱讀 413評論 2 2
  • 徐瑩扶著肚子坐起身時,楊浩然已經(jīng)不在身邊,床的左側(cè)被子堆成一團,摸摸他睡過的地方也已經(jīng)冷卻,就想徐瑩在這段...
    芳小丫閱讀 327評論 0 0

友情鏈接更多精彩內(nèi)容