Used UiKitView inside flutter application using Swift.
Flutter 1.0 version announced Platform View.
While Add To App is useful as a way to gradually introduce Flutter to an existing application, sometimes it’s useful to go the other way round and embed an Android or iPhone platform control in a Flutter app.
So Flutter 1.0 version introduced platform view widgets (
UiKitView) that let you embed this kind of content on each platform. Currently it have been previewing Android support for a couple of months, but now we're expanding support to iOS, and starting to add plug-ins like Google Maps and WebView that take advantage of this.
Let’s Create a new Project!
As this story we are covering Swift part of application, so will create application from Scrach.
Install Flutter : https://flutter.io/docs/get-started/install
Set up edit : https://flutter.io/docs/get-started/editor
Once above installation and setup is done then create fresh application using below command.
flutter create -i swift -a kotlin <project-name>
flutter create -i swift -a kotlin platform_view_sample
-i flag is a shorthand for iOS, and the
-a flag is for Android.
Add Native UI into with Flutter UiKitView Widget
create a new my_app.dart file add below code
Adding Native UI into flutter view need to provide size, which flutter widgets understand how much space require to fill Native UI.
Once size setup is done then create UiKitView Widget, which is nothing but platform view into flutter app. Currently this post cover only iOS portion so added only UiKitView which iOS platform view. viewType nothing but class name of platform view which cover below details.
The above code is done from flutter code side, now below details covers swift portion of the code.
Before going details please go through below flutter documentation for UiKitView
Implemented by iOS code that expose a
UIView for embedding in a Flutter app.The implementation of this method should create a new
UIView and return it.
UIView for embedding in the Flutter hierarchy
FlutterPlatformView Protocol Reference
Returns a reference to the UIView that is wrapped by this FlutterPlatformView.
Embeds an iOS view in the Widget hierarchy.
Embedding UIViews is still in release preview, to enable the preview for an iOS app add a boolean field with the key ‘io.flutter.embedded_views_preview’ and the value set to ‘YES’ to the application’s Info.plist file.
UiKitView class - widgets library - Dart API
API docs for the UiKitView class from the widgets library, for the Dart programming language.
Register Native View inside Swift application
Flutter is actively looking for a registration of these view types in native code.
Below code will register NativeView using NativeFactory class.
Run Flutter application refer below video
Github Project for above Tutorial at below link
Next Tutorial for Android coming soon…..