CreativeEditor SDK Now Supports React Native on iOS & Android

Integrate video, design, and photo editing capabilities with our new React Native package for CE.SDK.


3 min read
CreativeEditor SDK Now Supports React Native on iOS & Android

We’re thrilled to announce the release of our official @imgly/editor-react-native package, bringing the power of CreativeEditor SDK to the React Native ecosystem for iOS and Android!

CreativeEditor SDK enables developers to seamlessly integrate design, video, and photo editing features into their applications. Over the past few months, we’ve been focused on enhancing mobile editor solutions—refining features and expanding to new use cases, including the Video Editor.

To make CreativeEditor SDK accessible to even more developers, we’re expanding our support to include mobile cross-platform frameworks. We started with Flutter and are now adding React Native as another highly popular frameworks for building truly cross-platform apps.

Getting Started

Getting started with CreativeEditor SDK in React Native is simple! First, make sure you meet the following minimum requirements:

  • React Native: 0.73+
  • iOS: 16+
  • Swift: 5.10 (Xcode 15.4)
  • Android: 7+

Then, add the @imgly/editor-react-native package to your project using your favorite package manager.

To launch the editor, you’ll need an instance of EditorSettings - you can use EditorSettingsModel for convenience. All you need to get started is a license key, which you can obtain from your IMG.LY dashboard.

Here’s an example of opening the Design Editor:


import IMGLYEditor, { EditorSettingsModel } from '@imgly/editor-react-native';

export const openEditor = async (): Promise<void> => {
  const settings = new EditorSettingsModel({ license: 'YOUR_LICENSE_KEY' });
  const result = await IMGLYEditor.openEditor(settings);
};

Editor UI Presets

The React Native plugin builds on our native editor solutions, allowing you to leverage the existing editor UI variants. At launch, you can choose from:

Simply choose the editor solution that best suits your use case. By default, the Design Editor opens, but switching to other solutions is straightforward.

Android and iOS Setup

To setup our module in your application, you’ll need to add the expo-build-properties dependency which handles the necessary adjustments to your native folders.

Android

For Android, you’ll need to make a few adjustments to your app.json:

  • Set the minSdkVersion to 24 (Android 7) or later.
  • Add the IMG.LY Maven repository.
  • Ensure your Kotlin version is compatible (e.g., 1.9.10).

Here’s an example configuration:


{
  "expo": {
    "android": {
      "minSdkVersion": 24,
      "extraMavenRepos": ["<https://artifactory.img.ly/artifactory/maven>"],
      "kotlinVersion": "1.9.10"
    }
  }
}

iOS

On iOS, ensure your deployment target is set to 16.0. You can configure this in your app.json file:


{
  "expo": {
    "ios": {
      "deploymentTarget": "16.0"
    }
  }
}

Check out the Getting Started Guides or the examples on GitHub for a complete reference.

The Only Truly Cross-Platform SDK

If you’re working with React Native, you’re likely focused on faster time to market, reduced development complexity, and feature consistency across platforms. The CreativeEditor SDK shares these goals, using a single, unified creative engine that ensures:

  • Consistent APIs: iOS and Android share the same underlying API.
  • Feature Parity: Core functionality is implemented at the engine level, guaranteeing feature availability across platforms.
  • Interoperable Designs: Export and import designs seamlessly across platforms with consistent rendering.

Fully Customizable UI

The React Native plugin offers flexibility for theming, styling, and integrating callbacks into your editor’s workflow. Soon, we’ll introduce more advanced customization options, such as enabling or disabling features by default.

Refer to our documentation for detailed instructions on customizing the editor to match your branding and use case.

What’s Next?

To showcase the capabilities of our React Native plugin, we’ve prepared a dedicated example application available on GitHub. You can explore it to see the editor in action.

Additionally, our documentation provides all the details needed to get started, and you can visit the @imgly/editor-react-native npm page to begin your integration.

Remember to grab your license from your dashboard after starting a free trial, and let the CreativeEditor SDK unlock your users’ creative potential.

Thanks for reading!

3,000+ creative professionals gain early access to new features and updates—don't miss out, and subscribe to our newsletter.

Related Articles

CE.SDK v1.40 Release Notes
2 min read
CE.SDK v1.39 Release Notes
2 min read
Plugins Part 2: Custom Panels
3 min read

GO TOP