Overview

Huawei theme development consists of entry-level theme development, advanced live theme development, and professional source code theme development. After downloading the Huawei theme development tool, developers can use it to quickly develop and test entry-level themes. The development process is simple and straightforward, but only still themes can be created. However, with Android Studio, developers can develop professional source code themes following a similar process as that for developing brand new native Android UIs. The themes provide for an extraordinarily interactive user experience, but the development process is difficult and time-consuming.
This codelab describes how to develop a particle effect theme, which is an advanced live theme that is used on a mobile phone lock screen. The development process is less difficult than that for source code themes, and the themes provide for an engaging and interactive user experience. After preparing related image resources, you can develop these themes by configuring an XML script.

What You Will Create

In this codelab, you can create a Huawei live theme to be used on the lock screen. When the user slides their finger across the lock screen on a Huawei mobile phone, the particles on the lock screen move along with the finger.

What you'll learn

During development, you will need to prepare the following resources:

1.Download the particle.rar file.

particle.rar

2.Decompress the particle.rar file.

3.Find and open the manifest.xml file.

4.From line 211 in the manifest.xml file, add the following script for defining particle effects:

<Group visibility="eq(#gs,1)"> <Image src="hb_1.png" x="#touch_x" y="#touch_y" align="center" alignV="center" centerX="0" centerY="80" angle="#gss"/> <Image src="hb_2.png" x="#touch_begin_x+(#touch_x-#touch_begin_x)*0.8" y="#touch_begin_y+(#touch_y-#touch_begin_y)*0.8" align="center" alignV="center" centerX="0" centerY="100" angle="-#gss"/> <Image src="hb_3.png" x="#touch_begin_x+(#touch_x-#touch_begin_x)*0.75" y="#touch_begin_y+(#touch_y-#touch_begin_y)*0.75" align="center" alignV="center" centerX="-60" centerY="80" angle="#gsss"/> <Image src="hb_4.png" x="#touch_begin_x+(#touch_x-#touch_begin_x)*0.7" y="#touch_begin_y+(#touch_y-#touch_begin_y)*0.7" align="center" alignV="center" centerX="40" centerY="-80" angle="-#gsss"/> <Image src="hb_5.png" x="#touch_begin_x+(#touch_x-#touch_begin_x)*0.65" y="#touch_begin_y+(#touch_y-#touch_begin_y)*0.65" align="center" alignV="center" centerX="100" centerY="0" angle="#gss"/> <Image src="hb_6.png" x="#touch_begin_x+(#touch_x-#touch_begin_x)*0.6" y="#touch_begin_y+(#touch_y-#touch_begin_y)*0.6" align="center" alignV="center" centerX="-80" centerY="45" angle="-#gss"/> <Image src="hb_7.png" x="#touch_begin_x+(#touch_x-#touch_begin_x)*0.55" y="#touch_begin_y+(#touch_y-#touch_begin_y)*0.55" align="center" alignV="center" centerX="70" centerY="-10" angle="#gsss"/> <Image src="hb_8.png" x="#touch_begin_x+(#touch_x-#touch_begin_x)*0.5" y="#touch_begin_y+(#touch_y-#touch_begin_y)*0.5" align="center" alignV="center" centerX="-35" centerY="80" angle="-#gsss"/> </Group>

The XML script is described as follows.

5.Pack the theme. That is, compress all of the files in the level-1 directory into a .zip file and change the file name extension to .hwt, for instance, particle.hwt. Note: Make sure that all of the files are compressed into a .zip file, instead of into a .rar file.

Connect your Huawei mobile phone to the computer using a USB cable, and export the theme package to the Internal\Huawei\Themes folder on your phone.

Find and tap the Themes app on your mobile phone.

Go to Me > My themes > Themes and tap the particle effect theme to apply it.

Slide your finger on the lock screen to experience the particle effects for yourself.

Well done. You have successfully completed this codelab, and learned:

Code copied