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

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

好了,下面話不多說(shuō)了,跟著小編來(lái)一起看看是如何實(shí)現(xiàn)的吧。
繪制背景
實(shí)現(xiàn)遙感按鈕,需要繪制背景,繪制中心的遙感按鈕。繪制遙感背景,需要?jiǎng)?chuàng)建一個(gè)RemoteViewBg類,存儲(chǔ)背景圖,減少重復(fù)創(chuàng)建bitmap。
RemoteViewBg類代碼如下:
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)擊觸摸事件
重寫系統(tǒng)的觸摸時(shí)間,判斷觸摸點(diǎn)在背景范圍內(nèi)還是背景范圍外
@Overridepublic 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;}@Overridepublic 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ì)VEVB武林網(wǎng)的支持。
新聞熱點(diǎn)
疑難解答
圖片精選
網(wǎng)友關(guān)注