快捷導(dǎo)航

Android 游戲開發(fā)中繪制游戲觸摸軌跡的曲線圖

更新時間：2016年08月22日 15:28:50 投稿：lqh

本文主要介紹 Android 繪制游戲觸摸軌跡的曲線圖的簡單示例，這里詳細說明使用方法，并附示例代碼，有需要的小伙伴可以參考下

本篇文章主要來講解怎樣繪制游戲觸摸軌跡的曲線圖。

我們在onTouchEvent方法中，可以獲取到觸摸屏幕時手指觸摸點的x、y坐標(biāo)，如何用這些點形成一條無規(guī)則軌跡并把這條無規(guī)則軌跡曲線顯示在屏幕上就是本篇文章的主旨內(nèi)容。

Android Path類

Android提供了一個Path類，顧名思義這個類可以設(shè)置曲線路徑軌跡。任何無規(guī)則的曲線實際上都是由若干條線段組成，而線段的定義為兩點之間最短的一條線。path類就可以記錄這兩點之間的軌跡，那么若干個Path 就是我們須要繪制的無規(guī)則曲線。

下面介紹一下API 中path類設(shè)置軌跡路徑的方法。

public class

       Path
       extends Object
       java.lang.Object
       android.graphics.Path

quadTo(float x1, float y1, float x2, float y2)
Add a quadratic bezier from the last point, approaching control point (x1,y1), and ending at (x2,y2).

解釋：

參數(shù)1 軌跡起始點X坐標(biāo)

參數(shù)2 軌跡起始點Y坐標(biāo)

參數(shù)3 軌跡結(jié)束點X坐標(biāo)

參數(shù)4 軌跡結(jié)束點Y坐標(biāo)

所以根據(jù)這個參數(shù)就可以設(shè)置一條線段軌跡。

分步講解

為了設(shè)置一條比較圓滑好看的曲線我們需要對游戲畫筆進行一些設(shè)置。注釋已經(jīng)在代碼中寫的很清楚了，在這里我詳細說一下設(shè)置畫筆風(fēng)格 mPaint.setStyle(Paint.Style.STROKE); 意思是設(shè)置畫筆的風(fēng)格 android 畫筆一共提供了三種風(fēng)格Paint.Style.STROKE 、Paint.Style.FILL、Paint.Style.FILL_AND_STROKE 意思分別為空心、實心、實心與空心。如果不設(shè)置的話默認為 Paint.Style.FILL，在這里必須設(shè)置成空心。因為如果一旦設(shè)置成實心或者實心與空心那么畫筆會把path路徑中間包住這樣就不是曲線線段了，所以大家注意一下這里。

Java代碼

/** 創(chuàng)建曲線畫筆 **/ 
mPaint = new Paint(); 
mPaint.setColor(Color.BLACK); 
/**設(shè)置畫筆抗鋸齒**/ 
mPaint.setAntiAlias(true); 
/**畫筆的類型**/ 
mPaint.setStyle(Paint.Style.STROKE); 
/**設(shè)置畫筆變?yōu)閳A滑狀**/ 
mPaint.setStrokeCap(Paint.Cap.ROUND); 
/**設(shè)置線的寬度**/ 
mPaint.setStrokeWidth(5);

在觸摸按下事件中通過moveTo() 方法設(shè)置觸摸屏幕點為軌跡的起始點，這樣在觸摸移動事件中設(shè)置曲線的軌跡起始點為上次觸摸點結(jié)束點為本次觸摸點。使用quadTo方法記錄每次移動產(chǎn)生的一個曲線線段然后將所有的曲線線段繪制在屏幕中，如果觸摸抬起將調(diào)用reset()方法重置曲線軌跡。

Java代碼

@Override 
public boolean onTouchEvent(MotionEvent event) { 
 /** 拿到觸摸的狀態(tài) **/ 
 int action = event.getAction(); 
 float x = event.getX(); 
 float y = event.getY(); 
 switch (action) { 
 // 觸摸按下的事件 
 case MotionEvent.ACTION_DOWN: 
 /**設(shè)置曲線軌跡起點 X Y坐標(biāo)**/ 
 mPath.moveTo(x, y); 
 break; 
 // 觸摸移動的事件 
 case MotionEvent.ACTION_MOVE: 
 /**設(shè)置曲線軌跡**/ 
 //參數(shù)1 起始點X坐標(biāo) 
 //參數(shù)2 起始點Y坐標(biāo) 
 //參數(shù)3 結(jié)束點X坐標(biāo) 
 //參數(shù)4 結(jié)束點Y坐標(biāo) 
 mPath.quadTo(mposX, mposY, x, y); 
 break; 
 // 觸摸抬起的事件 
 case MotionEvent.ACTION_UP: 
 /**按鍵抬起后清空路徑軌跡**/ 
 mPath.reset(); 
 break; 
 } 
 //記錄當(dāng)前觸摸X Y坐標(biāo) 
 mposX = x; 
 mposY = y; 
 return true; 
}

游戲繪制中調(diào)用drawPath方法將onTouchEvent中記錄的路徑曲線繪制在屏幕當(dāng)中。

Java代碼

private void Draw() { 
 /**清空畫布**/ 
 mCanvas.drawColor(Color.WHITE); 
 /**繪制曲線**/ 
 mCanvas.drawPath(mPath, mPaint); 
 /**記錄當(dāng)前觸點位置**/ 
 mCanvas.drawText("當(dāng)前觸筆 X：" + mposX, 0, 20,mTextPaint); 
 mCanvas.drawText("當(dāng)前觸筆 Y：" + mposY, 0, 40,mTextPaint); 
}

代碼的整體實現(xiàn)

詳細的注釋已經(jīng)在代碼中寫出歡迎大家閱讀喔哇咔咔~~~~

Java代碼

import android.app.Activity; 
import android.content.Context; 
import android.graphics.Canvas; 
import android.graphics.Color; 
import android.graphics.Paint; 
import android.graphics.Path; 
import android.os.Bundle; 
import android.view.MotionEvent; 
import android.view.SurfaceHolder; 
import android.view.SurfaceView; 
import android.view.Window; 
import android.view.WindowManager; 
import android.view.SurfaceHolder.Callback; 
public class SurfaceViewAcitvity extends Activity { 
 MyView mAnimView = null; 
 @Override 
 public void onCreate(Bundle savedInstanceState) { 
 super.onCreate(savedInstanceState); 
 // 全屏顯示窗口 
 requestWindowFeature(Window.FEATURE_NO_TITLE); 
 getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, 
  WindowManager.LayoutParams.FLAG_FULLSCREEN); 
 // 顯示自定義的游戲View 
 mAnimView = new MyView(this); 
 setContentView(mAnimView); 
 } 
 public class MyView extends SurfaceView implements Callback,Runnable { 
  /**每50幀刷新一次屏幕**/ 
 public static final int TIME_IN_FRAME = 50; 
 /** 游戲畫筆 **/ 
 Paint mPaint = null; 
 Paint mTextPaint = null; 
 SurfaceHolder mSurfaceHolder = null; 
 /** 控制游戲更新循環(huán) **/ 
 boolean mRunning = false; 
 /** 游戲畫布 **/ 
 Canvas mCanvas = null; 
 /**控制游戲循環(huán)**/ 
 boolean mIsRunning = false; 
 /**曲線方向**/ 
 private Path mPath; 
 private float mposX, mposY; 
 public MyView(Context context) { 
  super(context); 
  /** 設(shè)置當(dāng)前View擁有控制焦點 **/ 
  this.setFocusable(true); 
  /** 設(shè)置當(dāng)前View擁有觸摸事件 **/ 
  this.setFocusableInTouchMode(true); 
  /** 拿到SurfaceHolder對象 **/ 
  mSurfaceHolder = this.getHolder(); 
  /** 將mSurfaceHolder添加到Callback回調(diào)函數(shù)中 **/ 
  mSurfaceHolder.addCallback(this); 
  /** 創(chuàng)建畫布 **/ 
  mCanvas = new Canvas(); 
  /** 創(chuàng)建曲線畫筆 **/ 
  mPaint = new Paint(); 
  mPaint.setColor(Color.BLACK); 
  /**設(shè)置畫筆抗鋸齒**/ 
  mPaint.setAntiAlias(true); 
  /**畫筆的類型**/ 
  mPaint.setStyle(Paint.Style.STROKE); 
  /**設(shè)置畫筆變?yōu)閳A滑狀**/ 
  mPaint.setStrokeCap(Paint.Cap.ROUND); 
  /**設(shè)置線的寬度**/ 
  mPaint.setStrokeWidth(5); 
  /**創(chuàng)建路徑對象**/ 
  mPath = new Path(); 
  /** 創(chuàng)建文字畫筆 **/ 
  mTextPaint = new Paint(); 
  /**設(shè)置顏色**/ 
  mTextPaint.setColor(Color.BLACK); 
  /**設(shè)置文字大小**/ 
  mTextPaint.setTextSize(15); 
 } 
 @Override 
 public boolean onTouchEvent(MotionEvent event) { 
  /** 拿到觸摸的狀態(tài) **/ 
  int action = event.getAction(); 
  float x = event.getX(); 
  float y = event.getY(); 
  switch (action) { 
  // 觸摸按下的事件 
  case MotionEvent.ACTION_DOWN: 
  /**設(shè)置曲線軌跡起點 X Y坐標(biāo)**/ 
  mPath.moveTo(x, y); 
  break; 
  // 觸摸移動的事件 
  case MotionEvent.ACTION_MOVE: 
  /**設(shè)置曲線軌跡**/ 
  //參數(shù)1 起始點X坐標(biāo) 
  //參數(shù)2 起始點Y坐標(biāo) 
  //參數(shù)3 結(jié)束點X坐標(biāo) 
  //參數(shù)4 結(jié)束點Y坐標(biāo) 
  mPath.quadTo(mposX, mposY, x, y); 
  break; 
  // 觸摸抬起的事件 
  case MotionEvent.ACTION_UP: 
  /**按鍵抬起后清空路徑軌跡**/ 
  mPath.reset(); 
  break; 
  } 
  //記錄當(dāng)前觸摸X Y坐標(biāo) 
  mposX = x; 
  mposY = y; 
  return true; 
 } 
 private void Draw() { 
  /**清空畫布**/ 
  mCanvas.drawColor(Color.WHITE); 
  /**繪制曲線**/ 
  mCanvas.drawPath(mPath, mPaint); 
  /**記錄當(dāng)前觸點位置**/ 
  mCanvas.drawText("當(dāng)前觸筆 X：" + mposX, 0, 20,mTextPaint); 
  mCanvas.drawText("當(dāng)前觸筆 Y：" + mposY, 0, 40,mTextPaint); 
 } 
 @Override 
 public void surfaceChanged(SurfaceHolder holder, int format, int width, 
  int height) { 
 } 
 @Override 
 public void surfaceCreated(SurfaceHolder holder) { 
  /**開始游戲主循環(huán)線程**/ 
  mIsRunning = true; 
  new Thread(this).start(); 
 } 
 @Override 
 public void surfaceDestroyed(SurfaceHolder holder) { 
  mIsRunning = false; 
 } 
 @Override 
 public void run() { 
  while (mIsRunning) { 
  /** 取得更新游戲之前的時間 **/ 
  long startTime = System.currentTimeMillis(); 
  /** 在這里加上線程安全鎖 **/ 
  synchronized (mSurfaceHolder) { 
   /** 拿到當(dāng)前畫布 然后鎖定 **/ 
   mCanvas = mSurfaceHolder.lockCanvas(); 
   Draw(); 
   /** 繪制結(jié)束后解鎖顯示在屏幕上 **/ 
   mSurfaceHolder.unlockCanvasAndPost(mCanvas); 
  } 
  /** 取得更新游戲結(jié)束的時間 **/ 
  long endTime = System.currentTimeMillis(); 
  /** 計算出游戲一次更新的毫秒數(shù) **/ 
  int diffTime = (int) (endTime - startTime); 
  /** 確保每次更新時間為50幀 **/ 
  while (diffTime <= TIME_IN_FRAME) { 
   diffTime = (int) (System.currentTimeMillis() - startTime); 
   /** 線程等待 **/ 
   Thread.yield(); 
  } 
  } 
 } 
 } 
}

看懂并掌握了這些代碼實例后，相信大家對如何繪制游戲觸摸軌跡的曲線圖有了方法上的認識了，希望大家在Android游戲開發(fā)中自如的運用它們。

以上就是小編對繪制游戲觸摸軌跡的曲線圖的資料整理，后續(xù)繼續(xù)補充相關(guān)資料，謝謝大家對本站的支持！

您可能感興趣的文章: