Flutter iOS 集成使用 flutter boost

news2024/11/26 22:17:52

在 Flutter项目中集成完 flutter boost,并且已经使用了 flutter boost进行了路由管理,这时如果需要和iOS混合开发,这时就要到 原生端进行集成。

注意:之前建的项目必须是 Flutter module项目,并且原生项目和flutter module项目在同一个文件夹下面

下面是原生端集成 flutter boost的步骤:

  • 在原生项目的 Podfile文件中添加如下代码
# Uncomment the next line to define a global platform for your project
platform :ios, '12.0'


flutter_application_path = '../my_flutter'
load File.join(flutter_application_path, '.ios', 'Flutter', 'podhelper.rb')


target 'FlutterList' do
  # Comment the next line if you don't want to use dynamic frameworks
  use_frameworks!

  # Pods for FlutterList
  install_all_flutter_pods(flutter_application_path)
  

  pod 'Masonry', '1.0.2'
  
end


post_install do |installer|
  flutter_post_install(installer) if defined?(flutter_post_install)
end

填写完后指向 pod install。此时项目的pod目录下面就会出现 flutter相关的库
在这里插入图片描述
到此就完成 flutter混合开发的集成工作,接下来就是需要 编写使用代码

  • 编写混合开发代码
    这里没有跟着flutter boost 官网进行集成 https://github.com/alibaba/flutter_boost/blob/master/docs/install.md 创建代码,稍微进行了些改进。

  • HYFlutterBoostDelegate

  • HYFlutterViewContainer

  • HYFlutterViewController
    分别创建了以上代码,并且在AppDelegate 中使用 FlutterBoost

  • HYFlutterBoostDelegate

import Foundation
import flutter_boost

class HYFlutterBoostDelegate: NSObject, FlutterBoostDelegate {
    
    ///您用来push的导航栏
    var navigationController:UINavigationController? {
        return UINavigationController.topNavigationController()?.navigationController
    }

    ///用来存返回flutter侧返回结果的表
    var resultTable:Dictionary<String,([AnyHashable:Any]?)->Void> = [:];
    
    func pushNativeRoute(_ pageName: String!, arguments: [AnyHashable : Any]!) {

        //可以用参数来控制是push还是pop
        let isPresent = arguments["isPresent"] as? Bool ?? false
        let isAnimated = arguments["isAnimated"] as? Bool ?? true
        //这里根据pageName来判断生成哪个vc,这里给个默认的了
        let targetViewController = UIViewController()
        
        // 这里也可以使用路由进行跳转
        
        if(isPresent){
            self.navigationController?.present(targetViewController, animated: isAnimated, completion: nil)
        }else{
            self.navigationController?.pushViewController(targetViewController, animated: isAnimated)
        }
    }
    
    func pushFlutterRoute(_ options: FlutterBoostRouteOptions!) {
        let vc:HYFlutterViewController = HYFlutterViewController()
        vc.setName(options.pageName, uniqueId: options.uniqueId, params: options.arguments,opaque: options.opaque)
        vc.hidesBottomBarWhenPushed = true
        //对这个页面设置结果
        resultTable[options.pageName] = options.onPageFinished;
        if let nav = navigationController  {
            nav.pushViewController(vc, animated: true)
        }
        
    }
    
    
    func popRoute(_ options: FlutterBoostRouteOptions!) {
        //如果当前被present的vc是container,那么就执行dismiss逻辑
        if let vc = self.navigationController?.presentedViewController as? HYFlutterViewController, vc.uniqueIDString() == options.uniqueId{
            
            //这里分为两种情况,由于UIModalPresentationOverFullScreen下,生命周期显示会有问题
            //所以需要手动调用的场景,从而使下面底部的vc调用viewAppear相关逻辑
            if vc.modalPresentationStyle == .overFullScreen {
                
                //这里手动beginAppearanceTransition触发页面生命周期
                self.navigationController?.topViewController?.beginAppearanceTransition(true, animated: false)
                
                vc.dismiss(animated: true) {
                    self.navigationController?.topViewController?.endAppearanceTransition()
                }
            }else{
                //正常场景,直接dismiss
                vc.dismiss(animated: true, completion: nil)
            }
        }else{
            self.navigationController?.popViewController(animated: true)
        }
        //否则直接执行pop逻辑
        //这里在pop的时候将参数带出,并且从结果表中移除
        if let onPageFinshed = resultTable[options.pageName] {
            onPageFinshed(options.arguments)
            resultTable.removeValue(forKey: options.pageName)
        }
    }
    
}
  • HYFlutterViewContainer
#import <flutter_boost/FlutterBoost.h>

NS_ASSUME_NONNULL_BEGIN

@interface HYFlutterViewContainer : FBFlutterViewContainer

@end

NS_ASSUME_NONNULL_END
#import "HYFlutterViewContainer.h"

@interface HYFlutterViewContainer (){
    UINavigationBar *_bar;
}

@property (nonatomic)BOOL navigationBarHidden;
@property (nonatomic, strong) FBVoidCallback removeEventCallback;

@end

@implementation HYFlutterViewContainer

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view.
}

- (void)viewWillAppear:(BOOL)animated {
    [super viewWillAppear:animated];
    [self.navigationController setNavigationBarHidden:YES animated:animated];
}

/// 设置这个container对应的从flutter过来的事件监听
-(void)setupEventListeningFromFlutter{
    __weak typeof(self) weakSelf = self;
    // 为这个容器注册监听,监听内部的flutterPage往这个容器发的事件
    self.removeEventCallback = [FlutterBoost.instance addEventListener:^(NSString *name, NSDictionary *arguments) {
        __strong typeof(self) strongSelf = weakSelf;
        //事件名
        NSString *event = arguments[@"event"];
        //事件参数
        NSDictionary *args = arguments[@"args"];
        
        if ([event isEqualToString:@"enablePopGesture"]) {
            // 多page情况下的侧滑动态禁用和启用事件
            NSNumber *enableNum = args[@"enable"];
            BOOL enable = [enableNum boolValue];
            //右滑控制
//            strongSelf.fd_interactivePopDisabled = !enable;
        }
    } forName:self.uniqueId];
}

- (BOOL)navigationBarHidden {
    return YES;
}

- (UINavigationBar *)navBar
{
    if (!_bar) {
        _bar = [UINavigationBar new];
    }
    return _bar;
}

- (BOOL)shouldAutorotate
{
    return NO;
}

- (UIInterfaceOrientationMask)supportedInterfaceOrientations
{
    return UIInterfaceOrientationMaskPortrait;
}


@end
  • HYFlutterViewController
#import <UIKit/UIKit.h>
#import "HYFlutterViewContainer.h"


@interface HYFlutterViewController : UIViewController

@property (nonatomic, strong) HYFlutterViewContainer *container;

- (NSString *)uniqueIDString;

- (void)setName:(NSString *)name uniqueId:(NSString *)uniqueId params:(NSDictionary *)params opaque:(BOOL) opaque;

@end

#import "HYFlutterViewController.h"
#import <Masonry/Masonry.h>
#import "UINavigationController+HY.h"


@interface HYFlutterViewController ()

@end

@implementation HYFlutterViewController


- (void)setName:(NSString *)name uniqueId:(NSString *)uniqueId params:(NSDictionary *)params opaque:(BOOL) opaque {
    _container = [HYFlutterViewContainer new];
    [_container setName:name uniqueId:uniqueId params:params opaque:opaque];
}


- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view.
    
    // 隐藏导航栏
    [self.container.navigationController setNavigationBarHidden:YES animated:YES];
    
    [self addChildViewController:_container];
    [_container didMoveToParentViewController:self];
    
    [self.view addSubview:_container.view];
    [_container.view mas_makeConstraints:^(MASConstraintMaker *make) {
        make.edges.mas_equalTo(UIEdgeInsetsZero);
    }];
}



- (NSString *)uniqueIDString {
    return self.container.uniqueIDString;
}

- (void)dealloc {
    [_container removeFromParentViewController];
    [_container didMoveToParentViewController:nil];
}

@end

  • AppDelegate
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
    HYFlutterBoostDelegate* delegate = [[HYFlutterBoostDelegate alloc]init];
    
    [FlutterBoost.instance setup:application delegate:delegate callback:^(FlutterEngine *engine) {
        NSLog(@"FlutterBoost 开始操作");
        
    }];
    
    self.window = [[UIWindow alloc]initWithFrame:[UIScreen mainScreen].bounds];
    self.window.backgroundColor = [UIColor whiteColor];
    
    ViewController* VC = [[ViewController alloc]init];
    UINavigationController *nav = [[UINavigationController alloc] initWithRootViewController:VC];

    self.window.rootViewController = nav;
    [self.window makeKeyAndVisible];
    
    return YES;
}

使用 Flutter boost进行调转

- (void)btnClick:(UIButton *)btn {
    FlutterBoostRouteOptions* option = [[FlutterBoostRouteOptions alloc]init];
    option.pageName = @"/";
    [[[FlutterBoost instance] plugin].delegate pushFlutterRoute:option];
}

到此flutter boost原生交互使用结束,此时进到flutter界面导航是没有左侧的返回按钮的,这需要自己处理。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/844491.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

CorelDRAW2023矢量制图支持Windows和macOS系统安装使用

CorelDRAW Graphics Suite - 矢量制图专为企业打造的矢量设计作图软件CorelDRAW Graphics Suite套装&#xff0c;支持Windows和macOS系统安装使用。使用 CorelDRAW Graphics Suite 2023&#xff0c;打破创意障碍&#xff0c;以自己的风格进行自由创作。与全球数百万仰赖 CorelD…

睡眠助手/白噪音/助眠夜曲微信小程序源码 附教程

简介&#xff1a; 睡眠助手/白噪音/助眠夜曲微信小程序源码 附教程 支持分享海报 支持暗黑模式 包含了音频数据 最近很火的助眠小程序&#xff0c;前端vue&#xff0c;可以打包H5&#xff0c;APP&#xff0c;小程序 后台可以设置流量主广告&#xff0c;非常不错的源码 代码完…

Linux操作系统知识点总结(二)

总结&#xff08;一&#xff09;链接Linux操作系统知识点总结&#xff08;一&#xff09;&#xff08;附VMware、CentOS以及finalshell的安装教程&#xff09;_你好&#xff0c;明天&#xff0c;&#xff0c;的博客-CSDN博客 43. 由于虚拟机的 Linux系统的IP地址是通过DHCP服务…

前端CSS文字阴影text-shadow记录

前端CSS文字阴影text-shadow记录 一、文字阴影 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><title>Doc…

【基于IDEA + Spark 3.4.1 + sbt 1.9.3 + Spark MLlib 构建逻辑回归鸢尾花分类预测模型】

逻辑回归进行鸢尾花分类的案例 背景说明&#xff1a; 基于IDEA Spark 3.4.1 sbt 1.9.3 Spark MLlib 构建逻辑回归鸢尾花分类预测模型&#xff0c;这是一个分类模型案例&#xff0c;通过该案例&#xff0c;可以快速了解Spark MLlib分类预测模型的使用方法。 依赖 ThisBui…

“算法详解”系列第3卷贪心算法和动态规划出版

“算法详解”系列图书共有4卷&#xff0c;目前1到3卷已经出版。最新出版的是第3卷—贪心算法和动态规划。 算法详解 卷3 贪心算法和动态规划 “算法详解”系列图书共有4卷&#xff0c;本书是第3卷—贪心算法和动态规划。其中贪心算法主要包括调度、最小生成树、集群、哈夫曼编…

vue+vite线上环境地址和开发环境配置方式

vuevite线上环境地址和开发环境配置方式 第一种(放飞自我写法) 说明:后端已解决跨域的情况下配置线上部署访问地址和开发时候地址 java解决跨域代码: Configuration public class WebMvcConfig implements WebMvcConfigurer {Overridepublic void addCorsMappings(CorsRegistr…

程序员编写文档的 10 个技巧

编写好的文档在软件开发领域具有重大意义。文档是概述特定问题陈述、方法、功能、工作流程、架构、挑战和开发过程的书面数据或指令。文档可以让你全面了解解决方案的功能、安装和配置。 文档不仅是为其他人编写的&#xff0c;也是为自己编写的。它让我们自己知道我们以前做过什…

初识redis——分布式系统概念

概念 Redis&#xff08;Remote Dictionary Server )&#xff0c;即远程字典服务&#xff0c;是一个开源的使用ANSI C语言编写、支持网络、可基于内存亦可持久化的日志型、Key-Value数据库&#xff0c;并提供多种语言的API。 最初redis用来作为消息中间件&#xff0c;现在更多…

Java基础入门篇——IDEA开发第一个入门程序(五)

一、IDEA层级结构分类 IntelliJ IDEA的项目结构主要分为以下几个层级&#xff1a; Project&#xff1a; 项目Module: 模块Package: 包Class&#xff1a; 类 一个项目里面可以有多个模块&#xff0c;一个模块里面又可以有多个包&#xff0c;而每个包又可以存放多个类文件。比…

概念解析 | 生成式与判别式模型在低级图像恢复与点云重建中的角力:一场较量与可能性探索

注1:本文系“概念解析”系列之一,致力于简洁清晰地解释、辨析复杂而专业的概念。本次辨析的概念是:生成式模型与判别式模型在低级图像恢复/点云重建任务中的优劣与特性。 生成式与判别式模型在低级图像恢复与点云重建中的角力:一场较量与可能性探索 1. 背景介绍 机器学习…

吐血整理,手机App测试Monkey测试实战总结(最详细)

目录&#xff1a;导读 前言一、Python编程入门到精通二、接口自动化项目实战三、Web自动化项目实战四、App自动化项目实战五、一线大厂简历六、测试开发DevOps体系七、常用自动化测试工具八、JMeter性能测试九、总结&#xff08;尾部小惊喜&#xff09; 前言 Monkey是什么&…

SpringBoot 依赖管理和自动配置---带你了解什么是版本仲裁

&#x1f600;前言 本篇博文是关于SpringBoot 依赖管理和自动配置&#xff0c;希望能够帮助到您&#x1f60a; &#x1f3e0;个人主页&#xff1a;晨犀主页 &#x1f9d1;个人简介&#xff1a;大家好&#xff0c;我是晨犀&#xff0c;希望我的文章可以帮助到大家&#xff0c;您…

EtherCAT转EtherCAT网关西门子为什么不支持ethercat

大家好&#xff0c;今天要和大家分享一款神器——捷米JM-ECAT-ECAT通讯网关&#xff01;这款网关有什么厉害的呢&#xff1f;且听我慢慢道来。 首先&#xff0c;JM-ECAT-ECAT是一款自主研发的ETHERCAT从站功能的通讯网关。那什么是ETHERCAT呢&#xff1f;简单来说&#xff0c;…

Android, 笔记+课表的app实现

NoteSchedule: 笔记课表&#xff0c;不同于超表和课程格子等笔记类软件&#xff0c;笔记课表的核心是将课表和笔记进行深度绑定&#xff0c;点击每个课表&#xff0c;就进入到笔记view中&#xff0c;点击其中的item就可以进入到笔记详情&#xff1b; 该应用已上线&#xff0c;…

(电脑维修)电脑忘记密码怎么办(未完)

1.准备一个4gU盘&#xff0c;在微PE官网下载一个不高于2.2版本的微PE&#xff0c;并按照顺序制作一个U盘&#xff08;U盘中的资料记得提前拷贝&#xff0c;后期会被格式化掉&#xff09;

element-ui 表格el-table的列内容溢出省略显示,鼠标移上显示全部和定制样式

1、在对应列加上省略显示show-overflow-tooltip属性&#xff0c;如果加上这属性&#xff0c;鼠标移上还是没效果&#xff0c;要考滤是不是层级的原因&#xff0c;被其他挡住了。 :deep(.el-tooltip){position: relative;z-index:9; } <el-table-column label"用款渠…

实时时钟DS1302原理详解和单片机编程

一、DS1302的功能 DS1302是美国DALLAS推出的一款高性能、低功耗的日历时钟芯片。 DS1302是一种串行接口的实时时钟&#xff0c;芯片内部具有可编程的日历时钟和31个字节的静态RAM&#xff0c;日历时钟可以自动进行闰年补偿&#xff0c;计时准确&#xff0c;接口简单&#xff…

中文版开源Llama 2同时有了语言、多模态大模型,完全可商用

可以说&#xff0c;AI 初创公司 LinkSoul.Al 的这些开源项目让海外开源大模型在国内的普及和推广速度与国际几乎保持了一致。 7 月 19 日&#xff0c;Meta 终于发布了免费可商用版本 Llama 2&#xff0c;让开源大模型领域的格局发生了巨大变化。 Llama 2 模型系列包含 70 亿、…