Convert to PNG - iOS | IMG.LY Docs

import Foundation
import IMGLYEngine

@MainActor
func conversionToPng(engine: Engine) async throws {
  try engine.editor.setSettingString("basePath", value: "https://cdn.img.ly/packages/imgly/cesdk-engine/1.74.1/assets")
  try await engine.addDefaultAssetSources()
  let sceneUrl =
    URL(string: "https://cdn.img.ly/assets/demo/v1/ly.img.template/templates/cesdk_postcard_1.scene")!
  try await engine.scene.load(from: sceneUrl)

  let page = try engine.scene.getCurrentPage()!
  let pngData = try await engine.block.export(page, mimeType: .png)

  let pages = try engine.scene.getPages()
  var exportedPages: [Data] = []
  for try await data in try await engine.block.export(pages, mimeType: .png) {
    exportedPages.append(data)
  }

  let compressedOptions = ExportOptions(pngCompressionLevel: 9)
  let compressedData = try await engine.block.export(page, mimeType: .png, options: compressedOptions)

  let resizedOptions = ExportOptions(targetWidth: 1920, targetHeight: 1080)
  let resizedData = try await engine.block.export(page, mimeType: .png, options: resizedOptions)

  let overhangOptions = ExportOptions(allowTextOverhang: true)
  let overhangData = try await engine.block.export(page, mimeType: .png, options: overhangOptions)
}

Export designs to PNG format with lossless quality and optional transparency support.

5 mins

estimated time

GitHub

PNG is a lossless image format that preserves image quality and supports transparency. It’s ideal for designs requiring pixel-perfect fidelity, logos, graphics with transparent backgrounds, and any content where quality cannot be compromised.

This guide covers how to export designs to PNG and configure export options using the Engine API.

Export to PNG#

Use engine.block.export(_:mimeType:) to export a design block to PNG. The method returns Data containing the image.

let page = try engine.scene.getCurrentPage()!
let pngData = try await engine.block.export(page, mimeType: .png)

Export All Pages#

Export all pages in a scene using the batch export API. Pass the full array of page IDs to engine.block.export(_:mimeType:), which returns an AsyncThrowingStream of blobs.

let pages = try engine.scene.getPages()
var exportedPages: [Data] = []
for try await data in try await engine.block.export(pages, mimeType: .png) {
  exportedPages.append(data)
}

The batch API reuses a single worker engine for all exports, making it more memory efficient than exporting pages individually.

Compression Level#

Control the file size versus export speed tradeoff using pngCompressionLevel in ExportOptions. Valid values are 0-9, where higher values produce smaller files but take longer to export. Since PNG is lossless, image quality remains unchanged.

let compressedOptions = ExportOptions(pngCompressionLevel: 9)
let compressedData = try await engine.block.export(page, mimeType: .png, options: compressedOptions)

The default compression level is 5, providing a good balance between file size and export speed.

Target Dimensions#

Resize the output by setting targetWidth and targetHeight. The block scales to fill the target dimensions while maintaining its aspect ratio.

let resizedOptions = ExportOptions(targetWidth: 1920, targetHeight: 1080)
let resizedData = try await engine.block.export(page, mimeType: .png, options: resizedOptions)

Both values must be set together. A value of 0 (the default) uses the block’s native size.

Text Overhang#

Decorative fonts sometimes have glyphs that extend beyond their frame. Set allowTextOverhang to true to prevent clipping these glyphs during export.

let overhangOptions = ExportOptions(allowTextOverhang: true)
let overhangData = try await engine.block.export(page, mimeType: .png, options: overhangOptions)

API Reference#

API	Description
`engine.block.export(_:mimeType:options:)`	Exports a single block to `Data` with the specified options
`engine.block.export(_:mimeType:options:)` (batch)	Exports multiple blocks, returning an `AsyncThrowingStream` of `Data`
`engine.scene.getCurrentPage()`	Returns the current page block ID
`engine.scene.getPages()`	Returns all page block IDs in the scene
`ExportOptions(pngCompressionLevel:targetWidth:targetHeight:allowTextOverhang:)`	Configures PNG export options

Next Steps#

Conversion Overview - Learn about other export formats
To PDF - Export designs to PDF format
Export Overview - Understand the full export workflow

To PNG