Android launcher development (3) livewallpaper bubble flow effect

Recently, I have been studying laucher applications. Today I wrote the wallpaper in four components. The implementation of static wallpaper is relatively simple and I will not describe it here. after referring to the system source code, I made a simple live Wallpaper: bubble flow effect. the pattern is relatively simple, but the basic principle can be extended in this example, such as 3D animation effects, complex touch change animation events. If you are interested, you can try it.

The approximate effect is as follows. At the beginning, four bubbles will appear in the direction of the four corners, and then move along a certain route. When the screen is removed, the bubbles will start to appear with new coordinates, this achieves a simple Bubble Floating effect:

Implementation ideas:

1. Create an android project. Note that traditional layout files are not required for live wallpaper.

2. Create an XML folder under Res and create a livewallpaper. xml file as follows:

<?xml version="1.0" encoding="utf-8"?><wallpaper xmlns:android="http://schemas.android.com/apk/res/android" android:thumbnail="@drawable/icon"/>

Note: here, the Android: thumbnail is worth the small icon of your dynamic wallpaper that will appear when you select the dynamic wallpaper. You can also leave this attribute unspecified.

3. To implement live wallpaper, you do not need to use activity. Create the livewallpaper class to inherit the wallpaperservice:

Implement the oncreateengine () method and return the self-implemented engine class

Call the drawframe () method of drawing a graph in the oncreate () method of the engine class.

Defines the starting coordinates of the four circles. When drawframe () is called each time, the circular coordinates are changed. The image is re-drawn using mhandler. postdelayed (drawtarget, 100). The UI is updated.

The Code is as follows:

1. androidmanifest. xml

<? XML version = "1.0" encoding = "UTF-8"?> <Manifest xmlns: Android = "http://schemas.android.com/apk/res/android" package = "org. crazyit. desktop "Android: versioncode =" 1 "Android: versionname =" 1.0 "> <applicationandroid: icon =" @ drawable/icon "Android: label = "@ string/app_name"> <! -- Configure real-time wallpaper service --> <service android: Label = "@ string/app_name" Android: Name = ". livewallpaper "Android: Permission =" android. permission. bind_wallpaper "> <! -- Configure intent-filter for the live wallpaper --> <intent-filter> <actionandroid: Name = "android. Service. wallpaper. wallpaperservice"/> </intent-filter> <! -- Configure meta-data for the live wallpaper --> <meta-data Android: Name = "android. service. wallpaper "Android: Resource =" @ XML/livewallpaper "/> </service> </Application> </manifest>

2. xml file of the wallpaper: livewallpaper. xml

<?xml version="1.0" encoding="utf-8"?><wallpaper xmlns:android="http://schemas.android.com/apk/res/android" android:thumbnail="@drawable/icon"/>

3. livewallpaper class for live wallpapers:

Import android. graphics. canvas; import android. graphics. paint; import android. OS. handler; import android. service. wallpaper. wallpaperservice; import android. view. motionevent; import android. view. surfaceholder;/***** @ author Tian **/public class livewallpaper extends wallpaperservice {// The abstract method public engine oncreateengine () required to implement wallpaperservice () {// return the custom enginereturn new myengine ();} class myengine extends Engine {// specifies whether the private Boolean mvisible is visible on the program interface; // specifies the location where the current user action event is recorded. Private float mtouchx =-1; private float mtouchy =-1; // record the position of the current circle. // the upper-left coordinate private float cx1 = 15; private float cy1 = 20; // The lower-right coordinate private float CX2 = 300; private float cy2 = 380; // coordinates in the upper right corner: Private float cx3 = 300; private float cy3 = 20; // coordinates in the lower left corner: Private float cx4 = 15; private float cy4 = 380; // define the paint brush private paint mpaint = new paint (); // define an H Andlerhandler mhandler = new handler (); // defines a periodically executed task private final runnable drawtarget = new runnable () {public void run () {// draw the drawing drawframe () ;};@ overridepublic void oncreate (surfaceholder) {super. oncreate (surfaceholder); // initialize the paint brush mpaint. setcolor (0 xffffffff); mpaint. setantialias (true); mpaint. setstrokewidth (2); mpaint. setstrokecap (paint. cap. round); mpaint. setstyle (paint. style. stroke );// Settoucheventsenabled (true);} @ overridepublic void ondestroy () {super. ondestroy (); // Delete the callback mhandler. removecallbacks (drawtarget) ;}@ overridepublic void onvisibilitychanged (Boolean visible) {mvisible = visible; // when the interface is visible, run the drawframe () method. If (visible) {// dynamically draw a drawing drawframe ();} else {// If the interface is invisible, delete the callback mhandler. removecallbacks (drawtarget);} public void onoffsetschanged (float xoffset, float yoffset, float xstep, float ystep, int xpixels, int ypixels) {drawframe ();} public void ontouchevent (motionevent event) {// If the sliding operation if (event. getaction () = motionevent. action_move) {mtouchx = event. getx (); mtouchy = event. gety ();} else {mtouchx =-1; mtouchy =-1 ;} Super. ontouchevent (event);} // defines the graphical rendering tool method private void drawframe () {// obtains the surfaceholderfinal surfaceholder holder = getsurfaceholder (); canvas c = NULL; try {// lock the canvas c = holder. lockcanvas (); If (C! = NULL) {C. save (); // draw the background color C. drawcolor (0xff000000); // draw the circle drawtouchpoint (c) at the touch point; // draw the Circle C. drawcircle (cx1, cy1, 80, mpaint); C. drawcircle (CX2, cy2, 40, mpaint); C. drawcircle (cx3, cy3, 50, mpaint); C. drawcircle (cx4, cy4, 60, mpaint); C. restore () ;}} finally {If (C! = NULL) Holder. unlockcanvasandpost (c);} mhandler. removecallbacks (drawtarget); // The next re-drawing if (mvisible) {cx1 + = 6; cy1 + = 8; // If cx1 and cy1 are removed from the screen, start again from the upper left corner. If (cx1> 320) cx1 = 15; If (cy1> 400) cy1 = 20; CX2-= 6; cy2-= 8; // If CX2 and cy2 are removed from the screen, re-start from the lower right corner if (CX2 <15) CX2 = 300; If (cy2 <20) cy2 = 380; cx3-= 6; cy3 + = 8; // If cx3 and cy3 are removed from the screen, re-start from the upper right corner if (cx3 <0) cx3 = 300; If (cy3> 400) cy3 = 20; cx4 + = 6; cy4-= 8; // If cx4 and cy4 are removed from the screen, start again from the lower left corner if (cx4> 320) cx4 = 15; if (cy4 <0) cy4 = 380; // After 0.1 seconds, run mdrawcube again. postdelayed (drawtarget, 100) ;}// draw the circle private void drawtouchpoint (canvas c) {If (mtouchx> = 0 & mtouchy> = 0) at the screen touch point) {c. drawcircle (mtouchx, mtouchy, 40, mpaint );}}}}

In this way, we basically achieved a dynamic wallpaper: Bubble Floating effect.

However, this is just a small example of getting started. If you want to achieve the commercial effect, there are still many aspects to be optimized:

1. Draw More Complex Images

2. Use 3D animation Effects

3. Color needs to be enriched

4. I used the postdelay (runnable, millsecond) method of handler to update the UI. Although there is little code to be implemented here, it is inefficient and the screen is still not smooth enough.

However, I have limited energy, so I have provided code here. I hope that interested friends can improve it, or provide specific solutions for discussion.