前面已經(jīng)了解過<a href="http://www.reibang.com/p/05aa77075fe5">SurfaceView</a>了,今天這里就直接開始通過Canvas來實現(xiàn)繪圖相關的東西蹬竖，我這里主要就是通過實現(xiàn)一個游戲來完成Canvas的學習。
<b>1.創(chuàng)建一個GameView的類并且繼承SurfaceView灰伟。</b>
<b>2.創(chuàng)建一個管理游戲背景的類DrawBackground</b>
package com.tangyx.game.holder;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Canvas;
import com.tangyx.game.util.BitmapUtils;
import com.tangyx.game.util.ScreenUtils;
/**
* Created by tangyx on 2016/12/22.
*
*/
public class DrawBackground extends DrawGame {
private Bitmap mBackgroundTop;
private Bitmap mBackgroundBottom;
/**
* 因為背景是全屏的呆奕，并且飛機是一直在往上運動，所以X坐標不需要運動偏窝，只需要改變y的坐標來完成運動效果
*/
private float mTopY;
private float mBottomY;
/**
* 背景移動速度
*/
private float mSpeedBY=4;
public DrawBackground(Context context,String background){
super(context);
//加載背景圖片
mBackgroundBottom = BitmapUtils.ReadBitMap(context,background);
//把背景圖大小設置為手機屏幕大小
mBackgroundBottom = BitmapUtils.getBitmap(getContext(), mBackgroundBottom,0);
//把背景圖在垂直翻轉生成一張新的圖片
mBackgroundTop = BitmapUtils.getScaleMap(mBackgroundBottom);
}
@Override
void initialize() {
mBottomY = 0;
/**
* 第一張背景放在屏幕的頂部外面
*/
mTopY = -ScreenUtils.getScreenHeight(getContext());
mSpeedBY=4;
}
@Override
void onDraw(Canvas canvas) {
//背景是一張圖片收恢，所以我們應該通過canvas的drawBitmap來實現(xiàn)，
// 景的圖片其實一直是一張圖片在由上至下運動祭往，通過兩張圖片鏈接進行循環(huán)
canvas.drawBitmap(mBackgroundBottom,0, mBottomY,mPaint);
canvas.drawBitmap(mBackgroundTop,0, mTopY,mPaint);
}
@Override
void updateGame() {
mBottomY +=mSpeedBY;
mTopY +=mSpeedBY;
//當mBackgroundBottom已經(jīng)移動出屏幕就自動設置到屏幕之外的最頂部伦意。
if(mBottomY >= ScreenUtils.getScreenHeight(getContext())){
mBottomY = -ScreenUtils.getScreenHeight(getContext());
}
//mBackgroundTop已經(jīng)移動出屏幕就自動設置到屏幕之外的最頂部。
if(mTopY >= ScreenUtils.getScreenHeight(getContext())){
mTopY = -ScreenUtils.getScreenHeight(getContext());
}
}
}
它繼承了DrawGame硼补，這是我自定義的一個抽象類驮肉，因為后面可能不會的內容都需要繼承它來進行規(guī)范管理。
package com.tangyx.game.holder;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
/**
* Created by tangyx on 2016/12/22.
*
*/
public abstract class DrawGame {
private Context mContext;
protected Paint mPaint;
public DrawGame(Context context) {
this.mContext = context;
mPaint = new Paint();
mPaint.setColor(Color.WHITE);
initialize();
}
/**
* 初始化內容
*/
abstract void initialize();
/**
* 繪制內容
* @param canvas
*/
abstract void onDraw(Canvas canvas);
/**
* 數(shù)據(jù)更新
*/
abstract void updateGame();
public Context getContext() {
return mContext;
}
}
<b>3.說一下游戲背景的實現(xiàn)的思路：</b>
通過選擇的場景在DrawBackground中加載得到一個圖片的對象mBackgroundBottom已骇，然后再通過getScaleMap得到mBackgroundBottom垂直翻轉的新對象mBackgroundTop离钝，getScaleMap在BitmapUtils工具類中。
初始化這兩張圖片的位置褪储，整個屏幕的可見區(qū)域卵渴，肯定只能顯示一張圖片（mBackgroundBottom），那另一張呢（mBackgroundTop）鲤竹？由于飛機的感覺是一直向上飛行的感覺浪读，所以地圖應該一直感覺在往下運動，我們就需要去改變兩種圖片在surface中Y的坐標實現(xiàn)動畫效果宛裕，所以另一張圖片就在屏幕頂部的最上方瑟啃。
通過updateGame去增加Y的坐標，判斷哪一張圖片移動到屏幕之外了就立刻移動到屏幕最頂部的上方揩尸。通過這樣的邏輯就能實現(xiàn)地圖無限循環(huán)蛹屿。
<b>在GameView中使用</b>
最后附上<a >源碼</a>
再次重復一下，學習Canvas有一定的過程岩榆，源碼是通過git持續(xù)更新错负，如果有什么不太明白，你可以查看前面的文章勇边。
下一節(jié)將會講解主角的邏輯以及手勢控制犹撒，如果你也喜歡就一起來學習吧。
<b>學習是生活的一種態(tài)度</b>
<a href="http://www.reibang.com/p/05aa77075fe5">上一篇</a> <a href="http://www.reibang.com/p/8b65e7e73f70">下一篇</a>
