创意定制 动画可以在很宽的范围内使用，它能够将功能和外观非常和谐的联系起来。 Animation may be used in a wide range of and contexts to unite beauty and function. 图标类型 Icon types 系统图标可以拥有双重功能。 System icons may perform dual functions. 产品表现的应该非常优雅。 Product icons should demonstrate polish. 图标 Icons 系统图标 System icons 一个图标可以具有双重功能。例如，一个菜单图标可以平滑的转换成返回控制，并再次恢复成菜单图标。这个效果既告诉了用户这个按钮的功能同时为交互增加了神奇的元素。 An icon may serve dual

编排 Choreography 运动的材料通过在过度中利用共享元素的交互来引导用户注意力。 Material in motion guides the user’s focus through interactions by sharing elements across transitions. 创建表面 Surface creation 新表面的创建过程中使用交错的编排效果。 Stagger the choreography of new surfaces being created. 径向反馈 Radial reaction 用户输入和表面反应通过波纹进行连接。 Connect user input to surface reactions with touch ripples. 连续性 Continuity 在变化中通过仔细的选择共享元素的数量和类型来保持清晰的焦点。 Maintain a clear focal

编排 Choreography 运动的材料通过在过度中利用共享元素的交互来引导用户注意力。 Material in motion guides the user’s focus through interactions by sharing elements across transitions. 创建表面 Surface creation 新表面的创建过程中使用交错的编排效果。 Stagger the choreography of new surfaces being created. 径向反馈 Radial reaction 用户输入和表面反应通过波纹进行连接。 Connect user input to surface reactions with touch ripples. 连续性 Continuity 在变化中通过仔细的选择共享元素的数量和类型来保持清晰的焦点。 Maintain a clear focal

材料变形 材料可以通过将表面分割，组合，改变形状，和改变大小让人们觉得他是活的。 Material can make surfaces feel alive by multiplying and dividing them, and changing their shape and size. 矩形变形 Rectangular transformation 不对称 Asymmetric 对称 Symmetric 波纹转变 Radial transformation 对称 和 圆形 Symmetrical and circular 当材料的形状和大小进行变化时，高度和宽度是沿着运动曲线异步变化的。其附近表面内部或它周围的元素的变形的动画是需要经过 编排。 When material changes shape and size, its width

运动 Movement 运动中的材料也会受到类似真实世界中相似的力，比如重力。 Material in motion abides by forces similar to those of the real world, like gravity. 屏幕内运动 On-screen movement 上弧线 Arc upward 下弧线 Arc downward 移入和移出屏幕运动 In-and-out screen movement 独立运动 Independent movement 相对运动 Relative movement 在屏幕边界内运动 Movement within screen bounds 屏幕边界内的元素在两点之间的运动要保持自然的弧度，所有屏幕内的运动要使用 标准曲线运动。 The movement of an

运动中的 Material（材料）是响应式和自然的。使用一些缓动曲线和持续时间模式来创造一些顺滑和连贯的运动。 Material in motion is responsive and natural. Use these easing curves and duration patterns to create smooth and consistent motion. 缓速曲线 Easing curves * 标准曲线 * 减速曲线 * 加速曲线 * 急弯曲线 * Standard curve * Deceleration curve * Acceleration curve * Sharp curve 速度 Speed 当元素从起始位置移动到目标位置时的状态，为了不让用户等待过长的时间，运动的速度应该足够快。但同时也要保证速度不能过快而导致用户无法了解你的目的。当用户能频繁看到时，则应该将变化时间变的缩短。 When elements

Motion（运动）在 Material Design 的世界中是以美丽和流畅的方式来描述空间关系，功能和目的手段。 Motion in the world of material design is used to describe spatial relationships, functionality, and intention with beauty and fluidity. 为什么 motion 很重要？ Why does motion matter? Motion 表达了应用的组织方式和它能做什么？ Motion shows how an app is organized and what it can do. Motion 作用：

仅支持 Android 设备。 Android only Split-screen（分屏模式）允许两个活动在屏幕上同时可见。 Split-screen mode allows two activities to be visible on screen at the same time. 用法 Usage 需要用户交互 User interaction required 应用程序不能自行调用 split-screen（分屏模式）; 用户必须主动激活。 Apps are not allowed to invoke split-screen mode by themselves; the user must activate it. 启动新活动 Launching new

在 Material Design 中响应式布局可以适应任何尺寸的屏幕。这个 UI 指南包括一个灵活的栅格系统，它可以在跨平台的同时让布局保持一致性，breakpoint（断点） 的细节是在与内容如何在不同屏幕尺寸上来回流动，以及一个应用程序如何从小到大的屏幕进行扩展的描述。 Responsive layouts in material design adapt to any possible screen size. This UI guidance includes a flexible grid that ensures consistency across layouts, breakpoint details about how content reflows on different screens, and a description of how an

UI regions For guidance on arranging elements in z-space to achieve the correct behavior and shadows, see the Environment and Elevations and shadows sections. 有关在 z-space（z 轴方向） 中如何排列元素以达到表现正确行为和阴影，可查看 环境 （Environment） 和 高度和阴影（Elevations and shadows） 部分。 Mobile structure This structure includes a permanent app bar and floating action

Baseline grids All components align to an 8dp square baseline grid for mobile, tablet, and desktop. Iconography in toolbars align to a 4dp square baseline grid. 所有的元素在移动端，平板端和桌面端都以边长为 8dp 的正方形作为基线网格。toolbars（工具栏）的图标使用边长为 4dp 的正方形作为基线网格。 Example of baseline grid Example of baseline grid Type aligns to a 4dp baseline grid.

Some units have different meanings in different contexts. This chapter discusses the usage of device-independent pixels, scaleable pixels, as well as concepts like pixel density. 在不情境下，单位有着不同的含义。这章主要是来讨论独立设备像素，可扩展像素的使用方法以及像素密度的概念 Pixel density The number of pixels that fit into an inch is referred to as “pixel density.” High-density screens have more

Material design is guided by print-based design elements – such as typography, grids, space, scale, color, and imagery – to create hierarchy, meaning, and focus that immerse the user in the experience. Material design adopts tools from the field of print design, like baseline grids and structural templates, encouraging consistency across environments

Material design is guided by print-based design elements – such as typography, grids, space, scale, color, and imagery – to create hierarchy, meaning, and focus that immerse the user in the experience. Material design adopts tools from the field of print design, like baseline grids and structural templates, encouraging consistency across environments

Roboto and Noto are the standard typefaces on Android and Chrome. Roboto 和 Noto 字体是 Android 和 Chrome 的标准字体 Roboto is the standard typeface on Android. Roboto 是 Android 的标准字体。 Noto is the standard typeface for all languages on Chrome and Android for all languages not covered by Roboto. Noto

Imagery is more than decoration. It’s a powerful tool to help you communicate and differentiate your product. 图像占的比重远超与其他的修饰，它是一个强有力的工具帮助你表达意图和区分你的产品 Bold, graphic, and intentional imagery helps to engage the user. 大胆鲜明并且有趣的图像能够帮助你吸引用户的注意。 Whether the mood is subdued and muted or bright and colorful, the following principles and best practices can help

Material icons use geometric shapes to visually represent core ideas, capabilities, or topics. Material 图标使用几何图形来表现核心思想、功能、题目。 Product icons are the visual expression of a brand’s products, services, and tools. 产品图标 ：是品牌用来表达服务和功能的视觉表现。 System icons represent a command, file, device, directory, or common actions. 系统图标 ：表示命令、文件、设备、目录或者某些常规的动作 Sizing

Material icons use geometric shapes to visually represent core ideas, capabilities, or topics. Material 图标使用几何图形来表现核心思想、功能、题目。 Product icons are the visual expression of a brand’s products, services, and tools. 产品图标 ：是品牌用来表达服务和功能的视觉表现。 System icons represent a command, file, device, directory, or common actions. 系统图标 ：表示命令、文件、设备、目录或者某些常规的动作 Sizing

Color in material design is inspired by bold hues juxtaposed with muted environments, deep shadows, and bright highlights. Material takes cues from contemporary architecture, road signs, pavement marking tape, and athletic courts. Color should be unexpected and vibrant. 在 Material Design 中色彩的灵感来自于在静止的环境中使用大胆的色彩对比，深沉的阴影、明亮的高光。材料需要从当代的建筑，路牌，路标，运动场上的规则线等进行隐射（功能与设计统一、简单、

Color in material design is inspired by bold hues juxtaposed with muted environments, deep shadows, and bright highlights. Material takes cues from contemporary architecture, road signs, pavement marking tape, and athletic courts. Color should be unexpected and vibrant. 在 Material Design 中色彩的灵感来自于在静止的环境中使用大胆的色彩对比，深沉的阴影、明亮的高光。材料需要从当代的建筑，路牌，路标，运动场上的规则线等进行隐射（功能与设计统一、简单、

Material Design 中的物体和现实中的物体具有相同的性质。在现实世界中，物体可以堆叠，或两个物体之间可以进行粘贴，但同时，物体之间是无法相互穿透。物体的阴影是光线投射到它身上所产生的。 这些特质行程的空间模型来自于现实，所以用户对此会非常熟悉熟悉，所以我们可以直接将这些特性运用到整个应用中。而高度和阴影的概念就是为了支撑这种空间模型。 高度（安卓） 高度指的是两个物体之间在z轴的相对高度或距离。 规范 * 高度的测量单位与x轴y轴的测量单位是相通的，主要是使用dp这个单位。因为所有的材料元素都有着1dp的厚度，所以高度的测量，是从一个材料到另一个材料的顶部之间的距离。 * 一个子对象的高度与他的父对象的高度息息相关。 以下是一些Android应用相关的事例图像。 两个物体之间的多个高度测量 静止高度 Material 中所有的对象，不论是多大的尺寸，都有静止高度，有的是默认高度，这高度是不能改变的。如果有物体改变了它的高度（因为操作），等操作完成后它也会尽快返回到这个静止高度。 桌面的静止高度应该小于2dp，用来适应鼠标和

Material Design 中的物体和现实中的物体具有相同的性质。在现实世界中，物体可以堆叠，或两个物体之间可以进行粘贴，但同时，物体之间是无法相互穿透。物体的阴影是光线投射到它身上所产生的。 这些特质行程的空间模型来自于现实，所以用户对此会非常熟悉熟悉，所以我们可以直接将这些特性运用到整个应用中。而高度和阴影的概念就是为了支撑这种空间模型。 高度（安卓） 高度指的是两个物体之间在z轴的相对高度或距离。 规范 * 高度的测量单位与x轴y轴的测量单位是相通的，主要是使用dp这个单位。因为所有的材料元素都有着1dp的厚度，所以高度的测量，是从一个材料到另一个材料的顶部之间的距离。 * 一个子对象的高度与他的父对象的高度息息相关。 以下是一些Android应用相关的事例图像。 两个物体之间的多个高度测量 静止高度 Material 中所有的对象，不论是多大的尺寸，都有静止高度，有的是默认高度，这高度是不能改变的。如果有物体改变了它的高度（因为操作），等操作完成后它也会尽快返回到这个静止高度。 桌面的静止高度应该小于2dp，用来适应鼠标和

Material 有着一些确定的特征和固有的行为。了解这些属性可以更好的将 Material Design 原本设计的初衷融入到你的设计中去。 物理属性 Material Design 中材料有着可定制的长度和宽度（单位：dp），但厚度都是统一的1dp。 正确：长度和宽度是可以定制的，并且所有的材料厚度都为1dp 错误： 材料投射的阴影 材料的阴影是从各个材料之间的相对高度（z轴方向）产生的自然结果。 正确：阴影是通过材料的相对高度产生的。 错误： 主题内容是呈现在材料上的，材料的颜色和形状是可以根据需求而改变的。而且内容的增加不会改变材料的厚度。 正确：材料可以显示各种形状和颜色 内容的行为可以独立于材料，但是范围会受到材料的范围受到限制。 正确：内容的行为可以独立于材料，但是范围会受到材料的范围受到限制。 材料是坚固的。 输入事件没有办法穿透材料，只能作用在预定的材料主体上。 正确：输入事件只影响到最上方的材料上。 错误：输入事件穿透了材料。 多个材料元素无法同时占用

Material 有着一些确定的特征和固有的行为。了解这些属性可以更好的将 Material Design 原本设计的初衷融入到你的设计中去。 物理属性 Material Design 中材料有着可定制的长度和宽度（单位：dp），但厚度都是统一的1dp。 正确：长度和宽度是可以定制的，并且所有的材料厚度都为1dp 错误： 材料投射的阴影 材料的阴影是从各个材料之间的相对高度（z轴方向）产生的自然结果。 正确：阴影是通过材料的相对高度产生的。 错误： 主题内容是呈现在材料上的，材料的颜色和形状是可以根据需求而改变的。而且内容的增加不会改变材料的厚度。 正确：材料可以显示各种形状和颜色 内容的行为可以独立于材料，但是范围会受到材料的范围受到限制。 正确：内容的行为可以独立于材料，但是范围会受到材料的范围受到限制。 材料是坚固的。 输入事件没有办法穿透材料，只能作用在预定的材料主体上。 正确：输入事件只影响到最上方的材料上。 错误：输入事件穿透了材料。 多个材料元素无法同时占用