當(dāng)我做了一個(gè)網(wǎng)頁(yè)版的地鐵跑酷：一窺Web前端游戲開發(fā)的魅力
---
**開篇：挑戰(zhàn)與樂(lè)趣并存的Web游戲開發(fā)**
在Web前端領(lǐng)域，將一款流行的移動(dòng)游戲——“地鐵跑酷”搬到網(wǎng)頁(yè)平臺(tái)上，無(wú)疑是一項(xiàng)充滿挑戰(zhàn)與創(chuàng)新的任務(wù)。本文將以一個(gè)實(shí)際項(xiàng)目為例，詳細(xì)解析如何利用HTML5、CSS3和JavaScript構(gòu)建網(wǎng)頁(yè)版的地鐵跑酷游戲，以此展示W(wǎng)eb前端技術(shù)在游戲開發(fā)中的強(qiáng)大功能和無(wú)限可能。在這個(gè)過(guò)程中，我們將涉及到游戲循環(huán)、物理模擬、動(dòng)畫制作以及用戶交互等諸多技術(shù)點(diǎn)，通過(guò)具體的代碼示例，帶領(lǐng)讀者一步步走進(jìn)這個(gè)生動(dòng)活潑的游戲世界。
---
**【第一部分】搭建游戲環(huán)境與場(chǎng)景**
**標(biāo)題：HTML5 Canvas作為畫布**
首先，我們需要?jiǎng)?chuàng)建一個(gè)HTML5 `<canvas>` 元素作為游戲畫面的主要載體：
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>網(wǎng)頁(yè)版地鐵跑酷</title>
<style>
canvas {
display: block;
margin: auto;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
</style>
</head>
<body>
<canvas id="gameCanvas" width="800" height="600"></canvas>
<script src="game.js"></script>
</body>
</html>
```
接下來(lái)，在`game.js`文件中初始化canvas上下文并設(shè)置游戲的基本畫布尺寸：
```javascript
const canvas=document.getElementById('gameCanvas');
const ctx=canvas.getContext('2d');
// 設(shè)置游戲幀率
const FPS=60;
const FRAME_TIME=1000 / FPS;
// 游戲主循環(huán)
function gameLoop() {
update();
draw();
requestAnimationFrame(gameLoop);
}
function update() {
// 更新游戲邏輯（例如角色位置、障礙物移動(dòng)等）
}
function draw() {
ctx.clearRect(0, 0, canvas.width, canvas.height);
// 繪制游戲場(chǎng)景和角色（比如地鐵軌道、背景、玩家角色等）
}
// 啟動(dòng)游戲循環(huán)
gameLoop();
```
---
**【第二部分】游戲角色與動(dòng)作設(shè)計(jì)**
**標(biāo)題：JavaScript與動(dòng)畫藝術(shù)**
創(chuàng)建游戲角色對(duì)象，并使用requestAnimationFrame進(jìn)行逐幀動(dòng)畫處理：
```javascript
class Player {
constructor(x, y, speed) {
this.x=x;
this.y=y;
this.speed=speed;
this.spritesheet=new Image();
this.spritesheet.src='path/to/player-spritesheet.png';
this.currentFrame=0;
this.frameWidth=32; // 假設(shè)每個(gè)動(dòng)畫幀寬32像素
this.frameHeight=48; // 假設(shè)每個(gè)動(dòng)畫幀高48像素
this.numberOfFrames=8; // 假設(shè)有8個(gè)動(dòng)畫幀
}
draw(ctx) {
let sourceX=this.currentFrame * this.frameWidth;
let sourceY=0; // 根據(jù)實(shí)際情況指定源區(qū)域的y坐標(biāo)
ctx.drawImage(
this.spritesheet,
sourceX, sourceY, this.frameWidth, this.frameHeight,
this.x, this.y, this.frameWidth, this.frameHeight
);
// 模擬動(dòng)畫效果，每幀切換下一幀
this.currentFrame=(this.currentFrame + 1) % this.numberOfFrames;
}
move(direction) {
// 根據(jù)方向更新角色的位置
}
}
```
---
**【第三部分】游戲物理模擬與碰撞檢測(cè)**
**標(biāo)題：基于Box2D Lite的物理引擎**
為了實(shí)現(xiàn)逼真的運(yùn)動(dòng)效果和碰撞檢測(cè)，我們可以引入輕量級(jí)的2D物理引擎如Box2D Lite或其他JavaScript物理庫(kù)。這里僅簡(jiǎn)述原理：
- 初始化物理世界和物體屬性（質(zhì)量、形狀、摩擦力等）
- 使用物理引擎計(jì)算角色與障礙物之間的碰撞反應(yīng)
- 將物理世界的更新同步到視覺上的位置變化
```javascript
// 簡(jiǎn)化的物理世界模型（實(shí)際使用時(shí)需引入Box2D或其他庫(kù)）
class PhysicsWorld {
// ...
update() {
// 計(jì)算所有物體的位置變化
// 檢測(cè)并處理碰撞事件
}
}
// 在update()方法中同步物理狀態(tài)到視覺表現(xiàn)
function update() {
physicsWorld.update();
player.move(playerDirection);
player.draw(ctx);
// 更新其他游戲元素的位置和狀態(tài)
// 處理障礙物碰撞后的得分或游戲結(jié)束邏輯
}
```
---
**【第四部分】用戶輸入與交互**
**標(biāo)題：鍵盤控制與觸屏手勢(shì)識(shí)別**
- 使用addEventListener監(jiān)聽鍵盤事件，實(shí)現(xiàn)玩家角色的左右移動(dòng)與跳躍操作。
```javascript
document.addEventListener('keydown', (event)=> {
if (event.key==='ArrowLeft') {
playerDirection.left=true;
} else if (event.key==='ArrowRight') {
playerDirection.right=true;
} else if (event.key==='Space') {
player.jump();
}
});
document.addEventListener('keyup', (event)=> {
if (event.key==='ArrowLeft' || event.key==='ArrowRight') {
playerDirection.left=false;
playerDirection.right=false;
}
});
```
- 對(duì)于觸摸設(shè)備，可以監(jiān)聽touchstart、touchmove和touchend事件，轉(zhuǎn)換為相應(yīng)的操作指令。
---
**結(jié)語(yǔ)：**
完成一個(gè)網(wǎng)頁(yè)版的地鐵跑酷不僅需要扎實(shí)的Web前端技術(shù)功底，更需要對(duì)游戲設(shè)計(jì)和用戶體驗(yàn)的深刻理解。通過(guò)本篇文章的介紹，我們見證了HTML5、JavaScript和相關(guān)庫(kù)的強(qiáng)大之處，它們共同賦予了網(wǎng)頁(yè)游戲豐富的動(dòng)態(tài)表現(xiàn)和沉浸式的用戶體驗(yàn)。同時(shí)，也希望這篇文章能激發(fā)更多前端開發(fā)者探索Web游戲開發(fā)的熱情，一同創(chuàng)造出更多富有創(chuàng)意和技術(shù)含量的網(wǎng)頁(yè)游戲作品。在編程的世界里，游戲也可以成為一種深度學(xué)習(xí)和表達(dá)的方式，讓我們的技術(shù)之旅更加有趣且充實(shí)。
你做過(guò)哪些別人認(rèn)為無(wú)聊且自己又很享受的事情？”
這條知乎提問(wèn)的下方的一個(gè)回答引起了我的注意，“用電腦運(yùn)行虛擬機(jī)，在虛擬機(jī)里運(yùn)行安卓模擬器，然后用電腦運(yùn)行的安卓模擬器運(yùn)行安卓上的psp模擬器，再用電腦運(yùn)行的安卓模擬器上的psp模擬器運(yùn)行psp上的nds模擬器。”這原本只是一條搞怪的回答，不過(guò)真的有這么一群試圖跨越障礙的玩家，而且現(xiàn)在平臺(tái)間的鴻溝隨著商業(yè)行為介入，門檻已然變得越來(lái)越低。
■什么是手機(jī)模擬器？
白河愁Duo是游戲視頻網(wǎng)站“斗魚”上的一位游戲主播，出于愛好他喜歡在網(wǎng)站上直播游戲視頻。解說(shuō)《英雄聯(lián)盟》對(duì)戰(zhàn)是他的主場(chǎng)，但偶爾也會(huì)直播掌機(jī)和手游。以前講解手游的時(shí)候，由于屏幕小，只能用攝像頭對(duì)著手機(jī)拍，效果非常不好。但從2014年年初開始，白河愁Duo接觸到了Android模擬器，于是嘗試用模擬器在電腦上演示手游玩法，因?yàn)榉奖阒庇^得到觀眾的歡迎。
白河愁Duo使用了一款名為“靠譜助手”的軟件，實(shí)際上是一款A(yù)ndroid操作系統(tǒng)模擬器，下載安裝到PC端后，玩家就能像在手機(jī)上玩游戲那樣直接在自己的PC上玩各種手游。手指的點(diǎn)觸、滑動(dòng)等操作就由鼠標(biāo)直接代勞，鼠標(biāo)點(diǎn)擊模擬手指在屏幕上的點(diǎn)擊；按住鼠標(biāo)左鍵拖動(dòng)，模擬手機(jī)上的劃屏；而按住右鍵拖動(dòng)，模擬將手機(jī)左右傾斜的操作。
在PC上玩一些特殊設(shè)備的游戲，早就是很多PC用戶駕輕就熟的一項(xiàng)技能。有懷舊的玩家喜歡在模擬器上玩NDS上的破解游戲，一些中年玩家會(huì)用諸如ZSES模擬器來(lái)重溫SFC上的游戲。理論上如果PC的性能超過(guò)其他設(shè)備，就能用PC來(lái)順利模擬其他設(shè)備上面的游戲和應(yīng)用。
手游也不例外，世面上諸如Android SDK、Bluestacks、海馬玩、靠譜助手等軟件正在試圖把整個(gè)Android系統(tǒng)搬到PC平臺(tái)上來(lái)。只要你有一臺(tái)PC，就能在PC上模擬運(yùn)行Android系統(tǒng)上絕大部分的應(yīng)用和游戲。這些軟件能夠在電腦模擬Android操作系統(tǒng)，你能像在Android系統(tǒng)上一樣安裝、使用、卸載Android軟件，除了不能拍照、打電話、使用USB、藍(lán)牙等功能外，幾乎你能想到的功能它都支持。也就是說(shuō)，如果你想直接在PC上玩到《天天酷跑》、《刀塔傳奇》等市面上的這些熱門手游，現(xiàn)在幾乎沒(méi)有任何障礙。
在諸多的安卓系統(tǒng)模擬器中，一個(gè)不能繞過(guò)的應(yīng)用是Android SDK，它是Android官方推出的Android模擬器，用以方便開發(fā)者在電腦上模擬Android軟件的運(yùn)行、調(diào)配代碼在用戶界面實(shí)際的運(yùn)行效果以及應(yīng)用和游戲的開發(fā)和測(cè)試。
Android Studio上的SDK，在電腦上模擬Android系統(tǒng)的運(yùn)行
而最早面向普通游戲玩家的Android模擬器名作Bluestacks，軟件的Alpha版本最早發(fā)布于2011年10月，由曾經(jīng)擔(dān)任Intel CTO的Rosen Sharma領(lǐng)導(dǎo)制作。它基于VirtualBox軟件開發(fā)，用戶直接能在PC、電視上模擬Android系統(tǒng)。它在中國(guó)的子公司藍(lán)疊中國(guó)發(fā)布了藍(lán)疊安卓模擬器（BlueStacks），讓手機(jī)上的應(yīng)用游戲在Windows操作系統(tǒng)上快速并全屏運(yùn)行。然而，除了單純用鼠標(biāo)模擬手勢(shì)操作，這家外來(lái)企業(yè)并沒(méi)有為中國(guó)玩家的“本地化需求”作出相應(yīng)的調(diào)整。
同樣依托VirtualBox改造的海馬玩，也是一款A(yù)ndroid模擬器，除了支持PC上的Windows系統(tǒng)外，還支持Mac電腦上的OS X系統(tǒng)。海馬玩和海馬助手屬于同一家公司，就像破解手游那樣，海馬玩對(duì)于國(guó)人手游的需用進(jìn)行了許多本土化的改造。
一款A(yù)ndroid模擬器中關(guān)于手勢(shì)操作的說(shuō)明
在海馬玩的操作系統(tǒng)中有預(yù)裝的同名應(yīng)用商店、能直接在玩手游前預(yù)設(shè)好游戲的手勢(shì)操作，比如玩《地鐵跑酷》時(shí)候，您能把上下左右滑動(dòng)，分別預(yù)設(shè)為WSAD，把在電腦上費(fèi)力繁瑣的手勢(shì)滑動(dòng)，直接簡(jiǎn)化鍵盤操作。而在玩一些某些動(dòng)作游戲的時(shí)候，把各種技能的按鍵位置直接用鍵盤上的按鍵代替，同時(shí)還能把虛擬搖桿拖到手機(jī)游戲中來(lái)——就像在電腦上玩DNF那樣，在PC上直接玩各類移動(dòng)游戲。屏幕大、鍵盤操作手感更好，也是許多人愿意用PC玩手游的原因。
類似依托于應(yīng)用商店模式的還有靠譜助手，它在自定義鍵位的基礎(chǔ)上，加入了模擬手機(jī)傾斜操作的自定義按鍵，方便電腦玩家嘗試一些需要需要陀螺儀感應(yīng)的游戲。
■不在少數(shù)的模擬器手游玩家
盡管智能手機(jī)在國(guó)內(nèi)已經(jīng)非常普及，但是依然還有人樂(lè)此不疲地在PC上玩手機(jī)游戲。通過(guò)百度指數(shù)的搜索指數(shù)佐證，最近半年搜索“安卓模擬器”的用戶數(shù)平均大概每天有9000多人，在國(guó)內(nèi)相當(dāng)于一款中型手游的關(guān)鍵詞搜索量。如果搜索《刀塔傳奇》電腦版，或者《時(shí)空獵人》電腦版，最近半年內(nèi)平均每天搜索玩家有超過(guò)1000多人。而在淘寶上搜索“安卓模擬器”，排名靠前三家的銷量顯示，有接近300名消費(fèi)者已成功收貨。
不在少數(shù)的手游玩家并不是真的抱緊PC不放而不愿意嘗試移動(dòng)設(shè)備，他們的構(gòu)成比我們想象的要復(fù)雜：一種玩家是和筆者認(rèn)識(shí)的玩家張成一樣，他的手機(jī)買的比較早，配置比較差，玩不了需要高配置的手機(jī)游戲，在電腦上玩手游就成了他的一種消遣方式；另一種人和我的一位同事一樣，平時(shí)只用iOS設(shè)備，沒(méi)有額外的Android手機(jī)，但偶爾要測(cè)試Android游戲的時(shí)候就用模擬器來(lái)測(cè)試。
《部落戰(zhàn)爭(zhēng)》電腦版上的外掛程序
還有一群玩家在模擬器上玩游戲不僅是因?yàn)槠聊槐容^大視覺效果更好，而是因?yàn)橛械氖钟翁焐透m合在電腦上玩。比如在電腦上習(xí)以為常的射擊游戲——在《全民突擊》之前一直沒(méi)有比較叫好的產(chǎn)品，就是受限于在手機(jī)調(diào)整準(zhǔn)心的操作設(shè)計(jì)天生就不太適合觸屏，像Gameloft的《現(xiàn)代戰(zhàn)爭(zhēng)》也只是因?yàn)楸容^成功地模仿了《使命召喚》而獲得名聲，但它的玩家依然不是中國(guó)手游市場(chǎng)的主力消費(fèi)群體。而這樣的操作難題落實(shí)在模擬器上，它就不再是難題——用鼠、鍵盤和自定義的快捷鍵完全可以解決和一切。有的Android模擬器還能自定義射擊游戲的準(zhǔn)星和射擊按鍵，調(diào)整后用模擬器全屏玩《現(xiàn)代戰(zhàn)爭(zhēng)5》的時(shí)候，甚至有種在PC上玩《穿越火線》的錯(cuò)覺。
當(dāng)然這只是普通玩家的最基本的需要，模擬器還有更多高階用法，滿足一些比較奇怪的需求。比如多開，如果你已經(jīng)有Android設(shè)備，然后再用模擬器打開多個(gè)窗口，就能一個(gè)人玩一些需要組隊(duì)才能進(jìn)行的戰(zhàn)役，讓自己和自己對(duì)戰(zhàn)。而和認(rèn)識(shí)的人一起，利用模擬器把原本需要四個(gè)人參與的副本一個(gè)人就完成了；或者直接和身邊的人組隊(duì)，利用方便交流的特征玩一些需要配合的游戲，欺負(fù)外人，也就是在游戲里開黑。
外掛作弊也是延伸而來(lái)的另一類需求，在電腦上開發(fā)手游外掛程序經(jīng)過(guò)多年演變已經(jīng)成為一條很成熟的“產(chǎn)品線”。某些操作比較簡(jiǎn)單的游戲通過(guò)模擬器配合按鍵精靈等作弊工具，能夠完成許多費(fèi)時(shí)繁瑣的操作。在模擬器中直接插入諸如按鍵精靈、叉叉助手（一種Android游戲外掛工具）之類的軟件也能在后臺(tái)直接運(yùn)行。在一個(gè)模擬器的論壇中，一位玩家貼出了《部落沖突》的電腦版輔助外掛，外掛直接模擬玩家的常規(guī)操作——造兵、自動(dòng)搜索進(jìn)攻死魚玩家（死魚指在《部落沖突》中把大量資源設(shè)施放在防御設(shè)施外，方便其他玩家搶奪的資源的游戲玩家），自動(dòng)保持在線、自動(dòng)收金、收水等這些功能，用模擬器+外掛比用Android手機(jī)玩游戲效率還高不少。
在Android模擬器中對(duì)于準(zhǔn)心、按鍵、搖桿自定義設(shè)計(jì)
還有些格外小心謹(jǐn)慎的Android的用戶，對(duì)于涉及隱私的手游，就安裝在模擬器中先測(cè)試完全沒(méi)有風(fēng)險(xiǎn)，或者根本不想讓別人知道自己玩這款游戲。而主流的Android的模擬器對(duì)外都主打大屏幕、不費(fèi)電、省流量，來(lái)招徠游戲玩家。對(duì)于這群對(duì)電量、手機(jī)流量敏感的用戶，有條件也更愿意在Android模擬器上玩手游。而且很多模擬器都內(nèi)置安卓市場(chǎng)，其中提供了部分游戲的破解版本，游戲中通常有無(wú)限的金幣和已解鎖的付費(fèi)道具，吸引很多不愿付費(fèi)的玩家在上面玩游戲。
現(xiàn)在的模擬器已經(jīng)進(jìn)化到很人性的程度，諸如在海馬玩模擬器中你能隨意調(diào)整Android屏幕的顯示分辨率；用側(cè)邊欄的“一鍵搖一搖”功能；模仿晃動(dòng)手機(jī)的操作；預(yù)設(shè)手勢(shì)按鍵；為射擊游戲設(shè)置準(zhǔn)心按鍵；為動(dòng)作設(shè)置虛擬搖桿。在模擬器中你還能設(shè)置你的地理位置，比如玩怪物彈珠臺(tái)服的時(shí)候，你能把模擬器的地區(qū)設(shè)置在臺(tái)灣的某個(gè)地方，這樣就容易組隊(duì)了。而靠譜助手提供了游戲視頻錄制，以及對(duì)模擬陀螺儀感應(yīng)的按鍵設(shè)置，基本手機(jī)能做的是，模擬器基本都能實(shí)現(xiàn)。
■Android模擬器是一門好生意
在國(guó)內(nèi)外給玩家提供Android模擬器，并不是本著極客的目的給玩家?guī)ケ憷摹；贏ndroid模擬器帶來(lái)的用戶量，Bluestacks進(jìn)一步開發(fā)了一款基于Android系統(tǒng)的電視盒子，類似Amazon Fire TV、小米盒子那樣，你能在電視上播放電影，玩Android系統(tǒng)上的種類繁多的游戲。在2014年6月，這家公司已經(jīng)拿到三星的1300萬(wàn)美元的投資。
而在國(guó)內(nèi)的針對(duì)模擬器的另一套類似渠道的玩法，讓過(guò)去只有小撮玩家才會(huì)玩的模擬器在今天變成了一門生意。早年游戲運(yùn)營(yíng)商并不喜歡玩家在模擬器上玩，那時(shí)候模擬器渠道雜亂無(wú)章，一些不可知的問(wèn)題、崩潰和賬號(hào)風(fēng)險(xiǎn)都轉(zhuǎn)嫁到運(yùn)營(yíng)商的頭上，給了游戲運(yùn)營(yíng)方帶來(lái)額外的麻煩。而現(xiàn)在潛伏各方的雜兵逐漸被整編成有規(guī)制的“正規(guī)軍”，發(fā)行商和開發(fā)商坐在一起商量怎么賺玩家的錢。一位暢銷榜表現(xiàn)還不錯(cuò)的手游的運(yùn)營(yíng)人員告訴我：“在模擬器上玩手游的人大概在千分之一甚至不少，相對(duì)整體玩家是很小的規(guī)模。其實(shí)玩家愛怎么玩就怎么玩唄，只要充錢就行”。
Bluestacks中國(guó)在首頁(yè)說(shuō)明自己的業(yè)務(wù)模式
首當(dāng)其沖的Bluestacks的中國(guó)子公司藍(lán)疊中國(guó)，就對(duì)外公開其賺錢方式：手游開發(fā)上或者渠道商有需要提高日活躍用戶和付費(fèi)率需求，簡(jiǎn)單的說(shuō)就是發(fā)展更多的用戶。他們直接把模擬器和熱門手游封裝在一起，直接轉(zhuǎn)換成可以在PC上直接可玩的手游，名曰“XX手游電腦版”的名義，在一些游戲論壇和軟件下載站發(fā)放，讓更多玩家參與進(jìn)來(lái)。
國(guó)內(nèi)模擬器通常會(huì)有一個(gè)小的應(yīng)用市場(chǎng)，在這個(gè)市場(chǎng)中開發(fā)商和發(fā)行商會(huì)開展聯(lián)運(yùn)合作——諸如海馬玩和九游直接合作，由九游發(fā)行的游戲會(huì)在模擬器提供的應(yīng)用商店中有更好的排名，模擬器吸引來(lái)的PC玩家，在模擬器上的手游營(yíng)收，渠道會(huì)和模擬器開展利潤(rùn)分成。模擬器也能直接給渠道帶量，從而按照手游的裝載量直接付費(fèi)。海馬玩的工作人員告訴記者，他們目前的日活用戶大概在4萬(wàn)人左右。他們已經(jīng)提供讓Android手機(jī)作為游戲手柄，輔助來(lái)玩Android模擬器。而且還計(jì)劃讓iOS手機(jī)用戶，通過(guò)他們的模擬器玩Android系統(tǒng)上的游戲。
截至今天Windows 10的發(fā)布，微軟花了2年多的時(shí)間才徹底打通PC和移動(dòng)平臺(tái)間的界限，而模擬器早就已經(jīng)做到了。當(dāng)然，這只是一種戲謔的說(shuō)法。當(dāng)現(xiàn)存需求可以變現(xiàn)時(shí)，平臺(tái)間的差異鴻溝就不會(huì)成為障礙，你手中的任意一塊屏幕都可能是另一款屏幕的延伸、擴(kuò)展甚至替代品。問(wèn)題是當(dāng)使用者出于各自不同的目的，去看待同一個(gè)刻板的技術(shù)時(shí)，他們眼眸中反射的倒影卻是各自不同的形態(tài)。
萄游戲廳自上線以來(lái)一直為各位玩家提供適配好的手柄游戲服務(wù)，發(fā)展將近兩年中，不斷收到玩家對(duì)一些游戲的按鍵映射方式提出一些建議，雖然葡萄君嚴(yán)謹(jǐn)?shù)膮⒖剂薠BOX、PS主機(jī)游戲?qū)Σ煌愋陀螒虻氖直存I功能來(lái)適配，但仍難免會(huì)有些玩家有自己的習(xí)慣和喜好，另外基于安卓手機(jī)設(shè)備分辨率的多元化，在有些手機(jī)上葡萄適配好的按鍵無(wú)法生效。今天葡萄君就來(lái)教大家如何在游戲中自定義按鍵，手柄怎么玩，自己說(shuō)了算～
首先進(jìn)入游戲后按手柄START鍵調(diào)出葡萄菜單，可以看到部分游戲多了一個(gè)選項(xiàng)【按鍵設(shè)置】
點(diǎn)擊進(jìn)入可以設(shè)置神鍵綁定、快速提示鍵、鼠標(biāo)開關(guān)鍵、幫助菜單、自定義按鍵等功能
其中，【自定義按鍵】就是今天重點(diǎn)介紹的功能：
點(diǎn)擊進(jìn)入后可以看到葡萄已經(jīng)適配好的各按鍵的坐標(biāo)位置。這時(shí)，如果你想修改一個(gè)按鍵的功能或位置，只需按住拖動(dòng)并點(diǎn)擊手柄按鍵即可。
如果你想改變此按鍵在游戲中的動(dòng)作時(shí)，長(zhǎng)按虛擬按鍵即可調(diào)出按鍵行為選項(xiàng)，這里你可以設(shè)置為觸摸模式、按鍵模式和滑動(dòng)模式。
觸摸模式：即通常手游中的虛擬按鍵
按鍵模式：即針對(duì)于原生手柄游戲的按鍵功能
滑動(dòng)模式：即游戲中需要手指滑動(dòng)所產(chǎn)生的行為，比如地鐵跑酷
如果你想添加一個(gè)按鍵，只需從設(shè)置界面頂部的
，按住并拖到你想映射的位置上即可
搖桿的設(shè)置與按鍵一樣，拖到游戲中虛擬搖桿的位置就可以啦，還可通過(guò)手柄Y鍵和A鍵來(lái)調(diào)整大小，適應(yīng)不同游戲搖桿的直徑。
另外，一個(gè)游戲你還可以多種配置，隨時(shí)切換。
自定義功能很簡(jiǎn)單，只需手指點(diǎn)擊、拖拽即可完成自己喜歡的操控方式，游戲怎么玩，由你來(lái)做主！