Integrating with Third-Party Native SDKs in Flutter

Flutter is a powerful framework for building cross-platform applications with a single codebase. While Flutter provides a rich set of widgets and functionalities, there are times when you need to leverage existing native libraries and SDKs available on Android and iOS. Integrating with third-party native SDKs in Flutter involves bridging the gap between the Dart code in Flutter and the native code in Java/Kotlin for Android, and Objective-C/Swift for iOS.

Why Integrate Native SDKs?

• Accessing Platform-Specific Features: Some features are only available through native SDKs, such as advanced device-specific hardware controls or platform-specific APIs.
• Performance Optimization: Certain tasks might be more efficiently performed using native code, especially computationally intensive operations.
• Using Existing Native Libraries: You might want to leverage existing native libraries or SDKs developed specifically for Android or iOS.

How to Integrate Third-Party Native SDKs in Flutter

Integrating native SDKs into a Flutter app can be achieved primarily through Platform Channels. Here’s a step-by-step guide:

Step 1: Understand Platform Channels

Platform Channels provide a mechanism to communicate between Dart code and native code. They allow you to invoke methods on the native side from Flutter and vice versa. The main types of platform channels include:

• BasicMessageChannel: For continuous, two-way communication.
• MethodChannel: For invoking specific methods on the native side.
• EventChannel: For streaming data from native code to Flutter.

In most cases, MethodChannel is the most suitable for integrating with native SDKs because it allows you to call specific methods.

Step 2: Set Up the Flutter Project

Create a new Flutter project or navigate to an existing one.

flutter create my_flutter_app

Step 3: Implement the Platform Channel in Dart

In your Flutter app, set up a MethodChannel to communicate with native code.

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State {
  static const platform = const MethodChannel('my_channel');
  String _nativeResult = 'Unknown';

  Future _invokeNativeMethod() async {
    String result;
    try {
      final int value = 10;
      result = await platform.invokeMethod('nativeMethod', {'value': value});
    } on PlatformException catch (e) {
      result = "Failed to Invoke: '${e.message}'.";
    }

    setState(() {
      _nativeResult = result;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Native SDK Integration'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text('Result from Native: $_nativeResultn'),
            ElevatedButton(
              onPressed: _invokeNativeMethod,
              child: Text('Invoke Native Method'),
            ),
          ],
        ),
      ),
    );
  }
}

Explanation:

• A MethodChannel named my_channel is created to communicate with native code.
• The _invokeNativeMethod function calls a native method named nativeMethod with an argument value.
• The result from the native method is displayed in the UI.

Step 4: Implement the Native Code for Android

In your Android project (android/app/src/main/kotlin/your/package/MainActivity.kt), implement the native method that the Flutter code will invoke.

import io.flutter.embedding.android.FlutterActivity
import io.flutter.embedding.engine.FlutterEngine
import io.flutter.plugin.common.MethodChannel

class MainActivity: FlutterActivity() {
    private val CHANNEL = "my_channel"

    override fun configureFlutterEngine(flutterEngine: FlutterEngine) {
        super.configureFlutterEngine(flutterEngine)
        MethodChannel(flutterEngine.dartExecutor.binaryMessenger, CHANNEL).setMethodCallHandler {
            call, result ->
            if (call.method == "nativeMethod") {
                val value: Int? = call.argument("value")
                val returnValue = "Android says: Received value = $value"
                result.success(returnValue)
            } else {
                result.notImplemented()
            }
        }
    }
}

Explanation:

• A MethodChannel is created with the same name (my_channel) as defined in the Flutter code.
• The setMethodCallHandler listens for method calls from Flutter.
• When the nativeMethod method is called, the Android code processes the arguments and returns a result to Flutter.

Step 5: Implement the Native Code for iOS

In your iOS project (ios/Runner/AppDelegate.swift), implement the native method that the Flutter code will invoke.

import Flutter
import UIKit

@UIApplicationMain
@objc class AppDelegate: FlutterAppDelegate {
  override func application(
    _ application: UIApplication,
    didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?
  ) -> Bool {
    let controller : FlutterViewController = window?.rootViewController as! FlutterViewController
    let methodChannel = FlutterMethodChannel(name: "my_channel",
                                              binaryMessenger: controller.binaryMessenger)
    methodChannel.setMethodCallHandler { (call: FlutterMethodCall, result: @escaping FlutterResult) -> Void in
      if call.method == "nativeMethod" {
        if let args = call.arguments as? Dictionary,
           let value = args["value"] as? Int {
            let returnValue = "iOS says: Received value = (value)"
            result(returnValue)
        } else {
            result(FlutterError(code: "INVALID_ARGUMENT",
                                message: "Invalid arguments passed",
                                details: nil))
        }
      } else {
        result(FlutterMethodNotImplemented)
      }
    }

    GeneratedPluginRegistrant.register(with: self)
    return super.application(application, didFinishLaunchingWithOptions: launchOptions)
  }
}

Explanation:

• A FlutterMethodChannel is created with the same name (my_channel) as defined in the Flutter code.
• The setMethodCallHandler listens for method calls from Flutter.
• When the nativeMethod method is called, the iOS code processes the arguments and returns a result to Flutter.

Step 6: Add Native SDK Dependencies

To use the native SDK, you need to add its dependencies to the native projects.

Android:

Add the SDK dependency to the build.gradle file in the android/app/ directory.

dependencies {
    // Example: Adding Firebase Analytics SDK
    implementation platform('com.google.firebase:firebase-bom:32.7.0')
    implementation 'com.google.firebase:firebase-analytics-ktx'
}

iOS:

Add the SDK dependency using CocoaPods. Create a Podfile in the ios/ directory if it doesn’t exist and add the required pods.

platform :ios, '11.0'
target 'Runner' do
  use_frameworks!
  pod 'Firebase/Analytics'
end

Then, run pod install in the ios/ directory.

Step 7: Use Native SDK in Native Code

Now that the SDK is added as a dependency, you can use it in your native code. For example, using Firebase Analytics:

Android:

import com.google.firebase.analytics.ktx.analytics
import com.google.firebase.ktx.Firebase

// Inside the method call handler
if (call.method == "nativeMethod") {
    val value: Int? = call.argument("value")
    val analytics = Firebase.analytics
    val bundle = android.os.Bundle().apply {
        putInt("nativeValue", value ?: 0)
    }
    analytics.logEvent("native_method_called", bundle)
    val returnValue = "Android says: Received value = $value. Logged event."
    result.success(returnValue)
}

iOS:

import FirebaseAnalytics

// Inside the method call handler
if call.method == "nativeMethod" {
    if let args = call.arguments as? Dictionary,
       let value = args["value"] as? Int {
        Analytics.logEvent("native_method_called", parameters: [
            "nativeValue": value
        ])
        let returnValue = "iOS says: Received value = (value). Logged event."
        result(returnValue)
    } else {
        result(FlutterError(code: "INVALID_ARGUMENT",
                            message: "Invalid arguments passed",
                            details: nil))
    }
}

Best Practices

• Error Handling: Always handle potential errors when invoking native methods. Use try-catch blocks in Dart and proper error reporting in native code.
• Asynchronous Calls: Ensure native method calls are asynchronous to avoid blocking the UI thread.
• Data Serialization: When passing complex data structures, serialize them properly to ensure compatibility between Dart and native code.
• Channel Name Uniqueness: Use unique channel names to avoid conflicts with other plugins.
• Testing: Thoroughly test the integration on both Android and iOS platforms.

Example: Using a Simple Native SDK (Hypothetical)

Suppose there is a native SDK for performing advanced image processing.

Android (Kotlin):

class ImageProcessor {
    fun processImage(imagePath: String, filterType: String): String {
        // Load the image and apply the filter using the native SDK
        // Return the path to the processed image
        return "path/to/processed/image.jpg"
    }
}

iOS (Swift):

class ImageProcessor {
    func processImage(imagePath: String, filterType: String) -> String {
        // Load the image and apply the filter using the native SDK
        // Return the path to the processed image
        return "path/to/processed/image.jpg"
    }
}

Flutter (Dart):

Future processImage(String imagePath, String filterType) async {
  try {
    final String result = await platform.invokeMethod('processImage', {
      'imagePath': imagePath,
      'filterType': filterType,
    });
    return result;
  } on PlatformException catch (e) {
    print("Failed to process image: '${e.message}'.");
    return "";
  }
}

The native code would then call the SDK functions to process the image as required.

Conclusion

Integrating with third-party native SDKs in Flutter unlocks a world of possibilities, allowing you to leverage platform-specific features and existing native libraries. By using Platform Channels, you can seamlessly communicate between Dart code and native code on Android and iOS, providing a richer and more capable user experience. Following best practices and thorough testing will ensure a robust and maintainable integration.