Skip to content
ComPDF
Guides

Create Text and Images

ComPDF Flutter SDK provides convenient APIs to create text and image content.

Create Text

This method inserts a new text area on a specified page. It creates a new text box within the page coordinate system and writes the given text content into it. The coordinate origin (0, 0) is located at the bottom-left corner of the page.

Parameters:

  • pageIndex: The index of the target page where text will be inserted, starting from 0.
  • content: The text content to insert.
  • offset: The position of the bottom-left corner of the text area in the PDF page coordinate system (in points).
  • maxWidth: The maximum width of the text area. Text will automatically wrap when it exceeds this width. If null, the width is not limited.
  • attr: Text attributes such as font size, color, alignment, etc. Uses standard CPDFEditorTextAttr configuration by default.

Example:

dart
bool result = await document.createNewTextArea(
  pageIndex: 0,
  content: 'ComPDF Insert Text This is a test to create a text area...',
  offset: const Offset(50, 800),
  maxWidth: 300,
  attr: const CPDFEditorTextAttr(
    fontSize: 18,
    fontColor: Colors.red,
    alignment: CPDFAlignment.left,
  ),
);

Note: Currently, version 2.6.0 only supports the Android platform. iOS platform support will be added in future versions.

Create Images

This method inserts a new image area on a specified page. It creates a new image box within the page coordinate system. The coordinate origin (0, 0) is located at the bottom-left corner of the page.

Parameters:

  • pageIndex: The index of the target page where the image will be inserted, starting from 0.
  • imageData: The image data to insert. Supports multiple formats:
    • File path: CPDFImageData.fromPath('/path/to/image.png')
    • Base64: CPDFImageData.fromBase64('iVBORw0KGgo...')
    • Asset file: CPDFImageData.fromAsset('assets/images/logo.png')
    • Uri (Android): CPDFImageData.fromUri('content://...')
  • offset: The position of the bottom-left corner of the image area in the PDF page coordinate system (in points).
  • width: The width of the image area. Height is automatically calculated based on the image's aspect ratio. If null, the image's original width is used.

Example:

  • Create from file path
dart
bool result1 = await document.createNewImageArea(
  pageIndex: 0,
  imageData: CPDFImageData.fromPath('/path/to/image.png'),
  offset: const Offset(50, 700),
  width: 200,
);
  • Create from Base64
dart
bool result2 = await document.createNewImageArea(
  pageIndex: 1,
  imageData: CPDFImageData.fromBase64('iVBORw0KGgoAAAANSUhEUgAAAAUA...'),
  offset: const Offset(100, 600),
  width: 150,
);
  • Create from assets file
dart
bool result3 = await document.createNewImageArea(
  pageIndex: 2,
  imageData: CPDFImageData.fromAsset('logo.png'),
  offset: const Offset(200, 500),
  width: null, // Use original width
);

Note: Currently, version 2.6.0 only supports the Android platform. iOS platform support will be added in future versions.

Content Insertion Interaction Control

In content editing mode, clicking on a PDF page area will automatically create a text input box or pop up an image selector for quick content insertion. In version 2.6.0, you can disable this functionality with the following configuration options:

dart
CPDFConfiguration(
    modeConfig: const CPDFModeConfig(
      initialViewMode: CPDFViewMode.viewer,
    ),
    readerViewConfig: CPDFReaderViewConfig(
      enableCreateImagePickerDialog: false,
      enableCreateEditTextInput: false
    )
  );