How to Import multiple Flutter libraries into Native Android ?

Lets begin with the problem statement here.

So part of our app in Nitara (A dairy-tech company) is based on Kotlin and part of the app or all the new features implementations are being developed in Flutter. Well everything was going well in terms of importing a Flutter module as a library into the Kotlin app, until we tried to import multiple flutter modules.

Apparently as mentioned in the add-to-app section of the Flutter documentation , its not possible to have multiple Flutter libraries into a single app.

Source : https://docs.flutter.dev/add-to-app

But we need a solution and quick, as we have already planned for a live release of the new feature and the development is also done, the only thing left was integration into the native app.

So in search for a solution i came across this issue that was raised https://github.com/flutter/flutter/issues/39707 . As mentioned in the comments section here was an approach or a work around of this issue.

The solution worked like a charm, apparently its an approach known as Umbrella structure.

Lets learn this with a real example:

So lets assume we have two flutter modules to be integrated into the native app :

1. Nutrition module
2. Vet video call module

The first step here is to create a third module called the parent module and then import the above 2 modules into the Parent module. And the parent module will be the only one to be exposed to the native app.

Lets see the implementation:

1. Create the parent module
2. Import the nutrition module and the vet video call module

You can import it by local path of the project or you can import the git repo as well. Here i have imported the modules by the local path.

Source : Self

After the project is synced (Use flutter pub get)

3. In the main.dart file, the only thing left to implement here is the route.

Source : Self

Since we share datas from the Kotlin app to the flutter modules, we pass a List of arguments. In the list of arguments we also share the route, the route to the required flutter modules.

There are multiple ways to set the initial route, we choose this approach as we already have been sharing few arguments from the Kotlin app to the flutter modules and just had to add a new parameter called appRoute, which took care of the required routing for us.

To remember: For your assets to work properly like images. You need to define it in the parent module. The best way would be to have a common file called assets containing all the assets required by both the modules, in our case we defined all the assets required by our Nutrition and Vet video call module into the parent module and it worked well.

And now you have the solution to import multiple flutter modules into you native app. Voila! 🎉

Let me know in case you had any doubts.

Follow me on -

LinkedIn : https://www.linkedin.com/in/bornakpaul/

Youtube : https://www.youtube.com/@apptechlab

Instagram : https://www.instagram.com/apptech.lab/