快捷導(dǎo)航

Flutter集成到已有iOS工程的方法步驟

更新時(shí)間：2020年03月30日 11:55:56 作者：一禪小和尚

這篇文章主要介紹了Flutter集成到已有iOS工程的方法步驟，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧

前言

之前寫(xiě)過(guò)一篇介紹flutter集成到Android工程的文章，這次總結(jié)記錄一下自己把flutter集成到iOS的流程，以及遇到的問(wèn)題以及和解決方法供大家參考。

創(chuàng)建flutter_module

要在iOS工程中集成flutter，首先我們需要?jiǎng)?chuàng)建一個(gè)flutter_module，創(chuàng)建的方法有兩種：

使用Android studio創(chuàng)建
使用Android studio創(chuàng)建在上一篇新版Flutter集成到已有Android項(xiàng)目中有介紹，這里不再贅述。

使用flutter命令創(chuàng)建
在指定目錄下執(zhí)行如下命令

flutter create --template module flutter_module

修改Podfile文件

在Podfile文件中的依賴(lài)部分添加如下內(nèi)容

flutter_application_path'/Users/liuxinye/Desktop/WorkPro/AppGroup/platforms/xagf_flutter'
load File.join(flutter_application_path, '.ios', 'Flutter', 'podhelper.rb')

然后在要集成flutter的target中添加

install_all_flutter_pods(flutter_application_path)

最后為iOS工程執(zhí)行 pod install 即完成了了flutter_module的集成

使用flutter

接下來(lái)我們介紹如何在iOS工程中啟用flutter進(jìn)行開(kāi)發(fā)

初始化FlutterEngine

首先我們需要在A(yíng)ppDelegate中持有一個(gè)FlutterEngine，代碼如下：

@import Flutter
@interface AppDelegate
@property (strong, nonatomic) FlutterEngine *flutterEngine;
@end

然后我們需要在適當(dāng)?shù)臅r(shí)機(jī)啟動(dòng) FlutterEngine

+(FlutterEngine *)initFlutter:(NSString*)entry :(NSString*)dartFile{
   FlutterEngine *flutterEngine =
     ((AppDelegate *)UIApplication.sharedApplication.delegate).flutterEngine;
  if (flutterEngine) {
    return flutterEngine;
  }else{
    flutterEngine = [[FlutterEngine alloc] initWithName:@"my flutter engine"];
    if(dartFile&&entry){
      //指定dartFile文件中entry方法啟動(dòng)flutter
      [flutterEngine runWithEntrypoint:entry libraryURI:dartFile];
    }else if (entry){
      //指定main.dart中方法名為entry的方法啟動(dòng)
      [flutterEngine runWithEntrypoint:entry];
    }else{
      //執(zhí)行默認(rèn)的main.dart文件中的main方法進(jìn)行啟動(dòng)
      [flutterEngine run];
    }
    return flutterEngine;
  }
}

這里涉及了三個(gè)Flutter的啟動(dòng)方式，三種方式的區(qū)別在代碼中給出了注釋。

當(dāng)然，我們也可以在啟動(dòng)flutter時(shí)初始化路由。

[[flutterEngine navigationChannel] invokeMethod:@"setInitialRoute"
                     arguments:@"/index"];

至此我們就完成了 FlutterEngine 的啟動(dòng)工作，接下來(lái)我們來(lái)創(chuàng)建用來(lái)顯示Flutter界面的 ViewContoller 。

創(chuàng)建FlutterViewController

[GeneratedPluginRegistrant registerWithRegistry:flutterEngine];
FlutterViewController *flutterViewController =
    [[FlutterViewController alloc] initWithEngine:flutterEngine nibName:nil bundle:nil];

以UIView的方式使用

如果想要以 UIView 的方式使用，只需要使用 UIView *myFlutterView=flutterViewController.view 即可。

遇到的問(wèn)題

此次集成Flutter到iOS工程還是比較順利的，我在集成過(guò)程中只遇到了一個(gè)問(wèn)題，在完成以上集成工作后運(yùn)行iOS工程，出現(xiàn)了找不到 lib/main.dart 的報(bào)錯(cuò)，我百度了很久無(wú)法解決，最后嘗試關(guān)閉xcode,刪除 Pods 文件夾和 Podfile.lock 文件重新執(zhí)行 pod install 解決了此問(wèn)題。

到此這篇關(guān)于Flutter集成到已有iOS工程的方法步驟的文章就介紹到這了,更多相關(guān)Flutter集成到已有iOS 內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

您可能感興趣的文章: