4.4.3 导航栏
导航栏组件实现一排显示多个按钮（导航项），且均匀地撑满屏幕的宽度，其中有且只有一个导航项显示为选中（激活）状态。组件结构和运行效果如图4-32所示。
图4-32 导航栏组件
1、添加/删除导航项
在属性栏的设置区域中，单击“添加导航项”按钮，给导航栏添加新的导航项。用鼠标右键单击要删除的导航项，在弹出的菜单中，选择删除命令，即可删除导航项。
2、基础属性
导航栏组件提供3个基础属性：
l 默认激活项：设置打开页面时，默认选中哪个导航项，默认选中第1个导航项
l 是否自动触发一次导航切换：设置打开页面时，是否执行一次导航切换事件和导航项激活事件，默认为是
l 自定义激活样式：设置一个自定义样式，用作导航项的选中样式
导航栏提供1个属性：显示名称。用于设置导航项上显示的文本。
3、事件
导航栏组件提供1个事件：导航切换事件，在导航项切换时触发。导航项切换包括单击导航项和调用导航栏的“激活”操作
导航项提供2个事件：导航激活事件和单击事件。导航激活事件在切换导航项时触发；单击事件在单击导航项时触发。
4、样式
导航栏组件提供一个特有样式：激活样式，用于设置导航项的选中样式。
5、操作
导航栏组件提供一个操作：激活，用于选中导航项并触发导航栏组件的导航切换事件。
6、示例
示例一：切换导航栏用于刷新数据
在页面中添加导航栏组件，默认有3个导航项，再添加2个导航项。将导航项的显示名称属性依次修改为“全部”、“待付款”、“待发货”、“待收货”和“已完成”。自定义激活样式，在自定义样式对话框中定义c-navbar样式，并选择该样式为激活样式，CSS代码如下。
color:#fa6868;
border-bottom:1px solid #fa6868 !important;
在每个导航项的导航激活事件中，设置操作组合，先设置过滤条件，再刷新数据集。
示例二：切换导航栏用于切换页面
需要配合滑块视图组件使用。在页面中添加导航栏组件和滑块视图组件。将导航项的显示名称属性依次修改为“第一页”、“第二页”和“第三页”。
在每一个导航项的单击事件中调用滑块视图的跳转到操作，并输入滑块项的序号，注意序号从0开始。这样设置后，可以实现单击某个导航项，滑块项会跟着切换。
设置滑块视图的当前页改变事件，在该事件中可以获得当前滑块项序号，根据序号调用导航项的激活操作。这样设置后，可以实现滑动滑块项时，激活相应的导航项。