欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  移动技术

iOS自定义导航条实现侧滑功能(含Native和Flutter)

程序员文章站 2022-03-21 07:55:20
1、基本页面iOS7之后是有侧滑返回手势功能的,因此直接触发系统的处理方法就行。当前控制器是根控制器时,不可以侧滑返回,所以不能使其触发手势。在项目的baseVC中,添加以下代码:@interface BaseViewController ()@end- (void)viewWillAppear:(BOOL)animated { [super viewWillAppear:animated]; if (s...

1、基本页面

iOS7之后是有侧滑返回手势功能的,因此直接触发系统的处理方法就行。当前控制器是根控制器时,不可以侧滑返回,所以不能使其触发手势。在项目的baseVC中,添加以下代码:


@interface BaseViewController ()<UIGestureRecognizerDelegate>
@end

- (void)viewWillAppear:(BOOL)animated {
    [super viewWillAppear:animated];
    if (self.navigationController.viewControllers.count > 1) {
        self.navigationController.interactivePopGestureRecognizer.enabled = YES;
        self.navigationController.interactivePopGestureRecognizer.delegate = self;
    }
}

#pragma mark - UIGestureRecognizerDelegate
- (BOOL)gestureRecognizerShouldBegin:(UIGestureRecognizer *)gestureRecognizer {
    return self.navigationController.childViewControllers.count > 1;
}

2、手势冲突:UIScrollView页面

scrollView会拦截baseVC的手势,实现自己的滑动效果,因此我们添加UIScrollView的手势的分类来处理手势冲突。网上也有很多处理方式,最终选择了分类的方式的原因是当前已经很成型的项目,分类的优势在于不需要修改每个类,也不需要重新自定义一个scrollView的基类,然后修改scrollView继承基类。这时候就体现了基类在项目中的优势~

- (BOOL)gestureRecognizer:(UIGestureRecognizer *)gestureRecognizer
    shouldRecognizeSimultaneouslyWithGestureRecognizer:(UIGestureRecognizer *)otherGestureRecognizer {
    if ([self panBack:gestureRecognizer]) {
        return YES;
    }
    return NO;
}

- (BOOL)panBack:(UIGestureRecognizer *)gestureRecognizer {
    CGFloat target = 50.0;//自定义一个触发范围
    if (gestureRecognizer == self.panGestureRecognizer) {
        UIPanGestureRecognizer *pan = (UIPanGestureRecognizer *)gestureRecognizer;
        CGPoint point = [pan translationInView:self];
        UIGestureRecognizerState state = gestureRecognizer.state;
        if (UIGestureRecognizerStateBegan == state || UIGestureRecognizerStatePossible == state) {
            //获取手势在屏幕上的位置
            CGPoint windowLocation = [gestureRecognizer locationInView:self.window];
            CGFloat windowLocationX = windowLocation.x;
            if (point.x > 0 && windowLocationX < target) {
                return YES;
            }
        }
    }
    return NO;
}

- (BOOL)gestureRecognizerShouldBegin:(UIGestureRecognizer *)gestureRecognizer {
    if ([self panBack:gestureRecognizer]) {
        return NO;
    }
    return YES;
}

3、Flutter页面,继承了baseViewController

由于是混合开发,且Flutter的基类页面继承了baseVC,因此Flutter的页面都承载在Flutter的页面中,侧滑的时候会导致Flutter二级页面会直接回到Native页面。

通过继承NavigatorObserver的来监测didPop和didPush,通过invokeMethod定义的方式通知原生,设置当前页面是否允许系统的侧滑。

Flutter代码:

class CustomNavigatorObserver extends NavigatorObserver {
  @override
  void didPop(Route<dynamic> route, Route<dynamic> previousRoute) {
    MessageChannel().canPopFlutterPage(route.navigator.canPop());
  }

  @override
  void didPush(Route<dynamic> route, Route<dynamic> previousRoute) {
    MessageChannel().canPopFlutterPage(!route.isFirst);
  }
}

Native代码:

   [self.baseChannel setMethodCallHandler:^(FlutterMethodCall * _Nonnull call, FlutterResult  _Nonnull result) {
        @strongify(self)
        NSString *method = call.method;
        if ([method isEqualToString:@"canPopFlutterPage"]) {
     self.viewController.navigationController.interactivePopGestureRecognizer.enabled = !canPop;
            result(nil);
        }

Flutter中didPop返回上一页时route.navigator.canPop为YES的时候,原生就禁止侧滑。反之,didPush如果是route.isFirst是Flutter的第一个页面,原生就开启侧滑。

本文地址:https://blog.csdn.net/pearl0922/article/details/107191891