白鷺H5小遊戲專案結構

2021-08-20 17:15:23 字數 3061 閱讀 3360

1. .wing  包括 egret 專案的任務配置檔案和啟動配置檔案。

launch.json 啟動配置

--portweb:伺服器指定的埠號

tasks.json 任務配置

對於一般的egret專案,在建立專案的時候已經自動生成了與egret命令列匹配的任務:構建(ctrl+shift+b),清理,發布,tasks.json如下

bin-debug:專案除錯時,所產生的檔案存放於此目錄

--執行 egret build, egret 會編譯您的 typescript **到 bin-debug 目錄,拷貝 src 和 template 中的其他檔案到 bin-debug 中

2. libs:庫檔案,包括 egret 核心庫和其他擴充套件庫存放於此目錄

--assetsmanager資源管理器,這使得開發者可以更方便的建立和維護小遊戲專案。

引入 assetsmanager資源管理器

白鷺引擎在 4.0 版本引入了名為 「resourcemanager 」的資源管理器作為 res 模組的替代方案。經過長達一         年的使用者反饋收集與功能迭代,我們在白鷺引擎 5.1.2 版本中正式將 resourcemanager 作為建立新專案的預設模組,徹底取代 res 模組,並          將其正式改名為 「assetsmanager」 .

--eui 是一套基於egret核心顯示列表的ui擴充套件庫,它封裝了大量的常用ui元件,能夠滿足大部分的互動介面需求,即使更加複雜的元件需求,            您也可以基於eui已有元件進行組合或擴充套件,從而快速實現需求。

---game 製作遊戲會用到的類庫,比如 movieclip,urlloader 等

--tween 動畫緩動類

需要用哪個庫,就配置哪個。比如我想用game tween eui這3個模組,只要新增到egretproperties.json配置檔案裡就可以了

3. resource:專案資源檔案存放於此目錄。

4. scripts:專案構建和發布時需要用到的指令碼檔案存放在此目錄。

5.src:專案**檔案存放於此目錄。

6.template:專案模板檔案存放於此目錄.這裡是專案除錯過程中所需的目錄,一般我們不需要修改該目錄下的內容

7.egretproperties.json

這個檔案裡面進行專案配置,包括模組和第三方庫的配置,發布和native相關配置,比較常用的設定就是新增模組和第三方庫。

8.index.html:專案訪問的入口檔案,我們可以在這裡面配置專案的旋轉縮放模式背景顏色等。

9.manifest.json:清單檔案

10.tsconfig.json:typescript 編譯配置檔案。

11.wingproperties.json:egret wing 專案配置檔案

index.html :

data-log-filter="" data-show-fps-style="x:0,y:0,size:30,textcolor:0x00c200,bgalpha:0.9">

data-entry-class=」main」 設定專案的入口檔案,表示專案的入口類,預設為main,如果需要自定義的話需要在專案中先建立類,然後在這裡配置類的名字。

data-orientation=」auto」 設定旋轉模式。

data-scale-mode=」showall」 設定縮放模式。

data-frame-rate=」30」 這裡是執行的幀率。

data-content-width=」480」 和 data-content-height=」800」 用來設定舞台的設計寬和高

data-show-paint-rect=」false」 設定顯示髒矩形的重繪區域。

data-multi-fingered=」2」 設定多指觸控

data-show-fps=」false」 data-show-log=」false」 這裡設定顯示幀率和log,只有在除錯時會顯示,發布的版本會去掉。

data-log-filter=」」 設定乙個正規表示式過濾條件,日誌文字匹配這個正規表示式的時候才顯示這條日誌。如 data-log-filter="^egret" 表示僅顯示以 egret 開頭的日誌。

data-show-fps-style=」x:0,y:0,size:30,textcolor:0x00c200,bgalpha:0.9」 這裡設定fps面板的樣式。目前支援預設的這幾種設定,修改其值即可,比如修改面板位置可以設定x和y,改變大小可以設定size,改變文字顏色textcolor,改變背景面板的透明度bgalpha。

---專案的入口類:main.ts

class main extends egret.displayobjectcontainer

第一行我們看到 class 關鍵字,表示類。如果熟悉物件導向程式設計的開發者肯定熟悉。表示我們宣告乙個類,而類名就是 main,我們的入口類。這個是我們可以自己定義的。如果修改之後需要在上面的 index.html 裡面修改。下乙個關鍵字 extends 表示該類繼承自什麼地方。egret engine 規定入口的文件類必須繼承自顯示容器displayobjectcontainer或其子類。關於顯示物件的具體知識下面會講到。

H5小遊戲是不是風口

遊戲是網際網路最直接的變現模式,廣告 道具付費。傳統的遊戲開發,使用者需要下乙個遊戲的安裝包,對於使用者而言 成本極高,還擔心中毒等風險。提供了完整的,廣告,支付等,提供了分享,裂變,等,形成乙個很好的閉環,使用者 可以更快的更方便的體驗到遊戲。所以h5遊戲必然是遊戲內容創作的乙個風口。h5小遊戲,...

H5小遊戲 看你有多色

使用了封裝了canvas的create.js庫來實現的。最終效果 工程 rect.js 方塊類 function rect n,color,specialcolor 獲取方塊的型別 this.getrecttype function 設定方塊的顏色 繪製方塊 this.setcolor functi...

H5遊戲專案開發總結

今年5月1日公司立項準備開發一款slg的h5遊戲。經過調研決定使用layaair引擎。目前遊戲第一輪測試已經結束。簡單回顧一下 明確要求趕在暑期檔上線,由於之前一直是用cocos2dx lua版本,所以對於h5零基礎的我來說還是不小的挑戰。引擎確定之後,開始著手熟悉api。開發過程期間遇到的相關問題...