自定义的导航栏如何增加右滑动返回的手势

这几天产品增加了个新需求,要求增加滑动返回的手势。安卓上有返回按钮,但是iOS上没有返回按钮,增加一个返回的手势可以较大的提高用户体验。iOS7刚出来的时候系统增加了滑动返回手势,感觉特别好,但是发现把导航栏隐藏,自定义的滑动返回手势不好使。于是按照这个帖子(http://www.gowhich.com/blog/view/id/383)写的如何打开系统的滑动返回,并且如何避免出现的问题,结果发现不好使,在一级界面滑动,依然会出现画面卡住的问题。


垃圾方案一:

后来找各种第三方,https://github.com/Coneboy-k/KKNavigationController,这个导航栏原理是截了张图,放到内存里,刚开始觉得挺好,后来出现了一些问题,如卡顿。而且页面如果过多的话,内存肯定会增加不少。对于我这个完美主义者是不能接受的。

垃圾方案二:

这个帖子不知道大家看了没,http://www.cocoachina.com/ios/20150401/11459.html#0-tsina-1-2192-397232819ff9a47a7b7e80a40613cfe1。这里面第一种方法用起来有个弊端,滑动返回的过程中竟然会触发button的事件,而且屏幕返回的过程中根手指不在一起,感觉略怪。第二种方法简单些,但用了私有API,审核能过嘛?


下面完美的解决方案来了大笑,不超过10行代码,以上所有问题全部解决。


直接在一级界面的viewWillAppear里注册delegate:

    self.navigationController.interactivePopGestureRecognizer.delegate = self;

然后在一级界面的viewWillDisAppear里注销delegate(此句一定要写,否则会出其他bug):

    self.navigationController.interactivePopGestureRecognizer.delegate = nil;



然后在该界面实现代理方法:

#pragma mark - UIGestureRecognizer Delegate
- (BOOL)gestureRecognizerShouldBegin:(UIGestureRecognizer *)gestureRecognizer
{
    //判断是否是一级视图,若是则关闭滑动返回手势
    if (self.navigationController.viewControllers.count == 1)    {
        return NO;
    }
    else
    {
        return YES;
    }
}

然后万事具备了。没有出现上面帖子中的任何问题。


参考:

http://blog.csdn.net/wmqi10/article/details/16850479

其他参考:

http://ju.outofmemory.cn/entry/103566

https://github.com/molon/MLTransition

https://github.com/singro/SCNavigation


Demo下载:https://github.com/yuedong56/GestureBack

QQ群:172158202,入群请注明求滑动返回的demo。

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
在Uniapp中,可以通过配置自定义导航栏来实现自定义返回按钮。首先,在pages.json文件中将导航栏样式设置为自定义,如下所示: ``` { "path": "pages/shop/shop", "style": { "navigationBarTitleText": "", "enablePullDownRefresh": false, "navigationStyle": "custom" } } ``` 然后,在页面中处理返回按钮的逻辑。可以在onBackPress函数中判断返回按钮的来源,如果来源是backbutton,则执行相应的业务逻辑: ``` onBackPress(e) { if (e.from === "backbutton") { if (uni.getStorageSync('isLowAccount')) { uni.redirectTo({ url: '../wallet/wallet' }); return true; // 返回true表示不执行默认的返回行为 } } } ``` 需要注意的是,目前只能在页面中处理自定义导航栏返回按钮,而不是在自定义组件中直接配置该函数。只有当返回值为true时,才表示不执行默认的返回行为,否则均会执行默认的返回行为。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *3* [uni-app监听处理H5/App默认返回事件](https://blog.csdn.net/w_minx/article/details/109134323)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] - *2* [【uniapp】小程序自定义一个通用的返回按钮组件](https://blog.csdn.net/ONLYSRY/article/details/126178045)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值