零、前言
虽然网上已经有了很多Material Design系列的文章,但是动眼和动手是有本质区别的
虽然有很好的文章,但不太系统,既然要总结Material Design,那就写一个系列吧,可以说`尽吾所能,纳百家之长`
Material Design本身倒不难,就是有点烦,小东西太多,核心的难点要数`Behavior`了
心态要放好:要相信Material Design是为了帮助开发者的,而不是谷歌闲着没事弄个东西刁难我们
所有的代码都我都亲自测试过,文章的语言也尽量用我的话来叙述,大量的动图和图片也是我一个一个截的
属性介绍以xml里为主,代码中动态设置使用`setXXX`即可,如有需要,可自理(多选模式:类名.模式名)
so:项目源码:Github----Android_Material_Design_Test你看着办吧
本系列文章一览:
- Android材料设计Material Design 开篇前言
- Android材料设计之ToolBar+CardView+沉浸标题栏
- Android材料设计之FloatingActionButton+Snackbar+SheetX3
- Android材料设计之BottomNavigationBar+TabLayout
- Android材料设计之AppBarLayout+CoordinatorLayout
- Android材料设计之CollapsingToolbarLayout+Palette
- Android材料设计之DrawerLayout+NavigationView+TextInputLayout
- Android材料设计之Behavior攻坚战
一、本篇是干嘛的(开场不能low)----点将台
1.ToolBar资料卡片:
国籍:View
城市:ViewGroup
爱好:招揽小弟、统筹协调
一句话:哥是老大,就座在上面,你不服?
额外依赖:无
toolbar常用属性.png
2.CardView资料卡片:
国籍:View
城市:ViewGroup(FrameLayout)
爱好:梳妆打扮,圆角阴影
一句话:姐怎么能这么好看...
额外依赖:implementation 'com.android.support:cardview-v7:27.1.1'
CardView.gif
3.FloatingActionButton资料卡片:
国籍:View
城市:ImageView
爱好:游离不定、抱大腿、随用随到
一句话:没关系,我小,不碍事
额外依赖:implementation 'com.android.support:design:27.1.1'
fab的属性.png
4.Snackbar资料卡片:
国籍:非View
城市:BaseTransientBottomBar
爱好:show
一句话:虽然我不是View,但我体内燃烧着View的灵魂(FrameLayout之魂)
额外依赖:implementation 'com.android.support:design:27.1.1'
fab_sna.gif
5.bottom_sheet资料卡片:
国籍:非View
城市:Behavior族
爱好:暗杀、潜藏、show
一句话:哥是迷一样的存在----Behavior族
额外依赖:implementation 'com.android.support:design:27.1.1'
状态监听.gif
6.BottomNavigationBar资料卡片:
国籍:View
城市:FrameLayout
爱好:切换状态
一句话:最佳底栏就是我,TabLayout别跟我抢
额外依赖:implementation 'com.ashokvarma.android:bottom-navigation-bar:1.2.0'
颜色.png
7.TabLayout资料卡片:
国籍:View
城市:FrameLayout
爱好:切换状态
一句话:老娘上得厨房,下得厅堂
额外依赖:implementation 'com.android.support:design:27.1.1'
tablayout.png
8-1.AppBarLayout资料卡片:
国籍:View
城市:ViewGroup(LinearLayout)
爱好:装东西、酷炫
一句话:别绑架我,我不是大佬,Behavior才是...
额外依赖:implementation 'com.android.support:design:27.1.1'
8-2.CoordinatorLayout资料卡片:
国籍:View
城市:ViewGroup
爱好:军师,调兵遣将
一句话:运筹帷幄之中,决胜千里之外
额外依赖:implementation 'com.android.support:design:27.1.1'
9.CollapsingToolbarLayout资料卡片:
国籍:View
城市:ViewGroup(LinearLayout)
爱好:潮流、碰撞
一句话:AppBarLayout是我哥,ToolBar是我弟,我怕你?
额外依赖:implementation 'com.android.support:design:27.1.1'
CollapsingToolbarLayout1.gif | CollapsingToolbarLayout.gif |
---|
10.DrawerLayout资料卡片:
国籍:View
城市:ViewGroup
爱好:装东西
一句话:孰愿随孤,开疆拓土...
额外依赖:implementation 'com.android.support:design:27.1.1'
DrawerLayout.gif
11.NavigationView资料卡片:
国籍:View
城市:ViewGroup(FrameLayout)
爱好:装东西
一句话:我就是我,不一样的自我
额外依赖:implementation 'com.android.support:design:27.1.1'
NavigationView.png
12.TextInputLayout资料卡片:
国籍:View
城市:ViewGroup(LinearLayout)
爱好:装东西
一句话:输入框的最佳神辅助
额外依赖:implementation 'com.android.support:design:27.1.1'
字符个数监听.gif
13.最强战将:Behavior资料卡片
国籍:Behavior神秘种族
城市:Behavior神秘领地
爱好:联动
一句话:军师CoordinatorLayout麾下最强战将,没有之一
额外依赖:implementation 'com.android.support:design:27.1.1'
联动.gif
二、资源文件
1.常用颜色一览:
常用颜色.png2.测试Text样式抽取
<!--测试用的TextView通用属性-->
<style name="TVTestCenter">
<item name="android:layout_width">match_parent</item>
<item name="android:layout_height">100dp</item>
<item name="android:gravity">center</item>
<item name="android:textSize">18sp</item>
<item name="android:text">Test-测试文字</item>
<item name="android:background">#6096F3</item>
<item name="android:textColor">#fff</item>
</style>
3.常用尺寸
<dimen name="dp_2">2dp</dimen>
<dimen name="dp_4">4dp</dimen>
<dimen name="dp_8">8dp</dimen>
<dimen name="dp_16">16dp</dimen>
<dimen name="dp_24">24dp</dimen>
<dimen name="dp_32">32dp</dimen>
<dimen name="dp_48">48dp</dimen>
<dimen name="dp_56">56dp</dimen>
<dimen name="dp_64">64dp</dimen>
<dimen name="dp_72">72dp</dimen>
<dimen name="dp_88">88dp</dimen>
<dimen name="dp_200">200dp</dimen>
<dimen name="sp_12">12sp</dimen>
<dimen name="sp_14">14sp</dimen>
<dimen name="sp_16">16sp</dimen>
<dimen name="sp_18">18sp</dimen>
<dimen name="px_1">1px</dimen>
4.资源图标位置:
test\src\main\res\drawable
5.图片资源位置
app\src\main\res\mipmap-xhdpi
后记:捷文规范
1.本文成长记录及勘误表
项目源码 | 日期 | 备注 |
---|---|---|
V0.1--github | 2018-11-30 | Android材料设计Material Design 开篇前言 |
2.更多关于我
笔名 | 微信 | 爱好 | |
---|---|---|---|
张风捷特烈 | 1981462002 | zdl1994328 | 语言 |
我的github | 我的简书 | 我的掘金 | 个人网站 |
3.声明
1----本文由张风捷特烈原创,转载请注明
2----欢迎广大编程爱好者共同交流
3----个人能力有限,如有不正之处欢迎大家批评指证,必定虚心改正
4----看到这里,我在此感谢你的喜欢与支持
icon_wx_200.png
网友评论