A brief introduction to Flutter

Flutter is Google’s mobile UI framework for quickly building high-quality native user interfaces on iOS and Android. Flutter can work with existing code. Flutter is being used by more and more developers and organizations around the world, and Flutter is completely free and open source.

I won’t say too much about Flutter here. If you want to install the Flutter Flutter or would like to learn more about information can focus on the following url: Flutter Flutter https://flutter.io/ official Chinese website https://flutterchina.club/


Analyze the Flutter Xcode project

1. Create the Flutter project

After the Flutter environment is installed, we use the “Flutter create flutter_app” command to create a project named flutter_app on the terminal to analyze the Flutter directory together

2. Analyze the content required for iOS operation

1. Let’s run the project first to see if there are any problems. First open the iOS emulator and enter the flutter_app directory. Run the “‘flutter run'” command to start the project. We directly opened the ios folder under the flutter_app directory and there was an Xcode project. The structure of the Runner. Xcworkspace project was as follows:

2. The Flutter directory

Note :App. Framework and Flutter. Framework are different in debug and release modes

3. Analysis of AppDelegate

Appdelegate. h imports #import

and inherits FlutterAppDelegate

2. AppDelegate. M introducing # include “GeneratedPluginRegistrant. H” file and in didFinishLaunchingWithOptions method calls [GeneratedPluginRegistrant registerWithRegistry:self]; return [super application:application didFinishLaunchingWithOptions:launchOptions];

3. GeneratedPluginRegistrant file, this file is used for registering Flutter of the plugin, because here is the new project does not introduce any plug-ins, so registerWithRegistry method is empty. If Flutter project to introduce other plugin will generate a in flutter_app directory. Flutter – hidden files inside of the plugins included the plug-in name, and the corresponding path GeneratedPluginRegistrant. M file will also change. The following figure

4.rootViewController

We open the main. storyboard file and see that there is a viewController called FlutterViewController. To navigate through the documentation, jump to the following code

FlutterViewController *flutterViewController = [[FlutterViewController alloc] init]; //[flutterViewController setInitialRoute:@"route1"]; [self presentViewController:flutterViewController animated:false completion:nil];Copy the code

Third, summarize the steps

Through step 2, we need flutter_assets, app. framework, Flutter. Framework and the plugin to import and inherit the FlutterAppDelegate and jump with the FlutterViewController


Compile shell and obtain files required for iOS operation

1. Run “flutter build ios debug” and “flutter build ios “in the flutter_app directory “Release” can compile and get debug/release of the corresponding App. Framework, Flutter. Framework, and then we use.flutter-plugins to import all the plug-ins and import flutter_assets. Finally, make a Flutter. Podspec file to import into pod

2. Implementation code

1. Place Flutter. Podspec and Flutter -ios.sh into the flutter_app directory. Run flutter-ios.sh to generate debug and release files in flutter_app/build/flutter-ios/ and use POD. 2. Copy the flutter-ios directory to the project directory using Podfile

3.1 AppDelegate FlutterAppDelegate inheritance

3.2 the import GeneratedPluginRegistrant and register the plugin

3.3 Displaying Flutter using FlutterViewController

Flutter.podspec

Save the code to a folder named flutter. Podspec # # NOTE: This podspec is NOT to be published. It is only used as a local source! # Pod: : Spec. New do | s | s.n ame = 'Flutter' s.v ersion = "1.0.0" s.s ummary = 'High - performance, high-fidelity mobile apps.' s.description = <<-DESC Flutter provides an easy and productive way to build and deploy high-performance mobile apps for Android and iOS. DESC s.homepage = 'https://flutter.io' s.license = { :type => 'MIT' } s.author = { 'Flutter Dev Team' => '[email protected]' } s.source = { :git => 'https://github.com/flutter/engine', To_s} s.iso. Deployment_target = '7.0' S.deployment_frameworks = 'Flutter. Framework ', 'App.framework' s.resources = 'flutter_assets' s.source_files = '*.{h,m}' s.public_header_files = '*.h' endCopy the code

flutter-ios.sh

#! /bin/sh # Save the code to the flutter_app directory and name it flutter-ios.sh function echoError() {echo '\033[31mError:'$1'\033[0m'} function echoGreen() { echo '\033[32m'$1'\033[0m' } #debug/release function buildFlutter() { mode='release' if [ $# = 1 ] ;  then mode=$1 fi buildRoot='build/flutter-ios/' buildPath=$buildRoot$mode'-iphoneos/' BuildRootPlugins =$buildRoot'plugins/' rm -rf $buildPath mkdir -p $buildPath # Build flutter echoGreen 'build ios -- '$mode flutter build ios - $# mode loading flutter. The framework flutterFramework =' ios/flutter, flutter. The framework 'if [!  -d $flutterFramework ]; Then echoError 'Flutter. Framework does not exist 'exit 0 else echoGreen' load Flutter. Framework 'cp -r $flutterFramework $buildPath fi # to load the App. The framework appFramework = 'ios/Flutter/App. Framework' if [!  -d $appFramework ]; App.framework' cp -r $appFramework $buildPath fi # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # load plugins if [!  -d $buildRootPlugins ]; then mkdir -p $buildRootPlugins flutterPlugins='.flutter-plugins' if [ -f $flutterPlugins ];  then while read line do array=(${line//=/ }) pluginPath=$buildRootPlugins${array[0]} mkdir -p $pluginPath cp -r ${array[1]}'/ios/.' $pluginPath done < $flutterPlugins fi fi echoGreen ' $buildPath'plugins' # register file if [!  -f $buildRoot'GeneratedPluginRegistrant.h' ];  then flutterPluginsRegistrant='ios/Runner/GeneratedPluginRegistrant' if [ -f $flutterPluginsRegistrant'.h' ];  then cp -r $flutterPluginsRegistrant'.h' $buildRoot cp -r $flutterPluginsRegistrant'.m' $buildRoot fi fi ln -fs '../GeneratedPluginRegistrant.h' $buildPath'GeneratedPluginRegistrant.h' ln -fs '../GeneratedPluginRegistrant.m' # $buildPath 'GeneratedPluginRegistrant. M' loading flutter_assets if [!  -d $buildRoot'flutter_assets' ]; then flutterAssets='ios/Flutter/flutter_assets' if [ -d $flutterAssets ]; Then cp -r $flutterAssets $buildRoot fi fi echoGreen 'load flutter_assets' ln -fs '../flutter_assets' $buildPath'flutter_assets' # copy Flutter. Podspec if [!  -f $buildRoot'Flutter.podspec' ]; then flutterPodspec='Flutter.podspec' if [ -f $flutterPodspec ]; Then cp -r $flutterPodspec $buildRoot fi fi echoGreen 'load Flutter. Podspec' ln -fs '../Flutter. $buildPath'Flutter. Podspec '} start=$(date +%s) # rm -rf 'build/ Flutter -ios/' mkdir -p 'build/ Flutter -ios/' BuildFlutter debug buildFlutter release end=$(date +%s) echo '^v^ 'Copy the code

Podfile

# Uncomment the next line to define a global platform for your project # platform :ios, '9.0' # CocoaPods analytics Fram Build latency synchronously. # flutter model: debug/release def podFlutter(mode) flutterPath = 'flutter-ios/' + mode + '-iphoneos/' pod 'Flutter', :path => flutterPath pluginsPath = 'flutter-ios/' + mode + '-iphoneos/plugins/' if File.directory? (pluginsPath) Dir.foreach(pluginsPath) do |fileName| if fileName ! = '.' and fileName ! = '.. ' and fileName ! = '.DS_Store' pod fileName, :path => pluginsPath + fileName end end end end target 'demo' do podFlutter('debug') end post_install do |installer| installer.pods_project.targets.each do |target| target.build_configurations.each do |config| config.build_settings['ENABLE_BITCODE'] = 'NO' end end endCopy the code

This article only explores a method to import the Flutter project code using the POD library. If you have any suggestions or alternatives, please leave a comment


Since the | the original address

Thank you for viewing the information:

  • Obtaining method:Click here!