Color your photos with stickers-Huawei Image Kit

Kübra Kızılca
Huawei Developers
Published in
3 min readDec 9, 2020

HUAWEI Image Kit incorporates smart image editing and design as well as animation capabilities into your app, giving it the power of efficient image content reproduction while providing a better image editing experience for your users.

Use Cases

Image postprocessing

  • Provides more than 20 distinct effects for image processing, achieving high-quality image content reproduction.
  • Implements smart layout of images and texts for efficient content production.
  • Provides the sticker and text art function for image DIY.
  • Implements theme tagging for images and objects in images for convenient retrieval.
  • Implements image cropping for users to resize images.

Theme design

  • Applies animations to lock screens, wallpapers, and themes.

Image Kit does not provide sticker and text art resources. You need to design and generate stickers and text arts in compliance with the specifications provided by Huawei. But Huawei supply sample stickers. You can find how to develop stickers and sample stickers in this link.

Today I will show you how to add, delete and save stickers to photos. Let’s start. First of all, please follow these steps to create an app on App Gallery.

When using Image Kit on a mobile phone where the HMS Core (APK) is installed, add the SDK dependency. When using Image Kit on a device where the HMS Core (APK) is not installed, add the fallback-SDK dependency. The service dependency configuration is as follows. Image Vision service:

  • SDK:

com.huawei.hms:image-vision:1.0.3.301

  • fallback-SDK:

com.huawei.hms:image-vision:1.0.3.301

com.huawei.hms:image-vision-fallback:1.0.3.301

The implementation of all APIs of the sticker service is based on StickerLayout, which is a custom view. The imported service package is com.huawei.hms.image.vision.sticker.StickerLayout, which can be directly integrated into the XML of the layout. Now, let’s create a layout file.

Download the sample stickers from this link and add your project as a assets .You can change some features in theme.xml file:

Now we need to set stickers to recyclerview.

Add click method to recyclerview item, I mean to stickers. Selected stickers will be invoked to be added.

We added to sticker.

Call the addSticker API with resource file path and file name to add stickers and text arts. If the return code is 0, the operation is successful. A maximum of 50 stickers and text arts can be added. For other result codes check the table.

To delete all attached stickers

To save attached stickers with image

Bonus

You can change the text in stickers.

Output

Conclusion

Image Kit allows users to scale, drag, or delete stickers and text arts and customize the text of text arts.

I tried to tell how to use stickers with Image Kit. I hope you enjoy :)

For more information about HMS Image Kit Vision Service please refer to :

--

--