資訊專欄INFORMATION COLUMN
摘要：但是不好的地方是或打開(kāi)會(huì)變形。但是這三個(gè)地方還是以實(shí)際項(xiàng)目需求為準(zhǔn)，以上是常規(guī)的設(shè)置。選擇完之后，我們點(diǎn)擊完成。所以幀率越高，則表示性能越好，流暢度高。并且代表作品萌雞駕到美旅出行小程序電競(jìng)桌子小程序。
標(biāo)簽: egret，入門(mén) 什么是Egret？
Egret是一套HTML5游戲開(kāi)發(fā)解決方案，產(chǎn)品包含Egret Engine，Egret Wing，EgretVS，Res Depot，Texture Merger，TS Conversion，Egret Feather，Egret Inspector，DragonBones，Lakeshore等。而核心產(chǎn)品是Egret Engine，是一個(gè)基于TypeScript語(yǔ)言開(kāi)發(fā)的一個(gè)HTML5游戲引擎，其余的大多是開(kāi)發(fā)和輔助工具。
關(guān)于這個(gè)引擎和工具方面的介紹，我就不多說(shuō)了，以下是白鷺的下載地址。
Egret官網(wǎng)：http://egret.com/
準(zhǔn)備階段：我們要下載
并且在里面下載
使用階段：在以上工具都準(zhǔn)備后，在engine界面或者桌面圖標(biāo)點(diǎn)擊打開(kāi)Egret Wing，會(huì)看到以下畫(huà)面：
Wing可以理解為專門(mén)使用TypeScript開(kāi)發(fā)白鷺項(xiàng)目的IDE了，以后我們使用egret過(guò)程中，會(huì)一直跟這個(gè)界面打交道。
好，現(xiàn)在我們先創(chuàng)建一個(gè)項(xiàng)目，我先建一個(gè)游戲項(xiàng)目，置于其他界面有什么區(qū)別呢，可以自行新建試試。EUI是主要做交互界面的，空項(xiàng)目是沒(méi)有配置好相關(guān)需要的代碼以及功能模塊的，例如做緩動(dòng)效果的Tween和加載的RES等等，所以為了方便，我們一般直接新建游戲項(xiàng)目。
在這里，你需要配置游戲界面的大小，視頻模式以及旋轉(zhuǎn)設(shè)置。尺寸直接是設(shè)計(jì)圖寬高，而視口我們一般會(huì)選擇showALL（顯示全部?jī)?nèi)容，不變形但會(huì)在留白），
網(wǎng)上也有一部分人開(kāi)發(fā)的時(shí)候用fixedWidth（適配寬度，高度不足時(shí)會(huì)隱藏底下部分，適用于只有一些動(dòng)畫(huà)在上方，且下方是無(wú)關(guān)重要的背景時(shí)）。
還有一些會(huì)用到百分百滿屏的exacFit，設(shè)計(jì)師弄一個(gè)適中的尺寸，然后按照這種模式鋪滿全屏，有少數(shù)很寬或很長(zhǎng)的屏幕會(huì)有一點(diǎn)變形，但是不影響游戲體驗(yàn)界面。但是不好的地方是PC或pad打開(kāi)會(huì)變形。
但是這三個(gè)地方還是以實(shí)際項(xiàng)目需求為準(zhǔn)，以上是常規(guī)的設(shè)置。
選擇完之后，我們點(diǎn)擊完成。打開(kāi)新建的項(xiàng)目目錄：
src是TypeScript源碼目錄，bin-debug是調(diào)試環(huán)境編譯出來(lái)的js，libs是文件包的引用目錄，template主要是app用到的runtime；
resource是我們項(xiàng)目中的資源路徑，一般我們把圖片音頻等素材放置asset目錄下，json等配置文件放置config目錄下，default.res.json是我們用于加載資源的json配置文件，一般不修改名字，后面會(huì)講到怎么使用。
egretProperties是我們這個(gè)項(xiàng)目的一些配置記錄信息，一般我們不需要?jiǎng)铀?。而index.html就是我們游戲的主界面文件。
打開(kāi)index.html
將data-show-fps和data-show-log設(shè)成true，我們就可以看到游戲運(yùn)行的實(shí)時(shí)幀率了。
幀率可以檢測(cè)游戲運(yùn)行的流暢度（性能），渲染數(shù)量越多，同時(shí)計(jì)算量越大，性能就越差，掉幀就越多。所以幀率越高，則表示性能越好，流暢度高。
另外，在底部，我們還能看到一個(gè)egret.runEgret({})的運(yùn)行方法，在這里，你可以修改egret的渲染模式，默認(rèn)是"webgl"。但是如果你需要用到跨域圖片資源或者有大量的圖片和文字，你最好還是使用"canvas"模式，避免跨域報(bào)錯(cuò)和性能問(wèn)題。
點(diǎn)完編譯，點(diǎn)調(diào)試，之后就出出現(xiàn)游戲界面，這是egret demo項(xiàng)目界面
在main 找到 createGameScene方法，然后添加
編譯運(yùn)行
作者簡(jiǎn)介：何永峰，蘆葦科技web前端開(kāi)發(fā)工程師，喜歡到處尋找好吃的，平時(shí)愛(ài)好是跳舞，打籃球，聽(tīng)音樂(lè)，有時(shí)會(huì)出席一些大型的舞蹈商演活動(dòng)，目前是Acum.Revolution現(xiàn)狀革命成員之一。并且代表作品：萌雞駕到、美旅出行小程序、電競(jìng)桌子小程序。擅長(zhǎng)網(wǎng)站建設(shè)、公眾號(hào)開(kāi)發(fā)、微信小程序開(kāi)發(fā)、小游戲、公眾號(hào)開(kāi)發(fā)，專注于前端領(lǐng)域框架、交互設(shè)計(jì)、圖像繪制、數(shù)據(jù)分析等研究，訪問(wèn) www.talkmoney.cn 了解更多。
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/100350.html
摘要：引入宋丹丹老師在小品中曾經(jīng)說(shuō)過(guò)，把大象裝進(jìn)冰箱只需要三步，打開(kāi)冰箱，把大象放進(jìn)冰箱，關(guān)上冰箱。這些步驟的前提就是依賴有一個(gè)冰箱當(dāng)然，在創(chuàng)建的時(shí)候，也是需要有一個(gè)前提條件的，那就是把基礎(chǔ)的開(kāi)發(fā)環(huán)境搭建完成。 引入 宋丹丹老師在小品中曾經(jīng)說(shuō)過(guò)，把大象裝進(jìn)冰箱只需要三步，打開(kāi)冰箱，把大象放進(jìn)冰箱，關(guān)上冰箱。 這些步驟的前提就是依賴有一個(gè)冰箱~~~ HelloWorld 當(dāng)然，在創(chuàng)建Hello...
摘要：是一個(gè)靜態(tài)類，調(diào)用方法來(lái)初始化各項(xiàng)支持信息。小結(jié)通過(guò)和這兩個(gè)靜態(tài)類初始化了項(xiàng)目運(yùn)行的環(huán)境參數(shù)，然后創(chuàng)建了屏幕適配器根據(jù)不同的適配策略調(diào)整。下一篇源碼分析全局哈?；惡腿之惒胶瘮?shù)對(duì)象接口 egret的github地址是https://github.com/egret-labs...，大家自己git clone到本地。 一.路口html文件 用ergetWing新建一個(gè)工程，打開(kāi)根目錄下...
摘要：這個(gè)類可以大大減少后期的代碼量，降低整體的耦合度。關(guān)鍵代碼是把位圖按照區(qū)域進(jìn)行分割，顯示對(duì)象的滾動(dòng)矩形范圍。 這次給大家?guī)?lái)的是通過(guò)Egret實(shí)現(xiàn)密室逃生小游戲的教程。該游戲包括人物狀態(tài)機(jī)、MVC設(shè)計(jì)模式和單例模式，該游戲在1.5s內(nèi)通過(guò)玩家點(diǎn)擊操作尋找安全點(diǎn)，方可進(jìn)入下一關(guān)，關(guān)卡無(wú)限，分?jǐn)?shù)無(wú)限。下面是具體的模塊介紹和代碼實(shí)現(xiàn)。 該游戲主要內(nèi)容包括 **開(kāi)始游戲場(chǎng)景游戲場(chǎng)景游戲結(jié)束結(jié)算...
閱讀 1922·2021-11-09 09:46
閱讀 2496·2019-08-30 15:52
閱讀 2461·2019-08-30 15:47
閱讀 1327·2019-08-29 17:11
閱讀 1752·2019-08-29 15:24
閱讀 3511·2019-08-29 14:02
閱讀 2450·2019-08-29 13:27
閱讀 1212·2019-08-29 12:32
