导航栏图标风格（帮你全方位掌握导航栏设计知识点）
导航栏图标风格（帮你全方位掌握导航栏设计知识点）大多数用分隔线直接分割，但部分产品为了保持界面的干净整洁、减少无关信息的干扰，在无任何交互产生的情况下，导航栏与内容区域的元素间隔较远，利用空间留白自动形成视觉分割，当产生滚动交互后，留白不可控，就会在导航栏下方增加投影、分隔线或毛玻璃效果，进行视觉分割。导航栏在同一个应用中的高度、位置及其部分属性需具备统一性，这也是格式塔心理学中的「一致性」对UI设计的硬性要求。即便是大标题样式，那么底部标签栏（主结构、功能）所对应页面的导航栏也会遵循一致性要求。当然，部分只在首页设定大标题样式的应用除外。
四、内容区域的交互关联众所周知，导航栏最主要的作用是方便用户随时进行上一步或部分功能的下一步操作，帮助用户不迷路，但有时候，导航栏还能协助用户快速完成任务，以及交互后的内容管理、信息层级重新划分等。
1. 导航栏中的按钮点击交互
当用户与导航栏中的文字/图标按钮产生交互时，不用离开此页面就对内容进行管理并能即时反馈，例如增加、删除、分享等操作，协助用户快速完成任务。
2. 界面上滑，导航栏内容减少
随着界面的向上滑动，大标题、或带搜索功能且占据两行的大尺寸导航栏将恢复至常规尺寸，信息的数量、层级也将重新划分，以弱化导航栏吸引力的方式，减少对用户的干扰。
3. 界面上滑，导航栏内容增加
界面产生上滑交互后，原本常规样式的导航栏会自动增加信息内容。例如美团外卖，首屏上滑至一半时，将特色标签及筛选入口悬浮至导航栏，目的是为了帮助用户快速做出决策。
4. 导航栏与内容区域的信息分割
大多数用分隔线直接分割，但部分产品为了保持界面的干净整洁、减少无关信息的干扰，在无任何交互产生的情况下，导航栏与内容区域的元素间隔较远，利用空间留白自动形成视觉分割，当产生滚动交互后，留白不可控，就会在导航栏下方增加投影、分隔线或毛玻璃效果，进行视觉分割。
1. 同一应用中的相同点
导航栏在同一个应用中的高度、位置及其部分属性需具备统一性，这也是格式塔心理学中的「一致性」对UI设计的硬性要求。即便是大标题样式，那么底部标签栏（主结构、功能）所对应页面的导航栏也会遵循一致性要求。当然，部分只在首页设定大标题样式的应用除外。
