<address id="r9vd9"><address id="r9vd9"><listing id="r9vd9"></listing></address></address>

      歡迎您光臨深圳塔燈網絡科技有限公司!
      電話圖標 余先生:13699882642

      網站百科

      為您解碼網站建設的點點滴滴

      現有iOS工程引入Flutter

      發表日期:2018-10 文章編輯:小燈 瀏覽次數:1784

      前言

      Flutter 是一個很有潛力的框架,但是目前使用Flutter的APP并不算很多,相關資料并不豐富,介紹現有工程引入Flutter的相關文章也比較少。項目從零開始,引入Flutter操作比較簡單,但是現有工程引入Flutter 需要費很多精力和時間,這里是我在完成現有iOS工程引入Flutter后寫的一次總結文章。

      Flutter 環境搭建

      首先是要搭建Flutter環境,之前也寫了一篇相關文章搭建Flutter-iOS開發環境,可以參考一下
      可以去官網查看:https://github.com/flutter/flutter/wiki/Add-Flutter-to-existing-apps
      比較簡單,這里不做贅述。

      現有iOS工程引入Flutter

      一、建立Flutter module

      首先建立flutter module,主要是用于獲取改flutter app中的Generated.xcconfig和framework

      cd some/path/ $ flutter create -t module my_flutter 

      也可以用

      flutter create app 

      建立flutter app,flutter app中也有Generated.xcconfig和framework

      二、新建配置文件

      根據官網,需要在工程中建立三個配置文件:
      Flutter.xcconfigDebug.xcconfig、Release.xcconfig
      在XCode工程對應目錄,右擊,選擇新建文件(New File),選中創建xcconfig文件,如圖:

      Flutter.xcconfig中填寫:
       //這里填寫前面建立的flutter module 的Generated.xcconfig的路徑 #include "../../my_flutter/.ios/Flutter/Generated.xcconfig" ENABLE_BITCODE=NO 
      Debug.xcconfig中填寫:
      #include "../Flutter/Flutter.xcconfig"

      Release.xcconfig中填寫:

      #include "../Flutter/Flutter.xcconfig" FLUTTER_BUILD_MODE=release 

      如果工程中用cocoapods管理,需要在 Debug.xcconfigRelease.xcconfig添加pod的路徑:

      例如 Release.xcconfig

      #include "Flutter.xcconfig" #include "工程路徑/Pods/Target Support Files/******.release.xcconfig"http://pod路徑 FLUTTER_BUILD_MODE=release 

      在準備好這些xcconfig文件后,需要到XCode工程PROJECT(注意是PROJECT,不是Target)中的Configuration選項里,將對應的target選擇成前面的xcconfig文件,Debug用Debug.xcconfig, Release用 Release.xcconfig

      注意:進行Archive打包的時候,無論是Debug包還是Release包,需要切換到Release.xcconfig,不然會報錯。

      三、為編譯Dart引入相關build phase

      在工程的Build Phase中新建一個Run Script,用于編譯時運行腳本,
      建立方法如圖:

      建立Run Script后,需要移動其對應的位置,需要在Target dependencies之后,如果用cocoapods管理工程需要在,Check Pods Manifest.lock之后:

      在腳本框中,填入以下代碼,用于引進Flutter中的xcode_backend腳本:

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

      如圖:


      四、生成和添加Framework

      完成前面的配置后,便可以在XCode對工程進行編譯build (Command+B),在提示“ Build Success ” 后,在iOS工程文件夾中會生成一個Flutter文件夾,將其加入工程目錄中,建議和剛才xcconfig所在目錄并列,

      右鍵項目目錄 ,選擇 Add Files to 'xxx' ,Options選Create groups,添加編譯生成的Flutter文件夾。需要注意但是:Flutter目錄下有個flutter_assets文件,不能使用Create groups的方式添加,只能用Creat folder references的Options, 否則Flutter頁面會空白渲染不出來??梢詣h了flutter_assets在用Creat folder references重新添加。

      在添加完Flutter 文件夾之后,去Embeded Binaries中添加App.frameworkFlutter.framework

      五、AppDelegate改造

      Flutter需要和APP進行交互,需要對AppDelegate 進行改造:

      AppDelegate.h文件中:

      #import <Flutter/Flutter.h>@interface AppDelegate : FlutterAppDelegate <UIApplicationDelegate, FlutterAppLifeCycleProvider>@end 

      AppDelegate.m 文件中:

      #import "AppDelegate.h"@interface AppDelegate ()@end@implementation AppDelegate { FlutterPluginAppLifeCycleDelegate *_lifeCycleDelegate; }- (instancetype)init { if (self = [super init]) { _lifeCycleDelegate = [[FlutterPluginAppLifeCycleDelegate alloc] init]; } return self; }- (BOOL)application:(UIApplication*)application didFinishLaunchingWithOptions:(NSDictionary*)launchOptions { return [_lifeCycleDelegate application:application didFinishLaunchingWithOptions:launchOptions]; }- (void)applicationDidEnterBackground:(UIApplication*)application { [_lifeCycleDelegate applicationDidEnterBackground:application]; }- (void)applicationWillEnterForeground:(UIApplication*)application { [_lifeCycleDelegate applicationWillEnterForeground:application]; }- (void)applicationWillResignActive:(UIApplication*)application { [_lifeCycleDelegate applicationWillResignActive:application]; }- (void)applicationDidBecomeActive:(UIApplication*)application { [_lifeCycleDelegate applicationDidBecomeActive:application]; }- (void)applicationWillTerminate:(UIApplication*)application { [_lifeCycleDelegate applicationWillTerminate:application]; }- (void)application:(UIApplication*)application didRegisterUserNotificationSettings:(UIUserNotificationSettings*)notificationSettings { [_lifeCycleDelegate application:application didRegisterUserNotificationSettings:notificationSettings]; }- (void)application:(UIApplication*)application didRegisterForRemoteNotificationsWithDeviceToken:(NSData*)deviceToken { [_lifeCycleDelegate application:application didRegisterForRemoteNotificationsWithDeviceToken:deviceToken]; }- (void)application:(UIApplication*)application didReceiveRemoteNotification:(NSDictionary*)userInfo fetchCompletionHandler:(void (^)(UIBackgroundFetchResult result))completionHandler { [_lifeCycleDelegate application:applicationdidReceiveRemoteNotification:userInfofetchCompletionHandler:completionHandler]; }- (BOOL)application:(UIApplication*)application openURL:(NSURL*)url options:(NSDictionary<UIApplicationOpenURLOptionsKey, id>*)options { return [_lifeCycleDelegate application:application openURL:url options:options]; }- (BOOL)application:(UIApplication*)application handleOpenURL:(NSURL*)url { return [_lifeCycleDelegate application:application handleOpenURL:url]; }- (BOOL)application:(UIApplication*)application openURL:(NSURL*)url sourceApplication:(NSString*)sourceApplicationannotation:(id)annotation { return [_lifeCycleDelegate application:applicationopenURL:urlsourceApplication:sourceApplication annotation:annotation]; }- (void)application:(UIApplication*)application performActionForShortcutItem:(UIApplicationShortcutItem*)shortcutItem completionHandler:(void (^)(BOOL succeeded))completionHandler NS_AVAILABLE_IOS(9_0) { [_lifeCycleDelegate application:applicationperformActionForShortcutItem:shortcutItem completionHandler:completionHandler]; }- (void)application:(UIApplication*)application handleEventsForBackgroundURLSession:(nonnull NSString*)identifier completionHandler:(nonnull void (^)(void))completionHandler { [_lifeCycleDelegate application:application handleEventsForBackgroundURLSession:identifier completionHandler:completionHandler]; }- (void)application:(UIApplication*)application performFetchWithCompletionHandler:(void (^)(UIBackgroundFetchResult result))completionHandler { [_lifeCycleDelegate application:application performFetchWithCompletionHandler:completionHandler]; }- (void)addApplicationLifeCycleDelegate:(NSObject<FlutterPlugin>*)delegate { [_lifeCycleDelegate addDelegate:delegate]; }

      六、新建FlutterViewController

      主要配置基本上已經完成,只要在main.dart實現Flutter的業務代碼即可


      在原有工程中 ,建立FlutterViewController來承載main.dart實現的Flutter頁面,如:

      self.flutterViewController = [[FlutterViewController alloc] initWithProject:nil nibName:nil bundle:nil]; [self.navigationController pushViewController:self.flutterViewController animated:YES]; 

      后語

      到這里現有iOS工程引入Flutter的工作就完成了,一些細節上的修改需要根據場景進行修改,例如Flutter和Native的數據通信等。


      本頁內容由塔燈網絡科技有限公司通過網絡收集編輯所得,所有資料僅供用戶學習參考,本站不擁有所有權,如您認為本網頁中由涉嫌抄襲的內容,請及時與我們聯系,并提供相關證據,工作人員會在5工作日內聯系您,一經查實,本站立刻刪除侵權內容。本文鏈接:http://www.webpost.com.cn/18169.html
      相關APP開發
       八年  行業經驗

      多一份參考,總有益處

      聯系深圳網站公司塔燈網絡,免費獲得網站建設方案及報價

      咨詢相關問題或預約面談,可以通過以下方式與我們聯系

      業務熱線:余經理:13699882642

      Copyright ? 2013-2018 Tadeng NetWork Technology Co., LTD. All Rights Reserved.    

      国产成人精品综合在线观看