Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Adding Flutter to an existing Android/iOS app

Adding Flutter to an existing Android/iOS app

Enzo Lizama Paredes

February 18, 2020
Tweet

More Decks by Enzo Lizama Paredes

Other Decks in Programming

Transcript

  1. Method Channel The Flutter side sends notifications to the native

    side, usually used to call a method of native.
  2. Event Channel Used for data stream communication, it has the

    function of monitoring, such as pushing directly to the Flutter terminal after the change of power.
  3. android { // ... } repositories { maven { url

    'some/path/my_flutter/build/host/outputs/repo' // This is relative to the location of the build.gradle file // if using a relative path. } maven { url 'http://download.flutter.io' } } dependencies { // ... debugImplementation 'com.example.flutter_module:flutter_debug:1.0' profileImplementation 'com.example.flutter_module:flutter_profile:1.0' releaseImplementation 'com.example.flutter_module:flutter_release:1.0' }
  4. android { // ... } repositories { maven { url

    'some/path/my_flutter/build/host/outputs/repo' // This is relative to the location of the build.gradle file // if using a relative path. } maven { url 'http://download.flutter.io' } } dependencies { // ... debugImplementation 'com.example.flutter_module:flutter_debug:1.0' profileImplementation 'com.example.flutter_module:flutter_profile:1.0' releaseImplementation 'com.example.flutter_module:flutter_release:1.0' }
  5. // settings.gradle import javax.naming.Binding include ':.android' include ':app' setBinding(new Binding([gradle:

    this])) evaluate(new File(settingsDir.parentFile, 'flutter_android_ios/flutter_module/flutter_module/.android/include_flutter.groovy ' ))
  6. // settings.gradle import javax.naming.Binding include ':.android' include ':app' setBinding(new Binding([gradle:

    this])) evaluate(new File(settingsDir.parentFile, 'flutter_android_ios/flutter_module/flutter_module/.android/include_flutter.groovy ' ))
  7. apply plugin: 'com.android.application' apply plugin: 'kotlin-android' apply plugin: 'kotlin-android-extensions' android

    { ... compileOptions { sourceCompatibility = 1.8 targetCompatibility = 1.8 } } dependencies { implementation fileTree(dir: 'libs', include: ['*.jar']) implementation Dependencies.kotlin ... androidTestImplementation Dependencies.mockk androidTestImplementation Dependencies.junit implementation project(path: ':flutter') }
  8. apply plugin: 'com.android.application' apply plugin: 'kotlin-android' apply plugin: 'kotlin-android-extensions' android

    { ... compileOptions { sourceCompatibility = 1.8 targetCompatibility = 1.8 } } dependencies { implementation fileTree(dir: 'libs', include: ['*.jar']) implementation Dependencies.kotlin ... androidTestImplementation Dependencies.mockk androidTestImplementation Dependencies.junit implementation project(path: ':flutter') }
  9. target 'ios_app' do flutter_application_path = 'ROUTE_TO_FLUTTER_MODULE' # /Users/enzoftware/Projects/add_flutter_to_existing_app/flutter_module load File.join(flutter_application_path,

    '.ios', 'Flutter', 'podhelper.rb') install_all_flutter_pods(flutter_application_path) # Comment the next line if you don't want to use dynamic frameworks use_frameworks! # Pods for ios_app target 'ios_appTests' do inherit! :search_paths # Pods for testing end target 'ios_appUITests' do # Pods for testing end end
  10. target 'ios_app' do flutter_application_path = 'ROUTE_TO_FLUTTER_MODULE' # /Users/enzoftware/Projects/add_flutter_to_existing_app/flutter_module load File.join(flutter_application_path,

    '.ios', 'Flutter', 'podhelper.rb') install_all_flutter_pods(flutter_application_path) # Comment the next line if you don't want to use dynamic frameworks use_frameworks! # Pods for ios_app target 'ios_appTests' do inherit! :search_paths # Pods for testing end target 'ios_appUITests' do # Pods for testing end end
  11. flutter build ios-framework --cocoapods --output=some/path/MyApp/Flutter/ # In your Podfile pod

    'Flutter', :podspec => 'some/path/MyApp/Flutter/{build_mode}/Flutter.podspec'
  12. lateinit var flutterEngine : FlutterEngine override fun onCreate() { super.onCreate()

    // Instantiate a FlutterEngine. flutterEngine = FlutterEngine(this) // Start executing Dart code to pre-warm the FlutterEngine. flutterEngine.dartExecutor.executeDartEntrypoint( DartExecutor.DartEntrypoint.createDefault() ) // Cache the FlutterEngine to be used by FlutterActivity. FlutterEngineCache .getInstance() .put("my_engine_id", flutterEngine) } Pre-warm engine
  13. var newFlutterFragment = FlutterFragment.createDefault() flutterFragment = newFlutterFragment fragmentManager .beginTransaction() .add(

    R.id.fragment_container, newFlutterFragment, TAG_FLUTTER_FRAGMENT ) .commit() Fragments? Yes!
  14. @objc func showFlutter() { let flutterEngine = (UIApplication.shared.delegate as! AppDelegate).flutterEngine

    let flutterViewController = FlutterViewController(engine: flutterEngine, nibName: nil, bundle: nil) present(flutterViewController, animated: true, completion: nil) } FlutterViewController with your FlutterEngine
  15. Limitations • Running multiple Flutter instances or running in partial

    screen views may have undefined behavior. • Using Flutter in background mode is still a WIP. • Packing a Flutter library into another shareable library or packing multiple Flutter libraries into an application isn’t supported.