ionic 左右滑动切换tabs

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

搞定这个效果总共有:

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


图1

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

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


图2

至此,大功告成!

左右滑动就可以切换了。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 173,778评论 25 709
  • 发现 关注 消息 iOS 第三方库、插件、知名博客总结 作者大灰狼的小绵羊哥哥关注 2017.06.26 09:4...
    肇东周阅读 12,262评论 4 61
  • 什么是Feed流,顾名思义,Feed是喂养的意思,你想吃什么,就喂给你什么,典型的例子就是微博、知乎的首页,以及各...
    更好时代阅读 17,046评论 3 21
  • 【今日话题】如果让你用三个关键词总结过去三个月的自己,你会用哪三个词,为什么? 【平庸】 回想三个月前的...
    面包不打烊阅读 169评论 3 12
  • 寒蝉已止鸣 所有的一切都归于宁静了 走入这一季 已过去的纷扰终将被掩埋 心静了 硕果显耀树枝的摇曳 开始不屑于 姹...
    雨韩阅读 357评论 12 6