Using Plugins to Interface with Android or iOS with Dart's Flutter Framework

in #utopian-io6 years ago (edited)

flutter-logo.jpg

Repository

https://github.com/flutter/flutter

What Will I Learn?

  • You will learn the difference between Plugins and Packages in Flutter
  • You will learn how to push data to the Android and iOS platforms
  • You will learn how to have Android and iOS push data to Flutter
  • You will learn about the MethodChannel and Platform Messages
  • You will learn about Flutter's general API

Requirements

System Requirements:
OS Support for Flutter:
  • Windows 7 SP1 or later (64-bit)
  • macOS (64-bit)
  • Linux (64-bit)

Required Knowledge

  • A little understanding of libraries and plugin systems.
  • A fair understanding of Mobile development and Imperative or Object Oriented Programming
  • Some understanding of APIs

Resources for Flutter and this Project:

Sources:

Flutter Logo (Google): https://flutter.io/
Flutter Chart: https://flutter.io/

Difficulty

  • Intermediate

Description

Outline and Overview

In this tutorial example we take a look at how we can interface with the host platforms by creating a simple plugin. We take a look at the boilerplate plugin that is generated when you run the basic command and we expand upon it by building out another getter. We also build out a small little timer feature that allows the android host platform to send messages to the Flutter View layer and increment an integer when the user pushes a button.

Outline for this Tutorial
Should I make a Plugin or a Package?

Packages are a good way of cutting down code reuse and you can use them to generalize abstractions and other concepts. Plugins on the other hand are what allows Flutter to be so flexible as a framework. The ability to interface with and access any of the native APIs that are built into iOS and/or Android is very powerful.

platform-message.png

The chart above details the basic layout and pattern of a flutter plugin. By using flutter Method Channels and Platform Messages, not only can flutter gain access to native APIs; it can also access 3rd party APIs as well. This makes flutter a very robust framework which is easy to build in and still full of features.

Pushing and Pulling Data

Flutter is a fully featured layer that is built on top of other platforms. As such it need to have methods of pushing and pulling data to and from those platforms to optimize its abilities to leverage those platforms. Flutter accomplishes this by using MethodChannels and PlatformMessages. Flutter plugins register their method channels on both the Flutter layer and the host layer which allows for the passing of platform messages.

dart-plugin.png

In the flutter side of our plugin, we have two getter methods and one "setter" method. The getter methods return a Future with the data type that we want to get from the host platform. In this case, both of our getter methods return a String type. Our "setter" method allows us to execute a callback function which creates a method call. This method call is then executed on the platform which returns a message to the flutter layer. In this case, the message it returns contains an argument that is an integer type.

Building an API on the Platform

Each platform has a very platform neutral way of communicating with Flutter. This is achievable because of the way that Flutter is structured. A string representation of the Method that we want to call is pass along the MethodChannel down to the platform. Once the platform receives this string message; it executes the appropriate method and then returns a new string with the resulting data. In some cases, the data is empty and in others it can be fairly large.

kotlin-plugin.png

The Kotlin code used to communicate with Android is simple and makes use of the when operator to pattern match on the string method that is being sent through the MessageChannel. This makes the logic of the API between the Flutter view layer and the platform fairly easy to read and deal with. We are able to create fairly complex methods and attach them to these strings. Also, most of the types included in the platforms are able to be passed back to the Flutter Layer through a conversion.

The source code for this project can be found here

Information on the platform specific types can be found here

Video Tutorial

Projects and Series

Stand Alone Projects:
Building a Calculator
Movie Searcher Application

Minesweeper Game

Weather Application

Curriculum

Proof of Work Done

https://github.com/tensor-programming

Sort:  

Thank you for your contribution @tensor. Great work.

Your contribution has been evaluated according to Utopian rules and guidelines, as well as a predefined set of questions pertaining to the category.
To view those questions and the relevant answers related to your post,Click here


Need help? Write a ticket on https://support.utopian.io/.
Chat with us on Discord.
[utopian-moderator]

As always, thanks for moderating my contribution.

Hey @tensor
Thanks for contributing on Utopian.
We’re already looking forward to your next contribution!

Contributing on Utopian
Learn how to contribute on our website or by watching this tutorial on Youtube.

Want to chat? Join us on Discord https://discord.gg/h52nFrV.

Vote for Utopian Witness!

Great contribution,I really hope this works with my Android device

Coin Marketplace

STEEM 0.19
TRX 0.15
JST 0.029
BTC 63117.29
ETH 2601.03
USDT 1.00
SBD 2.76