当前位置:   article > 正文

【IOS-Debug】uniapp小程序打开APP原生页面_uniapp ios 小程序调用原生界面

uniapp ios 小程序调用原生界面
前言

APP里面的uniapp小程序要接入微信支付,但是支付的调起为实现统一管理是由APP原生调起支付,不是每个小程序自己实现。所以,支付完成的页面也是写在APP宿主原生页面的,涉及到小程序打开原生页面的跳转方式。

页面跳转方式

众所周知,常见的IOS页面跳转有presentpush两种。

前者弹出的视图是模态视图,由UIViewController管理的视图控制器堆栈。新弹出的页面可以看见上一个页面。

后者是由UINavigationController管理的视图控制器堆栈,打开新视图都入栈,调用之前的视图则需要出栈。在window下同时只能显示一个ViewController。

一、使用push跳转
  • 实现push跳转过程

为了实现新页面的全覆盖,我使用了push打开方式。为了保证小程序能push打开,修改APP宿主打开uniapp小程序的方式从默认DCUniMPOpenModePresent变成DCUniMPOpenModePush

小程序打开的配置代码:

  1. // 初始化小程序的配置信息对象
  2. DCUniMPConfiguration *configuration = [[DCUniMPConfiguration alloc] init];
  3. /**
  4. 修改打开方式present变成push
  5. */
  6. configuration.openMode = DCUniMPOpenModePush;
  7. // 配置启动小程序时传递的参数
  8. configuration.extraData = @{ @"arguments":@"Hello uni microprogram" };
  9. // 启动小程序
  10. [DCUniMPSDKEngine openUniMP:k_AppId configuration:configuration completed:^(DCUniMPInstance * _Nullable uniMPInstance, NSError * _Nullable error) {
  11. if (uniMPInstance) {
  12. // success
  13. } else {
  14. // error
  15. }
  16. }];

在小程序打开的时候,使用push方式打开。

  1. //第二个页面
  2. PayResultVC *vc=[PayResultVC new];
  3. //当前小程序页面
  4. / 小程序打开状态,调用此方法可获取小程序对应的 DCUniMPViewController 实例
  5. UIViewController *currentVC=[DCUniMPSDKEngine getUniMPViewController];
  6. [currentVC.navigationController pushViewController:vc animated:YES];
  • push方式打开原生页面的优缺点:

优点:保证了全部新页面都是通过由UINavigationController管理,保证了整个APP打开页面的统一性。

缺点:uniapp通过push方式打开的小程序侧滑退出会出现多层标题栏。如图:

  • 解决方案(并未解决,更换present打开)
  • 解决方案一:

  • 翻阅官方文档,通过uniapp代码修改小程序控制器标题栏显隐,结果侧滑还是会出现两个按钮。

    1. /// 注意:只有通过 push 的方式打开小程序才生效
    2. /// @param hidden 是否隐藏
    3. + (void)whenUniMPCloseSetNavigationBarHidden:(BOOL)hidden;
    4. /// 设置 push 打开方式小程序内是否自动控制原生导航栏的显隐(默认控制)
    5. /// @param isControl Bool
    6. + (void)setAutoControlNavigationBar:(BOOL)isControl;

    官方代码文档地址:DCUniMPSDKEngine | uni小程序SDK

  • 解决方案二:

  • 修改项目控制页面跳转的UINavigationController,判断若是小程序实例则隐藏,Debug模式下发现小程序打开未走过UINavigationController

  • 方案失败。

二、使用present跳转
  • 实现present跳转过程

默认打开uniapp的方式,不修改。

打开原生APP页面代码:

  1. //第二个页面
  2. PayResultVC *vc=[PayResultVC new];
  3. //当前小程序页面
  4. / 小程序打开状态,调用此方法可获取小程序对应的 DCUniMPViewController 实例
  5. UIViewController *currentVC=[DCUniMPSDKEngine getUniMPViewController];
  6. [currentVC presentModalViewController:vc animated:YES];
  • present方式打开原生页面的优缺点:
  • 优点:没有push打开小程序侧滑出现的多个导航栏Bug。

    缺点:打开的新页面无法全部覆盖上一层页面,有空隙。如图:

​​​​​​​

  • 修改方式

修改跳转模式,变成全屏模式。代码:

  1. //第二个页面
  2. PayResultVC *vc=[PayResultVC new];
  3. //模式要加在新打开的页面
  4. vc.modalPresentationStyle=UIModalPresentationFullScreen;
  5. //当前小程序页面
  6. / 小程序打开状态,调用此方法可获取小程序对应的 DCUniMPViewController 实例
  7. UIViewController *currentVC=[DCUniMPSDKEngine getUniMPViewController];
  8. [currentVC presentModalViewController:vc animated:YES];
修改结果:

可以全部覆盖上级页面,也没有多个导航栏的Bug。

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/凡人多烦事01/article/detail/281037
推荐阅读
相关标签
  

闽ICP备14008679号