【Material Design视觉设计语言】UI组件设计（六）：分隔线

作者：郭孝星
微博：郭孝星的新浪微博
邮箱：[email protected]
博客：http://blog.csdn.net/allenwells
Github：https://github.com/AllenWells

【Material Design视觉设计语言】章节列表

【Material Design视觉设计语言】开篇
【Material Design视觉设计语言】Material Design设计概述
【Material Design视觉设计语言】应用布局设计
【Material Design视觉设计语言】应用自适应布局
【Material Design视觉设计语言】应用样式设计
【Material Design视觉设计语言】应用动画设计
【Material Design视觉设计语言】UI组件设计（一）：按钮
【Material Design视觉设计语言】UI组件设计（二）：卡片
【Material Design视觉设计语言】UI组件设计（三）：纸片
【Material Design视觉设计语言】UI组件设计（四）：表格
【Material Design视觉设计语言】UI组件设计（五）：提示框
【Material Design视觉设计语言】UI组件设计（六）：分隔线
【Material Design视觉设计语言】UI组件设计（七）：网格
【Material Design视觉设计语言】UI组件设计（八）：列表
【Material Design视觉设计语言】UI组件设计（九）：菜单
【Material Design视觉设计语言】UI组件设计（十）：选择器
【Material Design视觉设计语言】UI组件设计（十一）：进度条
【Material Design视觉设计语言】UI组件设计（十二）：滑块
【Material Design视觉设计语言】UI组件设计（十三）：Toast
【Material Design视觉设计语言】UI组件设计（十四）：Tabs
【Material Design视觉设计语言】UI组件设计（十五）：文本框

分隔线 (Dividers) 主要用于管理和分隔列表和页面布局内的内容，以便让内容生成更好的视觉效果及空间感。

一 分隔线的功能

分隔线主要用来分隔没有锚点的项。

当在列表中没有像头像或者是图标之类的锚点元素时，单靠空格并不足以用于区分每个数据项。这种情况下使用一个等屏宽的分隔线就会帮助区别开每个数据项目。使其它看起来更独立和更有韵味。

在使用分隔的子标题时，可以将分隔线置于子标题之上，可以加强子标题与内容关联度。

二 分隔线的类型

2.1 等屏宽分隔线

等屏宽分隔线或以用于分隔列表中的每个数据项或者是页面布局中的不同类型的内容。

2.2 内凹分隔线

在有锚点元素（头像或者是图标）并且有关键字的标题列中，我们可以使用内凹分隔线。