Ionic項目中要用到segment恰响，官方在2.0的版本中有提供凫佛，但1.3的版本下沒有，只有buttons列表关筒，在GitHub上找了一下，找到一個ti-segmented-control,GitHub,因為ionic-material改掉了nav-bar的樣式杯缺，所以在這里面又改了一下css樣式
首先蒸播，安裝
$ bower install ti-segmented-control
接下來在index.html中加入
<!-- segment -->
<script src="lib/ti-segmented-control/dist/ti-segmented-control.js"></script>
在app.js中加入
angular.module('starter', ['ionic', 'ionic-material', 'starter.controllers', 'starter.services', ....,'ti-segmented-control'])
在ion-nav-title中加入
<ion-nav-title>
<ti-segmented-control on-select="buttonClicked($index)">
<ti-segmented-control-button class="button-positive" title="'匯總'"></ti-segmented-control-button>
<ti-segmented-control-button class="button-positive" title="'項目匯總'" selected></ti-segmented-control-button>
</ti-segmented-control>
</ion-nav-title>
最后改一下css樣式
.bar .button{
max-width: 100%;
box-shadow: 0 0 0 0;
}
.button-bar{
padding-top: 10px;
box-shadow:0 0 0 0;
}
.button.button-positive.button-outline{
background: white;
line-height: 25px;
font-weight: bold;
font-size: 16px;
}
好了，最后效果如下
屏幕快照 2016-10-09 下午2.07.53.png
