Search Docs
Loading...
Skip to content

To JPEG

Export CE.SDK designs to JPEG format when file size matters more than transparency.

5 mins
estimated time
GitHub

JPEG uses lossy compression, which makes it a good fit for photographs, social media images, and web delivery. It does not preserve transparency, so transparent areas become opaque in the exported image.

This guide covers exporting a page to JPEG, tuning quality, resizing the output, and writing the returned ByteBuffer to a file.

Export to JPEG#

Call engine.block.export(...) with MimeType.JPEG to render a page, scene, group, or block as JPEG data. Pass ExportOptions when you want to set the quality explicitly.

suspend fun exportToJpeg(
engine: Engine,
page: DesignBlock,
): ByteBuffer {
val options = ExportOptions(jpegQuality = 0.9F)
val jpegData = engine.block.export(
block = page,
mimeType = MimeType.JPEG,
options = options,
)
check(jpegData.hasRemaining()) { "JPEG export is empty" }
return jpegData
}

The jpegQuality value accepts floats from greater than 0F to 1F. Higher values keep more visual detail and produce larger files; the default is 0.9F.

Export Options#

JPEG export reads these fields from ExportOptions:

Option Type Default Description
jpegQuality Float 0.9F Quality from greater than 0F to 1F
targetWidth Float? null Output width in pixels, used together with height
targetHeight Float? null Output height in pixels, used together with width

Quality Control#

Use jpegQuality = 1.0F when you need maximum quality and can accept the larger file. Values around 0.8F to 0.85F usually work well for web delivery or social media.

suspend fun exportJpegWithQuality(
engine: Engine,
page: DesignBlock,
): ByteBuffer {
val options = ExportOptions(jpegQuality = 1.0F)
val jpegData = engine.block.export(
block = page,
mimeType = MimeType.JPEG,
options = options,
)
check(jpegData.hasRemaining()) { "high-quality JPEG export is empty" }
return jpegData
}

Lower values reduce file size but can introduce visible compression artifacts, especially around text and hard edges.

Target Dimensions#

Set targetWidth and targetHeight together to export at a specific size. CE.SDK renders the block large enough to fill the target size while maintaining the block’s aspect ratio.

suspend fun exportJpegWithTargetDimensions(
engine: Engine,
page: DesignBlock,
): ByteBuffer {
val options = ExportOptions(
jpegQuality = 0.85F,
targetWidth = 1920F,
targetHeight = 1080F,
)
val jpegData = engine.block.export(
block = page,
mimeType = MimeType.JPEG,
options = options,
)
check(jpegData.hasRemaining()) { "target-dimension JPEG export is empty" }
return jpegData
}

If the target aspect ratio differs from the block’s aspect ratio, the exported image extends on one axis to preserve proportions.

Save to File System#

Android receives the export as a ByteBuffer. Write from a read-only duplicate when the same buffer is also needed for validation, upload, or decoding later in your flow.

suspend fun saveJpegToFile(
buffer: ByteBuffer,
outputFile: File,
): File = withContext(Dispatchers.IO) {
outputFile.parentFile?.mkdirs()
val readableBuffer = buffer.asReadOnlyBuffer()
FileOutputStream(outputFile).channel.use { channel ->
while (readableBuffer.hasRemaining()) {
channel.write(readableBuffer)
}
}
check(outputFile.length() > 0L) { "Saved JPEG export is empty" }
outputFile
}

The sample writes into an app-controlled File. Use your app’s own storage, upload, or sharing pipeline when the JPEG should leave local storage.

When to Use JPEG#

JPEG works well for:

  • Photographs and images with gradual color transitions
  • Social media posts and web content
  • Exports where small file size matters more than perfect pixel fidelity

Troubleshooting#

Output looks blurry - Increase jpegQuality toward 1.0F, or use PNG for graphics with hard edges.

File size is too large - Lower jpegQuality toward 0.7F to 0.8F, or reduce dimensions with targetWidth and targetHeight.

Transparent areas look opaque - JPEG does not support alpha. Export PNG when transparent pixels must stay transparent.

API Reference#

API Purpose
engine.block.export(block=_, mimeType=_, options=_) Export one block as JPEG ByteBuffer data
ExportOptions(jpegQuality=_, targetWidth=_, targetHeight=_) Configure JPEG quality and output dimensions

Next Steps#