Skip to main content
PESDK/Flutter/Guides

Native Interfaces

Learn how to use our native interfaces for customizing the PhotoEditor for Flutter on iOS and Android.

PhotoEditor SDK for Flutter has some dedicated native interfaces build-in to provide better access and customization possibilities. These interfaces are accessible via the FlutterPESDK class.

iOS#

On iOS, there are two interfaces available - one for adjusting the native Configuration and one to have access to the active PhotoEditViewController - before the editor is opened.

Before using any of the native interfaces described below, you need to import the native module:

import ImglyKit

configureWithBuilder#

The FlutterPESDK.configureWithBuilder function allows you to modify the native Configuration before it gets passed to the editor. You can make all kinds of adjustments here that are not possible from the React Native configuration, e.g., change buttons or use closures of individual tools. For further information, please have a look at the dedicated native guides.

FlutterPESDK.configureWithBuilder = { builder in
// Disable the color pipette for the text color selection tool
builder.configureTextColorToolController { options in
var colors = options.availableColors
// Remove first color item which is the color pipette
colors.remove(at: 0)
options.availableColors = colors
}
}

willPresentPhotoEditViewController#

The FlutterPESDK.willPresentPhotoEditViewController function is called right before the photo editor is presented and allows you to make adjustments directly to the editor.

FlutterPESDK.willPresentPhotoEditViewController = { photoEditViewController in
print("Will present:", photoEditViewController)
}

Android#

On Android, there are also two interfaces available - one for adjusting the native SettingsList before the editor is opened and one to have access to the StateHandler before the editor exports the image. All native interfaces can be accessed within the MainActivity.kt of your application. To do so, you need to override the onStart method and use our interfaces to apply your customizations as shown below:

editorWillOpenClosure#

The FlutterPESDK.editorWillOpenClosure is called right before the serialization is applied when the editor is opened. Within this closure, you can make adjustments to the native PhotoEditorSettingsList and apply customizations of various kinds. For further information on this, please refer to our native guides.

FlutterPESDK.editorWillOpenClosure = { settingsList ->
settingsList.configure<UiConfigText> {
// Remove first color item which is the color pipette
it.textColorList.removeFirst()
}
}

editorWillExportClosure#

The FlutterPESDK.editorWillExportClosure is called right before the editor starts exporting. Within this closure, you can make adjustments to the native StateHandler and apply customizations of various kinds. For further information on this, please refer to our native guides.

FlutterPESDK.editorWillExportClosure = {
// Add an overlay to the image
val overlay = it[AssetConfig::class].getAssetById(OverlayAsset::class.java, "imgly_overlay_golden")!!
it[OverlaySettings::class].overlayAsset = overlay
}