Material Design相关网站
Material Design官网:https://www.mdui.org/design/material-design/introduction.html
Material Design说明简书:
https://www.jianshu.com/p/5dfed8a3a017
https://www.jianshu.com/p/575af19b63f7
简介
Material Design 中文名:材料设计语言
是由Google推出的全新的设计语言。
谷歌表示,这种设计语言旨在为手机、平板电脑、台式机和“其他平台”提供更一致、更广泛的“外观和感觉”。
Material Design是一套UI设计标准——
Z轴的概念
Z轴的投影
Z轴的应用
作为谷歌的官方设计语言,其实它不仅能用于安卓设备的 UI 设计上。网页设计,甚至电脑客户端的 UI 都能运用上 Material Design。
- 悬浮球 FAB(Buttons: floating action button)>>
- 顶部应用栏(App bars: top)>>
- 背板设计的辅助控件 >>
Material Design提供的材料主题
@android:style/Theme.Material(深色版本)
@android:style/Theme.Material.Light(浅色版本)
@android:style/Theme.Material.Light.DarkActionBar
colorPrimary: APP主要颜色,一般用于ActionBar,ToolBar的背景色设置。
colorPrimaryDark:比colorPrimary要深一些的颜色,如果状态栏颜色android:statusBarColor 没有设置固定值将默认为colorPrimaryDark的颜色。
colorAccent: 强调色,用于如FloatingActionButton小控件上起强调突出作用的色彩。
AppCompatActivity
官方介绍:
从Android 21之后引入Material Design的设计方式,为了支持Material Color 、调色板、toolbar等各种新特性,AppCompatActivity就应用而生。
代替了原有的ActionBarActivity。在AppCompatActivity中,更是引入了AppCompatDelegate类的设计,可以在普通的Acitivity中使用AppCompate的相关特性。
AppCompatActivity 兼容Material Design的新Activity父类
官方说明:从Android 21之后引入Material Design的设计方式,为了支持Material Color 、调色板、toolbar等各种新特性,AppCompatActivity就应用而生。
代替了原有的ActionBarActivity。在AppCompatActivity中,更是引入了AppCompatDelegate类的设计,可以在普通的Acitivity中使用AppCompate的相关特性。
当我们的Activity继承的是AppCompatActivity 的时候 AppCompatActivity会把我们的控件全部进行替换 替换成具备Material Design风格的控件
AppCompatActivity.setContentView() -->
AppCompatDelegateImpl.setContentView() -->
AppCompatDelegateImpl.onCreateView() -->
AppCompatDelegateImpl.createView -->
AppCompatDelegateImpl.mAppCompatViewInflater.createView()
CoordinatorLayout
官方介绍:
CoordinatorLayout是一个“加强版”FrameLayout,它主要有两个用途:
- 用作应用的顶层布局管理器,也就是作为用户界面中所有UI控件的容器
- 用作相互之间距有特定交互行为的UI控件的容器
通过为CoordinatorLayout的直接子View指定Behavior,就可以实现它们之间的交互行为。
Behavior可以用来实现一系列的交互行为和布局变化,比如说侧滑菜单、可滑动删除的UI元素,以及跟随着其他
UI控件移动的按钮等。
它是什么类型的布局?线性布局?相对布局?
CoordinatorLayout相关属性链接
https://www.jianshu.com/p/575af19b63f7
Behavior
官方介绍:
Beahvior是CoordinatorLayout的核心组件,使用Behavior可以实现CoordinatorLayout内直接子控件之间的交互。(PS:直接子控件是指CoordinatorLayout的直接子控件)
app:layout_scrollFlags :效果显示,视图滚动时,Toolbar会隐藏,这个效果是Android Support Library里面,新增的CoordinatorLayout, AppBarLayout实现的。
通过AppBarLayout的子视图 的属性控制。这就是控制滑动时视图效果的属性。app:layout_scrollFlags有四个值:
1、scroll: 所有想滚动出屏幕的view都需要设置这个flag, 没有设置这个flag的view将被固定在屏幕顶部。例如,TabLayout 没有设置这个值,将会停留在屏幕顶部。
2、enterAlways: 设置这个flag时,向下的滚动都会导致该view变为可见,启用快速“返回模式”。
3、enterAlwaysCollapsed: 当你的视图已经设置minHeight属性又使用此标志时,你的视图只能已最小高度进入,只有当滚动视图到达顶部时才扩大到完整高度。
4、exitUntilCollapsed: 滚动退出屏幕,最后折叠在顶端。
Material Design中的部分控件
1.Toolbar
2.CollapsingToolbarLayout
3.AppBarLayout
4.CoordinatorLayout
5.DrawerLayout
6.NavigationView
7.ActionBarDrawerToggle
8.Recyclerview
9.CardView
1.Toolbar
用toolbar之前首先要将主题改为md风格的
Material Design的Theme
md的主题有:
•@Android:style/Theme.Material (dark version)
•@android:style/Theme.Material.Light (light version)
•@android:style/Theme.Material.Light.DarkActionBar
与之对应的Compat Theme:
•Theme.AppCompat
•Theme.AppCompat.Light
•Theme.AppCompat.Light.DarkActionBar
当然为了兼容低版本我们使用compat theme
先在res/values/styles.xml 中增加一个名为AppThemeBase的style