Skip to content

Mindinventory/Flutlin

Repository files navigation

N|SolidN|SolidN|Solid

N|Solid

Flutter + Kotlin (Flutlin)

Aim

To find out the way to utilize flutter UI design benefits while on logical tasks like rest api calling with Kotlin.

  • UI design in Flutter
  • Rest api calling with Retrofit in Kotlin.

Tech

Steps to follow to use Flutter View

  1. Create Flutter Project.
  2. Open android project in Android Studio.
    • Create your own layout for your activity and add simple FlutterView
      <io.flutter.view.FlutterView
              android:id="@+id/flutter_view"
              android:layout_width="match_parent"
              android:layout_height="match_parent" /> 
      
    • Need some initialisation for flutter as per below:
      val args = getArgsFromIntent(intent)
      FlutterMain.ensureInitializationComplete(applicationContext, args)
      
    • Create FlutterRunArguments, provide context and entry point of dart for that view.
      val runArguments = FlutterRunArguments()
      runArguments.bundlePath = FlutterMain.findAppBundlePath(applicationContext)
      runArguments.entrypoint = "main"
      
    • Bind your FlutterView
      flutterView = findViewById(R.id.flutter_view)
      flutterView!!.runFromBundle(runArguments)
      
    • User any channel to communicate with your dart file and activity. In our case, I have used BasicMessageChannel to pass string as response.
      messageChannel = BasicMessageChannel(flutterView, CHANNEL, StringCodec.INSTANCE)
      messageChannel?.send(message)
      
    • Close android project.
  3. Open Flutter Project.
    • Initialise BasicMessageChannel channel which will be helpful to fetch data shared in our Actitivy.
      static const BasicMessageChannel<String> platform =
      BasicMessageChannel<String>(_channel, StringCodec());
      
    • Register callback in your initState() widget
      platform.setMessageHandler(_handlePlatformMessage);
      
    • Create method as per below through which you can parse your string into response model and that you can use to reflect in UI.
      Future<String> _handlePlatformMessage(String message) async {
          // use setState() to reflect the message in  your ui.
      }
      
      

LICENSE!

Flutlin is MIT-licensed.

Let us know!

We’d be really happy if you send us links to your projects where you use our component. Just send an email to [email protected] And do let us know if you have any questions or suggestion regarding our work.