preface

I have written an article introducing the integration of Flutter into Android project before. This time, I will summarize and record my process of integrating Flutter into iOS, as well as the problems encountered and solutions for your reference.

Create flutter_module

To integrate Flutter into the iOS project, we first need to create a Flutter_module, which can be created in one of two ways:

  1. The integration of Flutter into existing Android projects with Android Studio was introduced in the previous article and will not be covered here.
  2. Create the flutter command

    Run the following command in the specified directory

    flutter create --template module flutter_module

Modify the Podfile file

Add the following to the dependencies section of your Podfile

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

Then add it to the target that you want to integrate flutter

install_all_flutter_pods(flutter_application_path)
Copy the code

Finally, pod install was executed for the iOS project to complete flutter_module integration

The use of flutter

How to enable Flutter development in iOS projects

Initialize FlutterEngine

First we need to hold a FlutterEngine in the AppDelegate as follows:

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

Then we need to start FlutterEngine at the appropriate time

+(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){// Specify entry methods in dartFile to start flutter [flutterEngine runWithEntrypoint: Entry libraryURI:dartFile]; }else ifDart starts [flutterEngine runWithEntrypoint:entry]; dart starts [flutterEngine runWithEntrypoint:entry]; }else{// Start [flutterEngine run] with the main method in the default main.dart file; }returnflutterEngine; }}Copy the code

There are three ways to start a Flutter. The differences of the three ways are commented in the code. Of course, we can also initialize the route when flutter is started.

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

Now that we have started up the FlutterEngine, let’s create the ViewContoller that displays the Flutter interface.

Create FlutterViewController

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

Use it as UIView

If you want to use in the form of UIView, only need to use the UIView * myFlutterView = flutterViewController in view.

Problems encountered

The integration of Flutter into iOS project was relatively smooth this time. I only encountered one problem in the integration process. After completing the integration work above, I ran iOS project, and there was an error that I could not find lib/main.dart. A final attempt to close Xcode, remove the Pods folder and podfile. lock files and re-execute Pod Install fixed the problem.