Image

The Image Module SDK is a robust and user-friendly tool designed to simplify image manipulation and enhancement within your applications. It brings a wide array of powerful image editing features to developers, allowing for complex transformations and effects with minimal coding effort. Whether you need to crop, rotate, flip, or add custom elements to images, this module provides the necessary capabilities in a streamlined and accessible manner.

Key Features:

  • Crop Image: Easily crop images to your desired aspect ratio and size, ensuring they fit perfectly within your design requirements.

  • Rotate Image: Adjust the orientation of images with simple rotation functionality.

  • Flip Image: Flip images horizontally or vertically to achieve the desired effect.

  • Add Text on Image: Overlay text on images, with customizable font, size, color, and positioning.

  • Draw on Image: Utilize drawing tools to add shapes, lines, or freehand elements directly onto images.

The Image Module SDK is ideal for developers who want to incorporate advanced image editing features into their applications without the need for extensive coding or external libraries.

Adding Module

npm install @trunpm/truvideo-capacitor-image-sdk --registry=https://registry.npmjs.org/ --//registry.npmjs.org/:_authToken=<YOUR_TOKEN>

Import the following dependency in your file, here you will use these function.

import { TruvideoSdkImage } from '@trunpm/truvideo-capacitor-image-sdk'
import { getResultPath } from '@trunpm/truvideo-capacitor-video-sdk';

Get File Path

getFilePath is function which provide file path of the image or video with name which will be platform specific

const resultPathResponse = await getResultPath(`${Date.now()}-editImage.png`);

Launch Image Edit

launchImageEdit function launches the editing screen for image

async function imageEditing() {
  try {
    const resultPathResponse = await getResultPath(`${Date.now()}-editImage.png`);

    const payload = {
      inputPath: selectedImages[0], // input path 
      outputPath: resultPathResponse.result // output path 
    };

    const { result } = await TruvideoSdkImage.editImage(payload);
    console.log("Edited Image Response:", result);
    if (result) toast.success("Process successful!");
  } catch (error) {
    console.error("❌ Failed to Edit Image:", error);
  } finally {
   
  }
}

Last updated

Was this helpful?