1，创立一个flutter模块儿

创立Flutter Module

fluttercreate--templatemodulemy_flutter

创立完成后，该模块和一般的Flutter项目可以经过Android Studio或VSCode翻开、运转；

2，创立一个iOS项目

创立一个工程名称为 mix_flutter 的iOS项目，使用 CocoaPods 依靠办理和已装置的 Flutter SDK

1) 将项目加入CocoaPods进行办理

CD到项目根目录，然后顺次履行

初始化CocoaPods：pod init

装置CocoaPods的依靠：pod install

编译Podfile文件：

# Uncomment the next line to define a global platform for your project
# platform :ios, '9.0'
# 添加模块儿地点路径
flutter_application_path = '../my_flutter'
load File.join(flutter_application_path, '.ios', 'Flutter', 'podhelper.rb')
target 'mix_flutter' do
 # Comment the next line if you don't want to use dynamic frameworks
 use_frameworks!

 #装置 Flutter 模块儿
 install_all_flutter_pods(flutter_application_path)
 # Pods for mix_flutter
 target 'mix_flutterTests' do
  inherit! :search_paths
  # Pods for testing
 end
 target 'mix_flutterUITests' do
  # Pods for testing
 end
end

2) 在iOS项目编写代码展现Flutter页面

为了在既有的iOS使用中展现Flutter页面，需求启动Flutter Engine和FlutterViewController。

Appdelegate.h 代码

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

Appdelegate.m 代码


- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
 
  // 1.创立一个FlutterEngine对象
  self.flutterEngine = [[FlutterEngine alloc] initWithName:@"my flutter engine"];
  // 2.启动flutterEngine
  [self.flutterEngine run];
  [GeneratedPluginRegistrant registerWithRegistry:self.flutterEngine];
  self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
  self.window.backgroundColor = UIColor.whiteColor;
  ViewController *vc = [[ViewController alloc] init];
  self.window.rootViewController = vc;
  [self.window makeKeyAndVisible];
  return [super application:application didFinishLaunchingWithOptions:launchOptions];
}

ViewController.m 代码

- (void)viewDidLoad {
  [super viewDidLoad];
  UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
  [button addTarget:self
       action:@selector(showFlutter)
  forControlEvents:UIControlEventTouchUpInside];
  [button setTitle:@"Hello Flutter!" forState:UIControlStateNormal];
  button.backgroundColor = UIColor.blueColor;
  button.frame = CGRectMake(80.0, 210.0, 160.0, 40.0);
  [self.view addSubview:button];
}
- (void)showFlutter {
  FlutterEngine *flutterEngine =
    ((AppDelegate *)UIApplication.sharedApplication.delegate).flutterEngine;
  FlutterViewController *flutterViewController =
  [[FlutterViewController alloc] initWithEngine:flutterEngine nibName:nil bundle:nil];
  [self presentViewController:flutterViewController animated:YES completion:nil];
}

经过 Xocde 运转项目即可

3，让 Flutter 模块儿经过Android Studio在iOS模拟器，hot reload, hot restart

因为在 XCode 调试项目每次修正都需求运转项目，所以最好能经过 Android Studio 来调试Flutter模块儿

1） 留意：首要使用Xcode运转 mix_flutter 项目，并保持

2） 在 Android Studio 翻开Flutter 模块儿，然后翻开终端,履行指令flutter attach

因为我一起连接了我的手机，和翻开了模拟器，所以有多个选项，所以咱们需求选一个设备，

mqingiMac:my_flutter tiansifang$ flutter attach
Multiple devices found:
iPhoneMQ (mobile)  • 00008030-001C04D21E89802E            • ios • iOS 13.4 17E255
iPhone 13 (mobile) • DE390EED-B28A-4D7E-8C2A-EA9EF2637000 • ios • com.apple.CoreSimulator.SimRuntime.iOS-15-0 (simulator)
[1]: iPhoneMQ (00008030-001C04D21E89802E)
[2]: iPhone 13 (DE390EED-B28A-4D7E-8C2A-EA9EF2637000)
Please choose one (To quit, press "q/Q"):

输入 2 来选中模拟器,呈现如下过错

Please choose one (To quit, press "q/Q"): 2
There are multiple observatory ports available.
Rerun this command with one of the following passed in as the appId:
  flutter attach --app-id com.example.myFlutter
  flutter attach --app-id com.example.myFlutter (2)
  flutter attach --app-id com.mingqing.mix-flutter

然后履行 flutter attach --app-id com.mingqing.mix-flutter 又呈现如下过错

mqingiMac:my_flutter tiansifang$ flutter attach --app-id com.mingqing.mix-flutter
Multiple devices found:
iPhoneMQ (mobile)  • 00008030-001C04D21E89802E            • ios • iOS 13.4 17E255
iPhone 13 (mobile) • DE390EED-B28A-4D7E-8C2A-EA9EF2637000 • ios • com.apple.CoreSimulator.SimRuntime.iOS-15-0 (simulator)
[1]: iPhoneMQ (00008030-001C04D21E89802E)
[2]: iPhone 13 (DE390EED-B28A-4D7E-8C2A-EA9EF2637000)
Please choose one (To quit, press "q/Q"):

再次输入 2 来选中模拟器，成功了，然后经过Android Studio 修正flutter 模块儿代码，
经过指令提示
(如下r Hot reload. R Hot restart.)
来热更新界面

Please choose one (To quit, press "q/Q"): 2
Syncing files to device iPhone 13...                                6.3s
Flutter run key commands.
r Hot reload. 
R Hot restart.
h List all available interactive commands.
d Detach (terminate "flutter run" but leave application running).
c Clear the screen
q Quit (terminate the application on the device).
 Running with sound null safety 
An Observatory debugger and profiler on iPhone 13 is available at: http://127.0.0.1:51772/O29OVOaScrA=/
The Flutter DevTools debugger and profiler on iPhone 13 is available at: http://127.0.0.1:9101?uri=http://127.0.0.1:51772/O29OVOaScrA=/
  1. 总结 flutter attach 指令
    最开端直接使用指令选中模拟器和iOS工程

flutter attach -d DE390EED-B28A-4D7E-8C2A-EA9EF2637000 --app-id com.mingqing.mix-flutter