[Huawei Developers] Freemind R:
What is Huawei Image kit?

Nowadays, image editing is a must in image related applications like social media/network apps. To editing images Huawei offers the Image Kit. Huawei Image Kit provides Image Vision service for 24 unique color filters and Image Render service for five basic animations and nine advance animations. Huawei describes the image kit as “HUAWEI Image Kit incorporates powerful scene-specific smart design and animation production functions into your app, giving it the power of efficient image content reproduction while providing a better image editing experience for your users.”. Also all APIs provided by the Image Kit are free of charge.

Restrictions

Image kit supports Huawei devices with HMS Core version 4.0.2 or later and with Android 8 or later. Also Image Kit 1.0.3 version can be used on non-Huawei mobile devices if you add the fallback-SDK dependency.

Image Vision service

Filter: The image size is not greater than 15 MB, the image resolution is not greater than 8000 x 8000, and the aspect ratio is between 1:3 and 3:1.

Smart layout: The aspect ratio is 9:16, and the image size is not greater than 10 MB. If the aspect ratio is not 9:16, the image will be cropped to the aspect ratio of 9:16.

Image tagging: The recommended image resolution is 224 x 224 and the aspect ratio is 1:1.

Image cropping: The recommended image resolution is greater than 800 x 800.

A larger image size can lead to longer parsing and response time as well as higher memory and CPU usage and power consumption.

Image Render service

The recommended image size is not greater than 10 MB. A larger image size can lead to longer parsing and response time as well as higher memory and CPU usage and power consumption, and can even result in frame freezing and black screen. To ensure interactive effects, only full-screen display is supported for animation views; that is, the animation view returned by the Image Render service can only be displayed in full screen. If the performance of a mobile phone is not sufficient for animation recording, set the GIF compression rate to 0.3 or lower and the frame rate to 20 or lower.

For detailed explanations and information on restrictions.

Development Process

[IMG="https://communityfile-dre.op.hicloud.com/FileServer/getFile/cmtybbs/025/620/205/5190090000025620205.20201022092220.84125579841282522079025876616713:50511105012232:2800:B742EBADF5E608566BAF037440B68815AA85CABE9B0FFCB8FCE6B289339419D4.png"]https://communityfile-dre.op.hicloud.com/FileServer/getFile/cmtybbs/025/620/205/5190090000025620205.20201022092220.84125579841282522079025876616713:50511105012232:2800:B742EBADF5E608566BAF037440B68815AA85CABE9B0FFCB8FCE6B289339419D4.png[/IMG]

To start our development of image editing app first, we need to integrate the HMS Core. It is mandatory to use HMS kits and services. You can use these guides to complete integration of HMS Core

After we integrated HMS Core to our project we need to declare required permissions to AndroidManifest.xml file

# Required permissions for Image Vision Service
<uses-permission android:name="android.permission.INTERNET"/>
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
<uses-permission android:name="android.permission.ACCESS_WIFI_STATE"/>
# Required permissions for Image Render Service
<uses-permission android:name="android.permission.INTERNET"/>
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
<uses-permission android:name="android.permission.ACCESS_WIFI_STATE"/>

And finally we need to add dependencies to our application level gradle file. You can take a look at the version changes for Image Kit here.

dependencies{
implementation 'com.huawei.hms:image-render:{version}'
implementation 'com.huawei.hms:image-vision:{version}'
}
//Replace {version} with the actual SDK version of the service you use, for example:
//Image Vision: com.huawei.hms:image-vision:1.0.3.301 - Current version of Image Vision
//Image Render: com.huawei.hms:image-render:1.0.3.301 - Current version of Image Render

When we sync project with gradle files, we are ready to start our coding for simple photo editing application.

Step 1: Base Activity

First we will create a base activity to extend both Image Render and Image Vision functionality. Base activity will contain a function to create a JSONObject which we can simply call authJson. This variable will contain some parameters for authentication.

private var projectDetailsString = "{\"projectId\":\"projectIdTest\",\"appId\":\"appIdTest\",\"authApiKey\":\"authApiKeyTest\",\"clientSecret\":\"clientSecretTest\",\"clientId\":\"clientIdTest\",\"token\":\"tokenTest\"}"
private var authJson: JSONObject? = null
fun initAuthJson() {
try {
authJson = JSONObject(string)
} catch (e: JSONException) {
Log.e(Constants.logTag, e.toString())
}
}

[IMG="https://communityfile-dre.op.hicloud.com/FileServer/getFile/cmtybbs/025/620/205/5190090000025620205.20201022092840.27762391262749571739242849443388:50511105012232:2800:898FC60F2502ECA27FC2A862336E9DF85EDE271223F553399DE7E6E21AE33E69.png"]https://communityfile-dre.op.hicloud.com/FileServer/getFile/cmtybbs/025/620/205/5190090000025620205.20201022092840.27762391262749571739242849443388:50511105012232:2800:898FC60F2502ECA27FC2A862336E9DF85EDE271223F553399DE7E6E21AE33E69.png[/IMG]

? Step 2: Image Render

We will develop Image Render activity first. For that we need to create a path for our sources. Then ask user for permissions, initialize view and initialize authJson by calling “initAuthJson” function.

var sourcePath: String? = null
private val sourcePathName = "sources"
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_render)
sourcePath = filesDir.path + File.separator + sourcePathName
initView()
initAuthJson()
initPermission()
}

To use Image Render capabilities we need to initialize it. We can accomplish this by getting an instance of Image Render. If ImageRender instance is successfully obtained, the onSuccess method will be called and we will call “initRenderView” to initialize our views for render. If anything goes wrong the onFailure method will be called and we can log the error.

var imageRenderAPI: ImageRenderImpl? = null
private fun initImageRender() {
ImageRender.getInstance(this, object : ImageRender.RenderCallBack {
override fun onSuccess(imageRender: ImageRenderImpl?) {
imageRenderAPI = imageRender
initRenderView()
}
override fun onFailure(errorCode: Int) {
Log.e(Constants.logTag, "Error Code: $errorCode")
}
})
}

After a successful attempt we initialized our variable with ImageRender instance and we can start initializing our render view. In “initRenderView” function we will null check our imageRenderAPI variable and if it is good to go we can simply start getting our initialization result. In a successful initialization, result will be “0”. Huawei documentation explain this render view process as “After the getRenderView() API is called, the Image Render service parses the image and script in sourcePath and returns the rendered views to the app. User interaction is supported for advanced animation views, such as particles and ripples. For better interaction effects, it is recommended that the obtained rendered view be displayed in full screen.” Also there is second method to obtain views. If you want an explanation for both method you can take a look at this documentation.

More details. you can check https://forums.developer.huawei.com/forumPortal/en/topicview?tid=0202387480145110483&fid=0101187876626530001&channelname=HuoDong59&ha_source=xda