HBuilder安卓应用如何实现左右滑动,切换界面!

分类：HTML5+

本人想实现类似于微信那种,但不一定要微信那么玄,只想简单实现通过手势向左滑动,就打开左边界面,向右滑动就打开显示右边界面!本人新手,公司正在做这方面的开发,多谢各位大神支招了!

2014-09-09 17:22 负责人:无分享

6 个回复

DCloud_UNI_CHB

有单页拖div和多webview拖webview这2种方法。多webview使用webview的drag方法。
hello mui里有示例中的offcavas (侧滑导航)示例

滔滔江水 (作者)

界面整体下面有个选项卡,我个人认为应该是,添加左右滑动事件,实现中间界面切换,我不太清楚,左右滑动事件,怎么调用,或者mui有例子没,麻烦给说下!你的建议我已经看过了,里面是策划导航,本人可能才疏学浅,没有想出更有效的解决办法,还望指点,非常感谢了

2014-09-10 09:41
DCloud_UNI_CHB

你是要局部滑动，不是整体页面滑动吧？看看hello mui示例中的grid-->左右滑动分页样式，是不是你想要的。

2014-09-10 10:58
滔滔江水 (作者)

回复 DCloud_UNI_CHB:你说的这个,能自动滑动,麻烦问下,你知道左右滑动监听事件不

2014-09-10 13:22
DCloud_UNI_CHB

回复滔滔江水:swipeleft和swiperight

2014-09-10 15:03
blucee

这里能不能用子页面解决？

2015-10-31 14:58

Sky_

那个是局部段落滑动，大的整个页面滑动，没有专门的控件

超仔爱生态闭环

我认为比较好的两种方式：
1.singlePage模式;
就是你所有的页面都整合成一个页面，h5监听手势事件，ajax请求不同的内容即可，通过js和css协作显示所需模板。
2.多webview模式;
native监听手势事件，从而调用不同的webview，webview中已存在所需页面，最终实现。

blucee

能教下？

2015-10-31 15:25
h***@163.com

同求？

2016-05-24 10:36

window.addEventListener("swiperight", function(e) {  
                        //默认滑动角度在-45度到45度之间，都会触发右滑菜单，为避免误操作，可自定义限制滑动角度；  
                        if (Math.abs(e.detail.angle) < 30) {  
                            self.close();  
                        }  
                    });

官方示例中的代码，已测试可用

咆哮的企鹅 - 敲代码？慢性自杀：植物人

可参考 hello mui 实例中的segment（分段选择）
第二项可拖动选项卡

橘子好酸啊

关于singlePage模式，思路是使用div分割页面，推荐一个js插件，Swiper.js，很好用，可以实现整页翻动效果并支持嵌套，性能页还不错，对于接口比较开放。

该问题目前已经被锁定, 无法添加新回复

HBuilder安卓应用如何实现左右滑动,切换界面!

6 个回复

公告

相关问题

HBuilder安卓应用如何实现左右滑动,切换界面!

与内容相关的链接

6 个回复

公告

相关问题