自從2019年微信公開(kāi)課Pro在微信之夜演示《跳一跳》以來(lái)，微信小游戲已經(jīng)不知不覺(jué)走過(guò)的三年，這三年中我們可以明顯看到微信對(duì)小游戲的扶持，對(duì)于微信開(kāi)發(fā)者來(lái)說(shuō)，微信小游戲開(kāi)發(fā)以及成為了必備技能之一。
5月22日的《HelloWorld公開(kāi)課》，騰訊云TVP，《小程序從0到1：微信全棧工程師一本通》作者李藝?yán)蠋熅徒棠悖绾螐?開(kāi)發(fā)一款微信小游戲項(xiàng)目
創(chuàng)建項(xiàng)目
工欲善其事必先利其器，在正式開(kāi)發(fā)游戲之前，我們要先到微信公眾平臺(tái)去注冊(cè)賬號(hào)，并下載相關(guān)開(kāi)發(fā)工具。然后通讀一遍微信小游戲開(kāi)發(fā)文檔，看微信官方為我們提供了哪些開(kāi)發(fā)支持。
微信小游戲開(kāi)發(fā)文檔：
https://developers.weixin.qq.com/miniprogram/dev/devtools/devtools.html
接下來(lái)我們開(kāi)始創(chuàng)建項(xiàng)目，通過(guò)下面的圖片可以看到，微信官方已經(jīng)自動(dòng)幫我們創(chuàng)建了一個(gè)項(xiàng)目模板，然后通過(guò)調(diào)試基礎(chǔ)庫(kù)，我們要勾選圖片中所示的選項(xiàng)，這些都是在開(kāi)發(fā)小游戲時(shí)必不可少的工具。
項(xiàng)目結(jié)構(gòu)與調(diào)試代碼
通過(guò)這個(gè)小游戲demo，我們可以看到如下圖所示的項(xiàng)目結(jié)構(gòu)，其中audio是音頻文件，存儲(chǔ)了游戲中所需要的音頻，images是圖片文件，游戲中所需要的圖片，比如我們這個(gè)小游戲中的飛機(jī)、地圖等圖片都存在這個(gè)文件夾中。
下面的JS文件夾就是項(xiàng)目的源碼了，main.js是整個(gè)游戲項(xiàng)目的主類(lèi)，libs是開(kāi)發(fā)中常用的一些庫(kù)。下面的NPC文件就是游戲中實(shí)現(xiàn)角色的文件夾，也就是我們?nèi)粘＠斫獾挠螒騈PC。player是實(shí)現(xiàn)游戲功能的模塊，比如我們這個(gè)游戲demo是飛機(jī)大戰(zhàn)，那么這個(gè)模塊的作用就是實(shí)現(xiàn)子彈爆炸效果。
微信小游戲中的調(diào)試有兩種方式，第一種是項(xiàng)目開(kāi)發(fā)中的預(yù)覽功能，第二種則是下圖所示的二維碼真機(jī)調(diào)試功能，你可以將這個(gè)二維碼遠(yuǎn)程發(fā)給任何人，讓他幫你來(lái)調(diào)試。
創(chuàng)建游戲畫(huà)布
游戲畫(huà)布是整個(gè)游戲開(kāi)發(fā)中最重要的組成部分，每一幀重會(huì)新繪制所有需要展示的元素。在微信小游戲開(kāi)發(fā)中，根據(jù)官方API文檔，我們通過(guò)createCanvas的方式來(lái)繪制畫(huà)布，并往里填充屬性，由于涉及到具體代碼演示，感興趣的同學(xué)可以點(diǎn)擊下方鏈接觀看這部分的內(nèi)容。
講師介紹
李藝，騰訊云最具價(jià)值專家（TVP），《小程序從0到1：微信全棧工程師一本通》作者，擁有近20年互聯(lián)網(wǎng)軟件研發(fā)經(jīng)驗(yàn)，曾是北京協(xié)同創(chuàng)新研究院人工智能項(xiàng)目負(fù)責(zé)人，Adobe中國(guó)15位社區(qū)管理員之一，目前是日行一課聯(lián)合創(chuàng)始人兼CTO。
《Hello,World公開(kāi)課》是由開(kāi)課吧推出的面向廣大開(kāi)發(fā)工程師的免費(fèi)加餐課，集結(jié)業(yè)內(nèi)名師大咖，聚焦熱門(mén)技術(shù)和實(shí)戰(zhàn)解決方案，以專業(yè)知識(shí)分享交流為橋梁，鏈接正在創(chuàng)造世界的一群科技主力們，向初心致敬，為技術(shù)發(fā)燒。無(wú)論你是初入職場(chǎng)的應(yīng)屆生，還是準(zhǔn)備升職加薪的職場(chǎng)精英，相信這里都有你需要的養(yǎng)料。
