想做用户引导？看谷歌Material Design 的官方教程是怎么做的！(9)

居中对齐的文本和交互元素放置在插图之下。

△  移动端：竖向显示

△  平板端：竖向显示

移动和平板端横向显示

左对齐的文本和交互元素放置在插图的右侧，并垂直居中。

△  移动端：横向显示

△  平板端：横向显示

桌面端

将插图、文本和交互元素放在一个居中对齐的卡片中。在卡片旁边显示“上一页”和“下一页”按钮，并在它的下方放置分页指示器。

△  桌面端

可穿戴和TV设备上的启动页使用的是不同的交互方法，所以需要以不同的方式进行设计。

各平台尺寸标准

• 移动和平板端上竖向显示

文本和UI在页面中居中对齐。屏幕底部的上方生成24dp内边距（padding）。

1.大标题：24sp，行距32sp

2.副标题：15sp，行距24dp

3.32sp行高

4.按钮顶部到文本中心的距离：56dp（空间只允许存在1- 3 行文本）

5.垂直方向上24dp内边距

移动和平板端上横向显示

文本和UI对齐至插画的左边缘，并垂直居中

1. 大标题：24sp，行距32sp

2. 副标题：15sp，行距24dp

3. 32sp行高

4. 按钮顶部到文本中心的距离：56dp（空间只允许存在1- 3 行文本）

5. 垂直方向上24dp内边距

桌面端

1. 大标题：24sp，行距32sp

2. 副标题：16sp，行距24dp

3. 32sp行高

4. 按钮顶部到文本中心的距离：56dp（空间只允许存在1- 3 行文本）

5. 图像距离页码圆点：24dp

6. 图像距离箭头：48dp

（编辑：ASP站长网）