iOS Creative Editor
Built entirely with SwiftUI, this SDK offers a highly customizable and extendable solution tailored for creating and editing designs on mobile devices. Whether you’re looking to implement basic design editing or full-featured design creation, the SDK is designed to meet your needs.
Explore Demo
Key Capabilities of the iOS Mobile Design Editor SDK#
Transforms
Perform operations like cropping, rotating, and resizing design elements.Templating
Create and apply design templates with placeholders and text variables for dynamic content.Placeholders & Lockable Design
Constrain templates to guide your users’ design and ensure brand consistency.Asset Management
Import and manage images, shapes, and other assets to build your designs.Design Collage
Arrange multiple elements on a single canvas to create complex layouts.Text Editing
Add and style text blocks with various fonts, colors, and effects.Client-Side Processing
All design editing operations are executed directly on the device, with no need for server dependencies.Headless & Automation
Programmatically edit designs within your application using the engine API.Customizable UI
Build and integrate custom UIs tailored to your application’s design needs.Supported Platforms#
The iOS Mobile Design Editor SDK is compatible with applications built using SwiftUI. A UIKit implementation is also available for developers working within that framework.
Prerequisites#
Ensure you have added the IMGLYUI Swift Package to your app. The SDK requires a valid license key and optional unique user IDs for accurate user tracking.
Supported File Types#
The SDK supports various image formats for loading, editing, and exporting within your iOS application, including:
- JPG
- PNG
- SVG
- WEBP
- TGA
Individual assets or entire designs can be exported as PDF, JPG, PNG, TGA or RBG8 binary files.
Understanding the iOS Creative Editor SDK Architecture & API#
The following sections provide an overview of the key components of the iOS Mobile Design Editor UI and its API architecture.
If you're ready to start integrating the SDK into your iOS application, check out our Getting Started guide or dive into the guides section.
Design Editor UI#
The iOS Design Editor UI is built for intuitive and mobile-friendly design creation. Here are the main components and customizable elements within the UI:
- Canvas: The core interaction area where users interact with design content.
- Tool Bar: Provides essential editing options like adjustments, filters, effects or adding text in order of relevance.
- Context Menu: Presents relevant editing options for each selected element, simplifying the editing process for users.
CreativeEngine#
CreativeEngine is the core of the iOS Mobile Editor SDK, responsible for rendering and managing design scenes. It offers features such as:
- Scene Management: Create, load, save, and modify design scenes programmatically.
- Block Management: Manage design elements like shapes, text, and images.
- Asset Management: Load and manage assets such as images and SVGs from various sources.
- Variable Management: Define and manipulate variables for dynamic content within scenes.
- Event Handling: Subscribe to events like block creation or updates for real-time interaction.
Customizing the iOS Mobile Design Editor#
The SDK offers extensive customization options, from simple configuration changes to more advanced customizations involving custom asset sources and hooking into UIEvents.
Role-Based Customization#
Switch between "Creator" and "Adopter" roles to control the editing experience. The "Creator" role allows setting constraints on template elements, while the "Adopter" role is focused on adapting these elements.
- Creator: Set constraints and manage template settings.
- Adopter: Edit elements within the bounds set by the Creator.
Basic Customizations#
Configure the editor by passing a configuration object during initialization:
let settings = EngineSettings(license: secrets.licenseKey,userID: "<your unique user id>",baseURL: URL(string: "https://cdn.img.ly/packages/imgly/cesdk-engine/1.34.0/assets")!)
Explore further customization options by visiting the configuration guide.