Android自定義View實(shí)現(xiàn)游戲搖桿鍵盤(pán)的方法示例
前言
本文主要給大家介紹的是關(guān)于Android自定義View實(shí)現(xiàn)游戲搖桿鍵盤(pán)的相關(guān)內(nèi)容,為什么會(huì)有這篇文章呢?因?yàn)樵谥暗囊粋€(gè)項(xiàng)目,操作方向的方式為上下左右,左上需要同時(shí)按住左鍵和右鍵的方式進(jìn)行操作。
如下圖:

近來(lái)需要升級(jí)項(xiàng)目,操作方式改為類(lèi)似王者榮耀的搖桿操作。
如下圖:

好了,下面話(huà)不多說(shuō)了,跟著小編來(lái)一起看看是如何實(shí)現(xiàn)的吧。
繪制背景
實(shí)現(xiàn)遙感按鈕,需要繪制背景,繪制中心的遙感按鈕。繪制遙感背景,需要?jiǎng)?chuàng)建一個(gè)RemoteViewBg類(lèi),存儲(chǔ)背景圖,減少重復(fù)創(chuàng)建bitmap。
RemoteViewBg類(lèi)代碼如下:
public class RemoteViewBg {
private Bitmap bitmapBg;
public RemoteViewBg(Bitmap bitmap) {
bitmapBg = bitmap;
}
//背景的繪圖函數(shù)
public void draw(Canvas canvas, Paint paint, Rect src0 ,Rect dst0 ) {
canvas.drawBitmap(bitmapBg, src0, dst0, paint);
}
}
點(diǎn)擊觸摸事件
重寫(xiě)系統(tǒng)的觸摸時(shí)間,判斷觸摸點(diǎn)在背景范圍內(nèi)還是背景范圍外
@Override
public boolean onTouchEvent(MotionEvent event) {
if (event.getAction() == MotionEvent.ACTION_DOWN || event.getAction() == MotionEvent.ACTION_MOVE) {
// // 在范圍外觸摸
if (Math.sqrt(Math.pow((bigCircleX - (int) event.getX()), 2) + Math.pow((bigCircleY - (int) event.getY()), 2)) >= bigCircleR) {
double tempRad = getRad(bigCircleX, bigCircleY, event.getX(), event.getY());
getXY(bigCircleX, bigCircleY, bigCircleR, tempRad);
} else {//范圍內(nèi)觸摸
smallCircleX = (int) event.getX();
smallCircleY = (int) event.getY();
}
} else if (event.getAction() == MotionEvent.ACTION_UP) {
smallCircleX = bigCircleX;
smallCircleY = bigCircleY;
}
return true;
}
弧度計(jì)算
通過(guò) event.getX() , event.getY()獲得當(dāng)前的觸摸點(diǎn),與圓點(diǎn)進(jìn)行計(jì)算,獲取弧度
/***
* 得到兩點(diǎn)之間的弧度
*/
public float getRad(float px1, float py1, float px2, float py2) {
float x = px2 - px1;
float y = py1 - py2;
//斜邊的長(zhǎng)
float z = (float) Math.sqrt(Math.pow(x, 2) + Math.pow(y, 2));
float cosAngle = x / z;
float rad = (float) Math.acos(cosAngle);
if (py2 < py1) {
rad = -rad;
}
return rad;
}
圖形繪制
通過(guò) canvas.drawCircle()和 canvas.drawBitmap()分別進(jìn)行遙感按鈕和遙感背景的繪制,注意對(duì)遙感背景的保存,如果在繪制的時(shí)候每次BitmapFactory.decodeResource()會(huì)增加耗時(shí),因此只需在surfaceCreated()中進(jìn)行bitmap的生成即可。
public void draw() {
try {
canvas = sfh.lockCanvas();
canvas.drawColor(getResources().getColor(R.color.ghostwhite));
// 指定圖片繪制區(qū)域(左上角的四分之一)
Rect src = new Rect(0, 0, bitmap.getWidth(), bitmap.getHeight());
// 指定圖片在屏幕上顯示的區(qū)域
Rect dst = new Rect(bigCircleX - bigCircleR, bigCircleY - bigCircleR, bigCircleX + bigCircleR, bigCircleY + bigCircleR);
// 繪制圖片
remoteViewBg.draw(canvas, paint, src, dst);
paint.setColor(0x70ff0000);
//繪制搖桿
canvas.drawCircle(smallCircleX, smallCircleY, smallCircleR, paint);
} catch (Exception e) {
// TODO: handle exception
} finally {
try {
if (canvas != null)
sfh.unlockCanvasAndPost(canvas);
} catch (Exception e2) {
e2.printStackTrace();
}
}
}
使用
在activity中動(dòng)態(tài)添加
RelativeLayout relativeLayout = (RelativeLayout) findViewById(R.id.dance_relative_layout); remoteSurfaceView = new RemoteSurfaceView(this); params = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.MATCH_PARENT, RelativeLayout.LayoutParams.MATCH_PARENT); remoteSurfaceView.setLayoutParams(params); relativeLayout.addView(remoteSurfaceView);
全部代碼
public class RemoteSurfaceView extends SurfaceView implements Callback, Runnable {
private float scale = this.getResources().getDisplayMetrics().density;
private Thread th;
private SurfaceHolder sfh;
private Canvas canvas;
private Paint paint;
private boolean flag;
private int bigCircleX = 0;
private int bigCircleY =0;
private int bigCircleR = 0;
//搖桿的X,Y坐標(biāo)以及搖桿的半徑
private float smallCircleX = 0;
private float smallCircleY = 0;
private float smallCircleR = 0;
private Bitmap bitmap;
private RemoteViewBg remoteViewBg;
public RemoteSurfaceView(Context context) {
super(context);
sfh = this.getHolder();
sfh.addCallback(this);
paint = new Paint();
paint.setAntiAlias(true);
setFocusable(true);
setFocusableInTouchMode(true);
setZOrderOnTop(true);
getHolder().setFormat(PixelFormat.TRANSPARENT);
}
public void surfaceCreated(SurfaceHolder holder) {
int width = getWidth();
int height = getHeight();
bigCircleX = width / 2;
bigCircleY = height / 2;
bigCircleR = width / 4;
smallCircleX = width / 2;
smallCircleY = height / 2;
smallCircleR = width / 8;
bitmap = BitmapFactory.decodeResource(getResources(), R.mipmap.fangxiang);
remoteViewBg = new RemoteViewBg(bitmap);
th = new Thread(this);
flag = true;
th.start();
}
/***
* 得到兩點(diǎn)之間的弧度
*/
public float getRad(float px1, float py1, float px2, float py2) {
float x = px2 - px1;
float y = py1 - py2;
//斜邊的長(zhǎng)
float z = (float) Math.sqrt(Math.pow(x, 2) + Math.pow(y, 2));
float cosAngle = x / z;
float rad = (float) Math.acos(cosAngle);
if (py2 < py1) {
rad = -rad;
}
return rad;
}
@Override
public boolean onTouchEvent(MotionEvent event) {
if (event.getAction() == MotionEvent.ACTION_DOWN || event.getAction() == MotionEvent.ACTION_MOVE) {
// 在范圍外觸摸
if (Math.sqrt(Math.pow((bigCircleX - (int) event.getX()), 2) + Math.pow((bigCircleY - (int) event.getY()), 2)) >= bigCircleR) {
double tempRad = getRad(bigCircleX, bigCircleY, event.getX(), event.getY());
getXY(bigCircleX, bigCircleY, bigCircleR, tempRad);
} else {//范圍內(nèi)觸摸
smallCircleX = (int) event.getX();
smallCircleY = (int) event.getY();
}
} else if (event.getAction() == MotionEvent.ACTION_UP) {
smallCircleX = bigCircleX;
smallCircleY = bigCircleY;
}
return true;
}
public void getXY(float x, float y, float R, double rad) {
//獲取圓周運(yùn)動(dòng)的X坐標(biāo)
smallCircleX = (float) (R * Math.cos(rad)) + x;
//獲取圓周運(yùn)動(dòng)的Y坐標(biāo)
smallCircleY = (float) (R * Math.sin(rad)) + y;
}
public void draw() {
try {
canvas = sfh.lockCanvas();
canvas.drawColor(getResources().getColor(R.color.ghostwhite));
// 指定圖片繪制區(qū)域(左上角的四分之一)
Rect src = new Rect(0, 0, bitmap.getWidth(), bitmap.getHeight());
// 指定圖片在屏幕上顯示的區(qū)域
Rect dst = new Rect(bigCircleX - bigCircleR, bigCircleY - bigCircleR, bigCircleX + bigCircleR, bigCircleY + bigCircleR);
// 繪制圖片
remoteViewBg.draw(canvas, paint, src, dst);
paint.setColor(0x70ff0000);
//繪制搖桿
canvas.drawCircle(smallCircleX, smallCircleY, smallCircleR, paint);
} catch (Exception e) {
// TODO: handle exception
} finally {
try {
if (canvas != null)
sfh.unlockCanvasAndPost(canvas);
} catch (Exception e2) {
e2.printStackTrace();
}
}
}
public void run() {
while (flag) {
draw();
try {
Thread.sleep(50);
} catch (Exception ex) {
ex.printStackTrace();
}
}
}
public void surfaceChanged(SurfaceHolder holder, int format, int width, int height) {
}
public void surfaceDestroyed(SurfaceHolder holder) {
flag = false;
}
}
總結(jié)
以上就是這篇文章的全部?jī)?nèi)容,希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能帶來(lái)一定的幫助,如果有疑問(wèn)大家可以留言交流,謝謝大家對(duì)腳本之家的支持。
相關(guān)文章
Android學(xué)習(xí)之介紹Binder的簡(jiǎn)單使用
BInder方面的資料雖然感覺(jué)看的比較多,但是真正用的時(shí)候才發(fā)現(xiàn)有很多地方模棱兩棵的,所以,打算用一個(gè)實(shí)例再來(lái)鞏固一下binder的使用方法。這篇文章主要介紹了Android中Binder的簡(jiǎn)單使用,文中給出詳細(xì)的示例代碼,需要的朋友可以參考下2016-12-12
Android調(diào)試出現(xiàn)The selected device is incompatible問(wèn)題解決
這篇文章主要介紹了Android調(diào)試出現(xiàn)The selected device is incompatible問(wèn)題解決的相關(guān)資料,需要的朋友可以參考下2017-01-01
Android中Volley框架進(jìn)行請(qǐng)求網(wǎng)絡(luò)數(shù)據(jù)的使用
這篇文章主要介紹了Android中Volley框架進(jìn)行請(qǐng)求網(wǎng)絡(luò)數(shù)據(jù)的使用,本文給大家介紹的非常詳細(xì)具有參考借鑒價(jià)值,需要的朋友可以參考下2016-10-10
退出Android程序時(shí)清除所有activity的實(shí)現(xiàn)方法
這篇文章主要介紹了退出Android程序時(shí)清除所有activity的實(shí)現(xiàn)方法,詳細(xì)分析了Android退出時(shí)清除activity的原理與實(shí)現(xiàn)技巧,需要的朋友可以參考下2016-04-04
Android常用定時(shí)器的實(shí)現(xiàn)方式
我們?cè)陂_(kāi)發(fā)中時(shí)常需要寫(xiě)一些定時(shí)的任務(wù),比如每5秒執(zhí)行一次,下面這篇文章主要給大家介紹了關(guān)于Android常用定時(shí)器的實(shí)現(xiàn)方式,文中通過(guò)示例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-09-09
Android中通過(guò)view方式獲取當(dāng)前Activity的屏幕截圖實(shí)現(xiàn)方法
這篇文章主要介紹了Android中通過(guò)view方式獲取當(dāng)前Activity的屏幕截圖實(shí)現(xiàn)方法,本文方法相對(duì)簡(jiǎn)單,容易理解,需要的朋友可以參考下2014-09-09
Android實(shí)現(xiàn)網(wǎng)絡(luò)多線(xiàn)程斷點(diǎn)續(xù)傳下載實(shí)例
本示例介紹在Android平臺(tái)下通過(guò)HTTP協(xié)議實(shí)現(xiàn)斷點(diǎn)續(xù)傳下載。具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下。2016-10-10
模仿美團(tuán)點(diǎn)評(píng)的Android應(yīng)用中價(jià)格和購(gòu)買(mǎi)欄懸浮固定的效果
這篇文章主要介紹了模仿美團(tuán)點(diǎn)評(píng)的Android應(yīng)用中價(jià)格和購(gòu)買(mǎi)欄懸浮固定的效果,文章后半還針對(duì)快速滑動(dòng)操作給出了一個(gè)響應(yīng)優(yōu)化的方法,需要的朋友可以參考下2016-04-04

