美文网首页
Flutter与已有iOS工程混合开发

Flutter与已有iOS工程混合开发

作者: 夜明Ven | 来源:发表于2019-03-07 12:41 被阅读0次

    Flutter与已有iOS工程混合开发

    混合开发参考:Add-Flutter-to-existing-apps
    本文GitHub:地址
    1. 创建工程目录,iOS工程、和Flutter工程为同级目录(本文只创建iOS的混合开发,Android混合开发可以参看flutter文档)

    FlutterLearnMix
        |-iOS
        |-Android
        |-Flutter
    

    2. 在iOS工程目录下新建iOS工程(创建方法省略,我在iOS目录下创建的工程名为FlutterLearnMix), Flutter混合开发不支持bit code,所以在iOS工程里关闭 Build Setting -> Enable Bitcode -> 设置为NO,这里使用CocoaPods管理,需要先pod init初始化

    3. Flutter Module搭建: 切换到FlutterLearnMix/Flutter目录,执行flutter create -t module flutter_module

    4. 使iOS工程依赖Flutter Module:将flutter_module添加到Podfile文件中,内容如下,可以使用绝对路径,亦可以使用相对路径,添加完后执行pod install

    # Uncomment the next line to define a global platform for your project
    # platform :ios, '9.0'
    
    target 'FlutterLearnMix' do
      # Uncomment the next line if you're using Swift or would like to use dynamic frameworks
      # use_frameworks!
      #绝对路径
    #  flutter_application_path = '/Users/himin/Desktop/Web/FlutterProject/flutter_learn_mix/Flutter/flutter_module/'
      #相对路径
      flutter_application_path = '../../Flutter/flutter_module/'
      eval(File.read(File.join(flutter_application_path, '.ios', 'Flutter', 'podhelper.rb')), binding)
    
    end
    

    5. 在ios工程里添加运行脚本:iOS工程中Build Phases -> Run Script添加如下脚本,如果Run Script不存在,点击加号创建即可,并且确保Run Script这一行在 "Target dependencies"后面。(flutter文档上说有这一步,个人实际测试发现不加也可以,貌似并没有执行)

    "$FLUTTER_ROOT/packages/flutter_tools/bin/xcode_backend.sh" build
    "$FLUTTER_ROOT/packages/flutter_tools/bin/xcode_backend.sh" embed
    

    6. iOS工程中加入代码来使用FlutterViewController:

    AppDelegate.h文件中:

    #import <UIKit/UIKit.h>
    #import <Flutter/Flutter.h>
    
    @interface AppDelegate : FlutterAppDelegate
    @property (nonatomic,strong) FlutterEngine *flutterEngine;
    @end
    

    AppDelegate.m文件中:

    #import "AppDelegate.h"
    #import "ViewController.h"
    #import <FlutterPluginRegistrant/GeneratedPluginRegistrant.h>
    
    @interface AppDelegate ()
    @end
    
    @implementation AppDelegate
    
    // This override can be omitted if you do not have any Flutter Plugins.
    - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
        
        self.flutterEngine = [[FlutterEngine alloc] initWithName:@"io.flutter" project:nil];
        [self.flutterEngine runWithEntrypoint:nil];
        [GeneratedPluginRegistrant registerWithRegistry:self.flutterEngine];
        
        self.window = [[UIWindow alloc] initWithFrame:UIScreen.mainScreen.bounds];
        ViewController *vc = [[ViewController alloc] init];
        UINavigationController *navVC = [[UINavigationController alloc] initWithRootViewController:vc];
        self.window.rootViewController = navVC;
        [self.window makeKeyAndVisible];
        
        return [super application:application didFinishLaunchingWithOptions:launchOptions];
    }
    
    @end
    

    ③ *ViewController.m文件中:

    #import "ViewController.h"
    #import <Flutter/Flutter.h>
    #import "AppDelegate.h"
    
    @interface ViewController ()
    @end
    
    @implementation ViewController
    
    - (void)viewDidLoad {
        [super viewDidLoad];
        self.view.backgroundColor = UIColor.whiteColor;
        
        {
            UIButton *btn = [[UIButton alloc] initWithFrame:CGRectMake(20, 80, 100, 30)];
            btn.backgroundColor = UIColor.orangeColor;
            [btn setTitle:@"push" forState:UIControlStateNormal];
            [btn setTitleColor:UIColor.grayColor forState:UIControlStateNormal];
            [btn addTarget:self action:@selector(pushBtnClick) forControlEvents:UIControlEventTouchUpInside];
            
            [self.view addSubview:btn];
        }
    }
    
    - (void)pushBtnClick {
        NSLog(@"push to flutter");
        FlutterEngine *flutterEngine = [(AppDelegate *)[UIApplication sharedApplication].delegate flutterEngine];
        FlutterViewController *flutterViewController = [[FlutterViewController alloc] initWithEngine:flutterEngine nibName:nil bundle:nil];
        flutterViewController.view.backgroundColor = UIColor.whiteColor;
        
        NSAssert([self navigationController], @"Must have a NaviationController");
        [[self navigationController]  pushViewController:flutterViewController animated:YES];
    }
    
    

    7. 然后编译运行程序,点击push按钮跳转到flutter页面
    8. flutter工程热重载:切换到FlutterLearnMix/Flutter/flutter_module目录,执行flutter attach即可,修改后保存然后命令行输入'r'即可实现热重载

    相关文章

      网友评论

          本文标题:Flutter与已有iOS工程混合开发

          本文链接:https://www.haomeiwen.com/subject/askcpqtx.html