Material Design——Cards
#我是一个可爱的搬砖工系列# 尝试对照英文翻译学习MD的组件设计，借此加深各种组件的应用~
Material Design链接：Material Design——Cards
卡片包含关于单个主题的内容和操作。
一、使用
卡片是在一个主题上显示内容和动作的界面。
它们应易于浏览，以获得相关和可采取操作的信息元素，如卡片上的文本和图像以明确的结构层次来展示。
· 包含 卡片可以识别为单个包含的单元
· 单独 一张卡片可以单独使用，而不依赖周围的元素作为背景
· 个体 一张卡片不能与另一卡片合并，也不能分成多张牌
二、分析
卡容器是卡中唯一必需的元素。这里显示的所有其他元素都是可选的。
卡片布局可以不同，以支持它们包含的内容类型。以下元素通常存在于该品种中。
1. Container 卡片容器容纳所有卡片元素，它们的大小取决于这些元素占用的空间，卡片高度由容器表示。
2. Thumbnail [optional] 卡片可以包括缩略图来显示头像、角标或图标。
3. Header text [optional] 标题文本可以包括诸如相册或文章的名称之类的内容。
4. Subhead [optional] 子标题文本可以包括文本元素，如文章字节行或标记位置。
5. Media [optional] 卡片可以包括各种媒体，包括照片，和图形，如天气图标。
6. Supporting text [optional] 支持文本包括文本，如文章摘要或餐馆描述。
7. Buttons [optional] 卡片可以包括操作按钮。
8. Icons [optional] 卡片可以包括操作按钮。
每一张卡片都是由内容块组成的。所有的块，作为一个整体，都与一个单独的主题或目的地有关。内容可以接受不同级别的强调，这取决于其层次结构。
卡片包含丰富的媒体、主标题、支持文本和操作。
△ 分割线
分割线可用于分离卡中的区域或指示可扩展的卡的区域。
使用嵌入分隔符(1)，不运行卡的完整长度的分隔符，以分离相关内容。
可以展开的内容应该使用全宽度分隔符。
三、行为
△ 转换
卡片可以变换以显示更多内容。
卡片扩展到使用父-子转换填充整个屏幕。
展开卡片以显示信息。
卡片不会突然正反面翻转来显示信息。
△ 高度
在移动设备上，卡的默认高度是1DP，升高的高度是8DP。
用投影来增强卡片的展示。
在桌面和手机上，卡的静止高度可以是0 dp。他们悬停时上升到8DP。
0 dp的笔画有助于表示一张卡片。
△ 手势
手势应该在卡片集合中一致地实现。卡上常用的手势包括swipe, pick up and move, and scrolling（刷卡、拾取、移动和滚动）。
· Swipe（刷卡）
一次可以在一张卡上，在卡上的任何地方执行刷卡手势。
它可用于：
· 关闭卡片
· 更改卡片的状态(例如标记或存档)
同一时间内，对一张卡片只操作一个刷卡动作。
卡片不应包含像banner那样的翻页内容(如图像传送带或分页)。
刷卡手势也不应导致部分卡片与整体分离。
· Pick up and move（拾取、移动）
拾取和移动手势允许用户在多张卡片中移动和重新选择卡片。
当移动卡片时，增加它的高度（适当加投影）。
别把卡片移到其他卡片后面。
不要让卡片把其他元素挡开。当一张卡片被拿起时，它会出现在所有元素的前面(除了应用程序栏和导航)。
· Scrolling（滚动）
高于最大卡高的卡内容被截断，不滚动，但可以通过扩展卡的高度来显示。卡可以扩展到屏幕的最大高度，在这种情况下，卡在屏幕内滚动。
Right：在手机上，卡片可以扩展到显示更多的内容，在屏幕上滚动，卡片中的内容不会滚动；Wrong：在手机上，卡不能内部滚动，因为它可能导致两个滚动条被显示。
在桌面上，卡片内容可以在卡片中展开和滚动。
四、操作
· 直接操作
卡片的主要动作区域通常是卡片本身，通常，卡片用来展示屏幕内容下，其中一个主题详情。
卡片底部的补充文本和操作
· 补充操作
溢出菜单包含相关操作。它们通常放置在卡的右上角或右下角。
溢出菜单通常位于卡的右上角或右下角。
UI控件
UI控件可以包含在卡中，以允许用户与卡的内容进行交互。UI控件的形式可以是滑块、对内容进行分级的星号、选项卡或按钮。
此卡包含可对内容进行评分的星号。
此卡在操作区域内包含选择选项卡。
· 附加操作
卡片可以支持多个操作，例如UI控件和溢出菜单。因为卡片是获取更详细信息的切入点，所以它们应该包含有限数量的操作。
Caution：卡片提供更可靠信息的入口。小心不要用多余的信息或行动过载卡片。
△ 焦点
当遍历卡上的焦点时，在移动到下一张卡之前访问每个焦点元素。
对于仅使用焦点遍历(使用D-pad和键盘)导航的用户，卡片应该有主操作或打开包含主操作和补充操作的新屏幕。
卡片的对焦遍历
五、卡片收藏
△ 用法
当多张卡片出现时，它们被组合成一个或多个集合。默认情况下，集合中的卡片是共面的，除非被拾起或拖动，否则它们有相同的静止高度。
△ 布局
组织卡片收集，使其易于使用。它们的布局影响着人们对它们的感知。
将卡片添加到集合时，第一项将自动定位在左上角。随后的卡片从左到右，从上到下排列。
· 可扫描的
若要使一组卡片可扫描，请将它们放置在一致的模式中。
Scannable cards
· 仪表盘
若要在屏幕上显示多个主题和功能，请使用仪表板式卡片集合。
仪表板式卡片收集
· 区别
要突出每张卡的个性、风格或新颖性，请使用带有非对称网格的卡片集合。
非对称网格中的卡片
△ 包含收藏
卡集合可以放在容器中，并在容器内滚动。
Right：卡集合可以在容器内水平滚动；Wrong：收集的容器不应该是卡片，容器的整个表面不应该是交互式的。
△ 筛选和排序
卡片收集可以通过多种方式进行筛选，包括按日期或字母顺序筛选。如果可以筛选集合，则筛选器必须应用于集合中的每一张卡。
筛选或排序选项应放置在卡片收集之外。
END.THANKS FOR YOUR READING~
如有不当，还请多多指教~
