Material design - Components– Toolbars

Toolbars - 工具栏

Toolbar actions appear above the view affected by their actions.

Toolbars appear a step above the content they affect. They may constrain their width to accommodate material passing over them.

Do not separate a toolbar’s actions by another sheet of material, unless it is transient, such as a menu or dialog.

【翻译】
工具栏操作显示在受其操作影响的视图上方。
工具栏在其影响的内容上方显示一个步骤。 它们可以约束它们的宽度以容纳经过它们的材料。
不要将工具栏的操作与另一张材料分开,除非它是暂时的,例如菜单或对话框。

Elevation - 海拔

Above app content

【翻译】
以上应用内容

Scrolling - 滚动

Affected content scrolls underneath toolbars.

【翻译】
受影响的内容会在工具栏下滚动。

Dismissed content - 已拒绝的内容

Sheets may temporarily cover the toolbar while moving offscreen.

【翻译】
在移动屏幕时,工作表可能暂时覆盖工具栏。

Material design - Components– Toolbars_第1张图片

Usage - 用法

Toolbars appear a step above the sheet of material affected by their actions. When sheets scroll underneath toolbars, they are clipped and cannot pass through to the opposite side.

【翻译】
工具栏在受其操作影响的材料表上方显示一个步骤。当纸张在工具栏下方滚动时,它们被夹住并且不能穿过到相对侧。

Material design - Components– Toolbars_第2张图片
image

Toolbars are located a step above another sheet.

【翻译】
工具栏位于另一个工作表的上一个步骤。

Sheets can also cover the toolbar as they move offscreen.

【翻译】
当页面移动到屏幕外时,工作表也可以覆盖工具栏。

[图片上传失败...(image-ec0612-1552293154160)]
The toolbar maintains its seam until it moves off of the screen.

【翻译】
工具栏保持其接缝,直到它移出屏幕。

Finally, the second sheet can cover the toolbar as it moves.

【翻译】
最后,第二张工作表可以覆盖工具栏。

Material design - Components– Toolbars_第3张图片
image

The second sheet covers the toolbar as it moves.

【翻译】
第二个工作表移动时覆盖工具栏。

A toolbar’s left and right actions are never split by another sheet of material, with the exception of temporary materials such as menus or dialogs.

Instead, toolbars can constrain their width to make space for sheets of material passing over them. The actions on the left and right cluster to stay on the same side of a toolbar.

【翻译】
工具栏的左右操作不会被另一张材料分割,除了菜单或对话框等临时材料之外。
相反,工具栏可以限制它们的宽度,以便为在其上经过的材料片材留出空间。 左侧和右侧集群上的操作保持在工具栏的同一侧。

Material design - Components– Toolbars_第4张图片
正确的示范

Do.
Constrain width to less than the full length of its material.

【翻译】
正确的示范
将宽度限制为小于其材料的全长。

Material design - Components– Toolbars_第5张图片
错误的示范

Don't.
Never allow a sheet of material to be split by another persistent sheet of material.

【翻译】
错误的示范
切勿让一张材料被另一张持久的材料分割。

Toolbars can share a seam with another sheet.

In cases where they share a seam that transforms into a step, it is called a waterfall.

【翻译】
工具栏可以与其他工作表共享接缝。
如果他们共享一个转换为一个步骤的缝,它被称为瀑布。

Material design - Components– Toolbars_第6张图片
image

In the waterfall variant of clipping, the toolbar starts out as seamed and then lifts to form a step.

【翻译】
在剪辑的瀑布变体中,工具栏开始作为缝合,然后提升以形成一个步骤。

你可能感兴趣的:(Material design - Components– Toolbars)