美文网首页
ionic 左右滑动切换tabs

ionic 左右滑动切换tabs

作者: 霸道总裁跟班 | 来源:发表于2017-06-22 14:15 被阅读0次

           这个问题研究很久,网上找了好多例子,都比较复杂,跟自己的需求不太吻合。在同事的帮助下(shanruimeng)终于搞定了这个问题。这个滑动仅限在安卓客户端,因为ios没有这样的操作习惯,如果你非要加在上面,也没关系,只要用户用着好就行。

    搞定这个效果总共有:

    首先在每个页面的<ion-content>里面添加代码on-swipe-left="changeTabRight()" on-swipe-right="changeTabLeft()”,如图1所示,保证每个页面都能监听每个页面的滑动效果。其他页面类似操作。

    图1

    然后在controller里面添加监听事件,添加依赖注入 $injector,$ionicViewSwitcher页面切换,

    添加changeTabRight方法。最后一行$ionicViewSwitcher.nextDirection("forward")可以使页面切换流畅,有滑动的效果。图2所示。

    图2

    至此,大功告成!

    左右滑动就可以切换了。

    相关文章

      网友评论

          本文标题:ionic 左右滑动切换tabs

          本文链接:https://www.haomeiwen.com/subject/zskfcxtx.html