Android自定義動態壁紙開發(時鐘)

2019-10-21 21:30:23

字體：大中小

來源：轉載

供稿：網友

看到有些手機酷炫的動態壁紙，有沒有好奇過他們是如何實現的，其實我們自己也可以實現。

先看效果

Android,動態壁紙

上圖是動態壁紙鐘的一個時鐘。

我們先來看看 Livewallpaper（即動態墻紙）的實現，Android的動態墻紙并不是GIF圖片，而是一個標準的Android應用程序，也就是APK。既然是應用程序，當然意味著天生具有GIF圖片不具備的功能——能與用戶發生交互，而且動態的背景變化絕不僅僅局限于GIF圖片那般只能是固定的幾張圖片的循環播放。但是我們在這里沒有加入與用戶交互的動作，只是加入一個時鐘（當然時間取的是系統時間）;

新建android工程;

在res下面新建一個xml文件夾然后新建一個wallpaper.xml 內容如下

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

其中android:thumbnail="@mipmap/heart"是我們在這是壁紙時可以看到的圖標

3. 創建一個MainWallpaper繼承自WallpaperService，并實現onCreateEngine方法，在此方法中我們要實現Engine類并返回。那我們這里就要創建一個MyEgine類繼承Engine，實現他的OnCreate，onVisibilityChanged方法。到此我們就可以在OnCreate 方法中初始化我們的畫筆等，onVisibilityChanged方法中畫出我們想要的效果;

public class MainWallpaper extends WallpaperService {  private static final String TAG = "MainWallpaper";  @Override  public Engine onCreateEngine() {    return new MyEngine();  }  class MyEngine extends Engine implements Runnable{    @Override    public void onCreate(SurfaceHolder surfaceHolder) {      super.onCreate(surfaceHolder);      //這里初始化畫筆等    }     @Override    public void onVisibilityChanged(boolean visible) {      super.onVisibilityChanged(visible);     //這里開始繪制    }  }

當然到此動態壁紙還沒有完成，還有最重要的一步就是配置AndroidManifest.xml，Android動態壁紙的本質是一個“Service”，這個Service能夠被主界面Launcher加載，所以我們應該注冊一個service 如下：

 <service android:label="@string/app_name"android:name="com.demo.mylove.MainWallpaper"android:permission="android.permission.BIND_WALLPAPER">      <!-- 為實時壁紙配置intent-filter -->      <intent-filter>        <action android:name="android.service.wallpaper.WallpaperService" />      </intent-filter>      <!-- 為實時壁紙配置meta-data 沒錯這里wallpaper是我們第一步創建的xml文件-->      <meta-data android:name="android.service.wallpaper"        android:resource="@xml/wallpaper" />    </service>

動態壁紙的創建已完成，那么接下來就要完成我們的時鐘的繪制咯！
在上文中的初始化畫筆位置還有重要步驟就是獲取我們所需要的SurfaceHolder及獲取屏幕的寬高

 WindowManager wm= (WindowManager) getSystemService(WINDOW_SERVICE);      Display display=wm.getDefaultDisplay();      DisplayMetrics displayMetrics=new DisplayMetrics();      display.getMetrics(displayMetrics);      mWidth =displayMetrics.widthPixels;      mHeight =displayMetrics.heightPixels;//獲取SurfaceHolder mHolder=getSurfaceHolder();

那么接下來就是繪制時鐘的（需要放入線程中繪制）

 // 繪制方法    private void drawFrame()    {        // 對畫布加鎖        mCanvas = mHolder.lockCanvas();        if (mCanvas != null)        {          mCanvas.save();          // 繪制背景色          mCanvas.drawColor(0xff000000);          //mCanvas.drawBitmap(BitmapFactory.decodeResource(getResources(),R.mipmap.wall_background),null,mRectF,mPaint);          drawClock();          if (mCanvas != null)            mHolder.unlockCanvasAndPost(mCanvas);        }    }    private void drawClock(Canvas canvas){      mCalendar = Calendar.getInstance();      int second=mCalendar.get(Calendar.SECOND);      int minute=mCalendar.get(Calendar.MINUTE);      int hour=mCalendar.get(Calendar.HOUR);      String time=hour+":"+minute+":"+second;      mCanvas.save();      //畫秒針及間隔      mCanvas.translate(mWidth/2,mHeight/2);//平移畫布的中心位置      float item;//外圈的分割線的長度      for (int i = 0; i< CLOCK_COUNT; i++){//畫間隔        mPaint.setColor(Color.RED);        if(second==i){          mPaint.setColor(Color.BLUE);        }        if (i%15==0){//整點的位置          item=-radius+27;         }else if (i%5==0){//整點中間位置          item=-radius+37;        }else {//其他時間          item=-radius+17;        }        mCanvas.drawLine(0,-radius,0,item,mPaint);        mCanvas.rotate(CLOCK_ROTATE);      }      mCanvas.save();      //畫分針      mCanvas.rotate(minute* CLOCK_ROTATE +(CLOCK_ROTATE /60)*second);      mCanvas.drawLine(0,0,0,-radius/2,mPaint);      mCanvas.restore();      mCanvas.save();      //畫時針      mCanvas.rotate(hour*(360/12)+minute/2);      mCanvas.drawLine(0,0,0,-radius/3,mPaint);      mCanvas.restore();      mCanvas.save();      //畫中心點      mCanvas.drawCircle(0,0,20,mPaint);      //畫時鐘顯示的時間      mCanvas.getTextBounds(time,0,time.length(), mRect);      mCanvas.drawText(time,-mRect.width()/2,radius+40,mPaint);      mCanvas.getTextBounds(TWELVE,0,TWELVE.length(), mRect);      //畫數字12      mCanvas.drawText(TWELVE,-mRect.width()/2,-radius+60,mPaint);      mCanvas.getTextBounds(NINE,0,NINE.length(), mRect);      //畫數字3      mCanvas.drawText(THREE,radius-60,mRect.height()/2,mPaint);      //畫數字6      mCanvas.drawText(SIX,-mRect.width()/2,radius-40,mPaint);      //畫數字9      mCanvas.drawText(NINE,-radius+40,mRect.height()/2,mPaint);         }

到這里只是實現效果，還有一些細節問題，希望有興趣的朋友可以將其完善共同交流;如有更好的實現方法忘不吝賜教

一、動態壁紙原理

如果你了解使用過SurfaceView的話，那么開發一款動態壁紙對你來說其實非常簡單。

動態壁紙的本質其實就是一個服務在維護一個動態壁紙引擎Engine，所以我們看到的動態效果其實是通過這個引擎畫出來的。而維護這個引擎的服務，就是WallpaperService。本篇文章并不討論內部實現原理，只是讓大家知道如何去實現動態壁紙，所以就不詳細說了。

二、實現動態壁紙

大體上可分為三個步驟：

創建自定義WallpaperService繼承WallpaperService
在Manifest中注冊該Service并添加相關屬性
創建所需要的xml文件

1.創建自定義WallpaperService

public class MyLwp extends WallpaperService {  @Override  public Engine onCreateEngine() {    return new MyEngine();  }  class MyEngine extends Engine{    @Override    public SurfaceHolder getSurfaceHolder() {      return super.getSurfaceHolder();    }    @Override    public void onCreate(SurfaceHolder surfaceHolder) {      super.onCreate(surfaceHolder);    }    @Override    public void onDestroy() {      super.onDestroy();    }    @Override    public void onSurfaceChanged(SurfaceHolder holder, int format, int width, int height) {      super.onSurfaceChanged(holder, format, width, height);    }    @Override    public void onSurfaceCreated(SurfaceHolder holder) {      super.onSurfaceCreated(holder);    }    @Override    public void onSurfaceDestroyed(SurfaceHolder holder) {      super.onSurfaceDestroyed(holder);    }  }}

2.Manifest注冊

    <service      android:name=".MyLwp"      android:enabled="true"android:permission="android.permission.BIND_WALLPAPER">      <intent-filter>        <action android:name="android.service.wallpaper.WallpaperService" />      </intent-filter>      <meta-dataandroid:name="android.service.wallpaper"android:resource="@xml/livewallpapervideo" />    </service>

一定要添加的幾個地方：permission、intent-filter、meta-data。

3.創建需要的xml文件

這個xml文件就是Manifest中meta-data中的resource需要的文件：

<?xml version="1.0" encoding="utf-8"?><wallpaper xmlns:android="http://schemas.android.com/apk/res/android"  android:description="@string/app_name"  android:settingsActivity="ASD"  android:thumbnail="@mipmap/ic_launcher"/>

需要注意第二個屬性：settingsActivity，這個屬性可以設置也可以不設置，他是啟動一個設置動態壁紙的界面，一般情況下其實用不到這個界面，我們一般會使用PreferenceActivity去實現。下面是添加該屬性和不添加該屬性的區別：

Android,動態壁紙

完成這些之后，就是我們設計動態壁紙的時候了?；氐阶远x的Wallpaper類中：

我們當時在類中自定義了一個內部類MyEngine繼承自Engine。這個Engine就是用來繪制的。關于Engine的幾個主要方法如下：

  class MyEngine extends Engine{    //獲取SurfaceHolder時調用    @Override    public SurfaceHolder getSurfaceHolder() {      return super.getSurfaceHolder();    }    //手勢移動時回調    @Override    public void onOffsetsChanged(float xOffset, float yOffset, float xOffsetStep, float yOffsetStep, int xPixelOffset, int yPixelOffset) {      super.onOffsetsChanged(xOffset, yOffset, xOffsetStep, yOffsetStep, xPixelOffset, yPixelOffset);    }    //Surface創建時回調    @Override    public void onSurfaceCreated(SurfaceHolder holder) {      super.onSurfaceCreated(holder);    }    //Surface銷毀時回調    @Override    public void onSurfaceDestroyed(SurfaceHolder holder) {      super.onSurfaceDestroyed(holder);    }  }

onOffsetsChanged要注意一下，還記得有的手機滑動桌面時候背景圖片會跟著左右移動嗎，這個方法就可以實現這個效果，在手勢滑動的每一幀都會回調依次。一下是個人理解的參數的含義：

xOffset：x方向滑動的百分比（與桌面分頁數有關）
yOffset：y方向滑動百分比（一般用不到）
xOffsetStep：x方向每個分頁所占的百分比（1 / xOffsetStep = 桌面的分頁數）
yOffsetStep：同
xPixelOffset：x放下像素偏移量
y。。。

4.繪制。

實現繪制的方式，就跟SurfaceView的繪制一樣了：

    @Override    public void onSurfaceCreated(SurfaceHolder holder) {      super.onSurfaceCreated(holder);      Canvas canvas = holder.lockCanvas();      canvas.drawColor(Color.RED);      holder.unlockCanvasAndPost(canvas);    }

我只是簡單的話了一個紅色背景，效果如下：

Android,動態壁紙