egret文件夾

❶ 怎麼將網頁打包成桌面應用（web前端頁面

在 HTML5的崛起、javaScript要一統天下之際，有一個名為【跨平台】的技術越來越火。為什麼會這么火？因為軟體開發者只需一次編寫程序，即可在 Windows、Linux、Mac、IOS、Android 等平台運行，大大降低了程序員的工作量，也使公司的產品可以快讀迭代。曾經跨平台技術的不被看好，如今隨著手機、電腦硬體的發展而快速發展。這一切，幾乎由HTML5技術推動，當然，JavaScript 這個語言，是最大的功臣。

基於 HTML5 的跨平台技術比較出名的有 PhoneGap、Cordova，常常用於開發 webapp；還有 Egret、Cocos-creator、Unity 等，常用於開發游戲；還有基於 Node.js 的 nw.js，用於開發桌面應用，以及 Electron，一款比 nw.js 還強大的用網頁技術來開發桌面應用的神器。

其實，以上都是廢話，現在進入主題：怎麼用 Electron 將網頁打包成 exe 可執行文件！

假設：

1、你已經安裝並配置好了 node.js （全局安裝）

2、你已經用 npm 安裝了 electron （全局安裝）

3、你已經寫好了前端網頁（html、css、javascript 這些，或者基於這些的前端框架寫好的網頁）

4、以上三點看不懂的，趕緊去網路。。。

你如果具備了以上的假設，請繼續往下看：

1、找到你的前端網頁項目文件夾，新建 package.json、main.js、index.html 三個文件（註：其中的 index.html 是你的網頁首頁）

你的項目目錄/
├── package.json
├── main.js
└── index.html

2、在 package.json 中添加如下內容

{
"name" : "app-name",
"version" : "0.1.0",
"main" : "main.js"}

3、在 main.js 中添加下面的內容，這個 main.js 文件就是上面 package.json 中的 "main"鍵 的值，所以可根據需要修改

const {app, BrowserWindow} = require('electron')const path = require('path')const url = require('url')// Keep a global reference of the window object, if you don't, the window will// be closed automatically when the JavaScript object is garbage collected.let winfunction createWindow () {
// Create the browser window.
win = new BrowserWindow({width: 800, height: 600})

// and load the index.html of the app.
win.loadURL(url.format({
pathname: path.join(__dirname, 'index.html'),
protocol: 'file:',
slashes: true
}))

// Open the DevTools.
// win.webContents.openDevTools()

// Emitted when the window is closed.
win.on('closed', () => {
// Dereference the window object, usually you would store windows
// in an array if your app supports multi windows, this is the time
// when you should delete the corresponding element.
win = null
})}// This method will be called when Electron has finished// initialization and is ready to create browser windows.// Some APIs can only be used after this event occurs.app.on('ready', createWindow)// Quit when all windows are closed.app.on('window-all-closed', () => {
// On macOS it is common for applications and their menu bar
// to stay active until the user quits explicitly with Cmd + Q
if (process.platform !== 'darwin') {
app.quit()
}})app.on('activate', () => {
// On macOS it's common to re-create a window in the app when the
// dock icon is clicked and there are no other windows open.
if (win === null) {
createWindow()
}})// In this file you can include the rest of your app's specific main process// code. You can also put them in separate files and require them here.

4、如果你的網頁首頁的文件名不是 「index.html」，那麼請在 main.js 中將其中的 'index.html' 修改為你的網頁首頁名

5、打開 DOS，cd 到你的項目目錄（或直接在你的項目目錄下空白的地方 shift+滑鼠右鍵，然後點擊在此處打開命令窗口，這里看不懂的，唉，網路吧少年）

6、在上一步的 DOS 下，輸入npm install electron-packager -g全局安裝我們的打包神器

npminstallelectron-packager-g

7、安裝好打包神器後，還是在上一步的 DOS 下，輸入electron-packager . app --win --out presenterTool --arch=x64 --version 1.4.14 --overwrite --ignore=node_moles 即可開始打包

electron-packager . app --win --out presenterTool --arch=x64
--version 1.4.14 --overwrite --ignore=node_moles

這個命令什麼意思？藍色部分可自行修改：

electron-packager .可執行文件的文件名--win --out打包成的文件夾名--arch=x64位還是32位--version版本號--overwrite --ignore=node_moles

以上是最簡單的打包方式，至於怎麼修改窗口大小、菜單欄怎麼加、怎麼調用系統API這些，就給你慢慢去研究Electron了。

如果你打包總是不成功，覺得很煩，同時對擴展功能沒什麼要求的話，

裡面有我已將內容為 hello,world 的 index.html 網頁通過 Electron 框架打包為 windows 環境下的桌面應用。

現只需將你的網頁前端項目復制到 /resources/app/project 目錄下，雙擊 exe 文件即可以桌面應用的方式運行你的網頁。

❷ 有沒有把網頁轉換成可執行文件的網頁

在
HTML5的崛起、JavaScript要一統天下之際，有一個名為【跨平台】的技術越來越火。為什麼會這么火？因為軟體開發者只需一次編寫程序，即可在
Windows、Linux、Mac、IOS、Android
等平台運行，大大降低了程序員的工作量，也使公司的產品可以快讀迭代。曾經跨平台技術的不被看好，如今隨著手機、電腦硬體的發展而快速發展。這一切，幾乎由HTML5技術推動，當然，JavaScript
這個語言，是最大的功臣。

以上是最簡單的打包方式，至於怎麼修改窗口大小、菜單欄怎麼加、怎麼調用系統API這些，就給你慢慢去研究Electron了。

❸ 如何在第三方庫中引用egret的庫

一、通過直接修改項目的index.html進行配置
首先在項目libs目錄下新建一個puremvc(名字可自定)文件夾，但是不要新建在libs/moles下面。將puremvc文件夾bin目錄下的所有文件都拷貝到剛才新建的文件夾下面，然後修改項目的index.html，在<!--other_libs_files_start-->標簽之間引入相應的js文件即可。
<script egret="lib" src="libs/puremvc/puremvc-typescript-multicore-1.1.js" src-release="libs/puremvc/puremvc-typescript-multicore-1.1-min.js"></script>
這樣就配置好了，但是目前卻還是沒辦法用，因為puremvc編譯後的js文件加入了AMD模塊規范，在egret項目中無法直接使用，因此需要注掉AMD模塊聲明部分
puremvc-typescript-multicore-1.1.js和puremvc-typescript-multicore-1.1-min.js都需要注掉AMD模塊定義部分，這樣就可以使用puremvc庫了。
二、標准配置
在項目所在文件夾下，用命令行egret create_lib puremvc創建一個egret庫，當然目錄路徑可以任選，但是最好不要在項目文件夾下創建。將puremvc文件夾bin目錄下的所有文件都拷貝到剛才新建的文件夾下的src目錄中，修改剛才庫文件夾下的package.json,配置如下
<pre name="code" class="html">{
"name": "egret",
"version": "3.2.2",
"moles": [
{
"name": "puremvc",
"description": "puremvc",
"files": [
"puremvc-typescript-multicore-1.1.d.ts",
"puremvc-typescript-multicore-1.1-min.js",
"puremvc-typescript-multicore-1.1.js"
],
"root": "src"
}
]
}
在當前庫文件夾下調用egret build編譯庫，然後修改項目egretProperties.json，moles下增加如下配置
{
"name":"puremvc",
"path":"../puremvc"
}
編譯項目即可自動完成配置，要注意的是這里也是要去掉puremvc-typescript-multicore-1.1-min.js和puremvc-typescript-multicore-1.1.js中的AMD模塊部分的。

❹ 什麼是白鷺引擎

Egret Engine（白鷺引擎）是白鷺時代推出的一款使用TypeScript語言構建的開源免費的移動游戲引擎。通過白鷺引擎，開發者可以快速地創建可以運行在手機App的WebView或者瀏覽器中的HTML5移動游戲，也可以編譯輸出成基於Android、iOS、Windows Phone的跨平台原生移動游戲。應用Egret引擎開發HTML5移動游戲，不但能讓H5游戲具備牛逼的性能表現，並且效率很高。

❺ egret怎麼添加puremvc

說學就學，可是第一步就讓我感覺很費事~~（哎~菜鳥當久了）。要開始學，得先下個PureMVC框架裝上吧。找了半天PureMVC框架，下載下來後，發現是一個壓縮包，大小隻有幾百K（心存懷疑，怎麼這么小呀）。解壓之後，根據慣性開始尋找一個類似Setup的東東。狂汗，就是找不到這個東西。這下我認定剛才下錯東西了。於是，在網上又是一陣狂搜，結果證明自己沒下錯。-_-!!!

第二步，開始安裝PureMVC。沒有setup，怎麼裝呢？是不是添加引用就可以了呢？可是又該怎麼添加呢？（我用得是FlashDevelop這個編輯AS的軟體）網上又是一陣狂搜，可搜到的都是談論PureMVC的架構怎麼樣或者pureMVC具體應用怎麼寫，就是沒有介紹剛開始該怎麼配置的。「最危險的地方就是最安全的地方」，結果在PureMVC的下載頁內找到了「Installation 」字樣。其中的大概做法，就是解壓，然後將「PureMVC_AS3_2_0_4.swc」添加到項目的庫中。因為，我用的是FlashDevelop，所以添加方法如下：選中項目的lib文件夾-》右鍵添加存在的文件-》選擇PureMVC_AS3_2_0_4.swc-》右鍵單擊添加進來的這個文件-》選擇添加到庫中（Add To Library）。這樣便可以算前期工作全部結束了。

第三步，查找關於PureMVC的介紹，補一下理論知識。這些東西，網上超多，我就不介紹了。
簡單的說，PureMVC源於MVC模式，主要就是Model、View、Controller這三層次。但在PureMVC中上述三個都被封裝成了三個核心層，並通過單例模式提供給應用程序。開發人員不需要直接使用這三個核心層。PureMVC為了簡化開發復雜度，提供了一個Facade類，該類提供了與核心層通信的唯一介面，可以初始化上述三個核心層，並可以訪問它們的public方法，同時該類也是以單例模式提供給應用程序。開發人員只需要繼承一個Facade類並創建具體的Facade類就可以實現整個MVC模式。除了知道Facade類之外，還需要了解與三個核心層相輔助的三個類：Proxy、Mediator、Command。
Proxy，可以理解為代理，負責操作數據的存取。
Mediator，可以理解為媒介，負責UI層與控制層之間的溝通。
Command，則是用來操作具體的業務邏輯。
為了對這三個核心層盡量的解耦，PureMVC中採用了消息機制，層與層之間的通信通過發送消息(notification)來實現。消息發送者只需要實現發送，不需要知道誰會接收這些消息。消息接收者如果需要接收消息，只需要注冊一下對應的消息就可以了。如：registerCommand(START_UP, StartUpCommand);這句話產意思就是注冊了一個對應關系，其中START_UP是消息的名稱，StartUpCommand則是一個Command，這樣當有人發送了START_UP名稱的消息後，就會由StartUpCommand進行處理。

第四步，動手寫自己的Demo（在我的這個Demo中，實現功能很簡單：記錄每次滑鼠單擊時在X方向上的偏移量）。
1）創建一個新的項目，就叫做 "MyFirstPureMvc」吧。新創建的項目，應該可以看到bin、lib、src這三個文件夾，在src下有一個main.as文件，bin下有一些用於呈現網頁的文件（項目中基本不需要用到）。2）在lib文件夾中添加PureMVC_AS3_2_0_4.swc，並添加到庫中。
3）在src文件夾中添加三個子文件夾：Model、View、Controller。Model文件中放置MouseClickProxy.as文件。View中放置StageMediator.as文件。Controller中放置StartUpCommand.as和MouseClickCommand.as這兩個文件。具體內容，請看下面。
4）在src文件夾中接著添加ApplicationFacade.as文件，名稱可以不一樣。這個主要是用來繼承Facade類的。如果你了解了基本的PureMVC框架結構之後，應該明白Facade這個類的重要性。

package
{
import org.puremvc.as3.patterns.facade.Facade;
import controller.*
/**
* Facade模式來實現統一的介面，對外只提供了startup方法用於啟動
* 在該類被創建的時候會自動調用initializeController方法，需要在該方法中對Command進行注冊
* 接著，調用startup方法啟動（也就是發送一個消息，因為之前已經注冊了Command,所以相應的方法會去執行execute進行響應）。
* @author
*/
public class ApplicationFacade extends Facade
{
public static const START_UP:String = "START_UP";
public static const MOUSE_CLICK:String = "MOUSE_CLICK";

public static function getInstance(): ApplicationFacade {
if (instance == null) {
instance = new ApplicationFacade();
}
return instance as ApplicationFacade;
}

public function startup(app:Object):void
{
sendNotification(START_UP, app);
}

override protected function initializeController():void {

super.initializeController();
registerCommand(START_UP, StartUpCommand);
registerCommand(MOUSE_CLICK, MouseClickCommand);
}
}
}
上述語句中的initializeController方法中首先初始化了Controller控制器，並建立了Command與消息之間的映射關系。然後調用startup啟動整個程序。在sendNotification中，發送了一個名為START_UP的消息。並傳遞了一個app對象。
根據注冊的關系，StartUpCommand類會接收到這個消息。

在這個類中，主要實現了父類的execute方法。在該方法中注冊了一個代理和媒介。這兩個東東，在隨後的程序運行中需要使用，所以要進行一下注冊。注冊了之後，接下去如果要使用則直接可以從facade中獲取。

接著來看下StageMediator.as，這個東東關繫到我們的View視圖，與我們可以看得到的UI密切相關。我們在UI上觸發的一些事件會由這個StageMediator類接收（並進行簡單的封裝）後發送給控制層去處理。

在mouseClick事件中，又發送了一個通知，通知的消息為MOUSE_CLICK。另一個是滑鼠的單擊時的X方向上偏移量。看一下ApplicationFacade類中注冊的信息，可以找到與消息對應的類是MouseClickCommand。

在這個類中，就輸出了X方向上偏移量。

接下來，你只需要ctrl+enter測試就可以了。

是不是很奇怪，從頭到尾都沒有用過Model層，是的，這可能是我這個DEMO的缺陷，因為我這個Demo中不需要查詢資料庫或其它數據存儲區來獲取或寫入數據，因此並沒有使用到。

上面的整個過程，只起到一個簡單的演示作用。如果大家需要深入學習，建議大家參考網上達人們的文章。

❻ win7如何檢驗egret引擎安裝

下載NodeJS。
進入NodeJS官方網站，直接點擊綠色按鈕INSTALL下載（會自動檢測系統下載對應版本）或者點擊紅圈內download按鈕自己選擇版本。

安裝NodeJS。
直接打開下載的文件，安裝。

測試NodeJS。
安裝完畢後可以打開命令行窗口輸入命令 node -v 查看是否安裝成功。
如圖會出現node版本。同時該安裝包還會為你安裝npm工具。
（node安裝成功後會自動配置環境變數PATH，如果node -v 提示錯誤，大家可以重啟機子或者檢查一下環境變數的配置）

下載typescript。
Nodejs已經安裝了npm工具。大家可以直接用命令安裝typescript。
在命令行窗口輸入npm install -g typescript。

安裝成功後可以輸入tsc命令檢測。

下載Egret Engine。
大家在官網的產品下載就可以下載到。

下載完畢。解壓到指定文件夾。然後運行目錄下的install.bat就自動安裝了命令行工具。

安裝完成。
大家可以輸入egret來測試一下。這時應該會看到這個界面。

執行完以上步驟，大家就安裝好了Egret，可以用命令來創建編譯發布項目。但是還缺少一個可視化的開發工具。
大家可以去WebStorm（Egret官方推薦工具）官網下載安裝WebStorm。

最後，大家就可以用WebStorm來開發項目了。

❼ egret map左上角怎麼顯示信息

放到客戶端的DATA文件夾里邊才可以.

❽ 如何使用TexturePacker快速導出Egret能用的紋理

TexturePacker可以很方便的製作點陣圖紋理集。同時TexturePacker支持眾多格式。

目前TexturePacker官方還沒有支持Egret所支持的紋理集格式，但可以為TexturePacket安裝插件來支持Egret紋理集導出。

重啟TexturePacker後，可以在Data Format選項中看到egret-spritesheet選項。