2017 Material design 第四章第一节《原则》

第四章《布局》

1、原则 (Principles)

Material design基于印刷的设计元素(如排版、网格、空间、颜色和图像等)去建立层次结构、情景含义和视觉焦点,这一切都是为了增强用户体验。Material design 采用印刷设计的基本工具(如通用于全部页面的基础网格和结构模板),经过重复的视觉元素、结构网格和跨平台跨屏幕的能力来促进在不一样环境中的一致性。这些布局能够适配任何屏幕大小进行缩放,这大大简化了咱们建立可扩展性应用的过程。html

工做原理

Material design是把纸的物理性质转换到屏幕上,应用的背景相似于一张扁平且不透明的纸。应用的操做行为是模拟纸的物理行为,例如可以改变大小,拖拽和约束在多个sheets中。工具

构成应用的面的对象在Material design中咱们称之为 material或sheets of material。布局

应用以外的元素(如系统栏)是独立于应用以外的对象,这里不视其为 material 。google

关于Material的详细信息,请参阅 Material属性设计

接缝
两张material sheets间共享的一条公共边隙,咱们称之为接缝。有接缝的sheets一般会一块儿移动。
3d

两张material sheets间的接缝
两张material sheets间的接缝

Steps
两个在不一样Z轴位置的独立且重叠的sheets会造成一个step
component

两个重叠的sheets会造成一个step
两个重叠的sheets会造成一个step

浮动按钮

浮动按钮
浮动按钮是一个与工具栏分离的圆形sheet。cdn

当浮动按钮与step的内容相关时,它能够跨立在这个step上。htm

浮动按钮跨立于steps上。
浮动按钮跨立于steps上。

当浮动按钮与接缝的内容相关时,它能够跨立在这条接缝上。对象

永远不要只是为了给浮动按钮提供一个支撑点而引入一条装饰性的接缝。

浮动按钮跨立于接缝上。
浮动按钮跨立于接缝上。

浮动按钮的详细信息,请参阅 浮动按钮

相关文章
相关标签/搜索