# DragonBones Manual
> 2D 動畫 DCC，支援 Egret、Unity、Cocos2d-x...
> 文中將以 DB 簡稱 DragonBones

## AnimationManager
專案控制 DB 的管理者，包含 Pool、Spawn、Despawn 等等

---
## 使用流程
### 1. 輸出DragonBones檔案

### 2. 將輸出的檔案放入專案內

### 3. 點選ske檔右鍵，產生DragonBones的Data

### 4. 場景上產生DragonBones物件

### 5. 將DragonBones的Data拉過去並點選Create

### 6. 依照需求設定動畫參數，完成

此時Scene上已經可以直接預覽動畫

---
## 匯入資源到 Egret 專案
* 假設動畫有3個檔案

Sample_001_ske.json
Sample_001_tex.json
Sample_001_tex.png

* 將檔案放在專案的 **resource** 資料夾底下, 建議在 **resource/asset** 另外開資料夾存放

### 編輯 resource/default.res.json (2選1)
* 手動修改, 在 **resource** 區塊內為3個檔案新增內容, 以此類推 (這裡放在 resource/asset/Dealer)

{
    "name":"Sample_001_ske_json",
    "type":"json",
    "url":"assets/Dealer/Sample_001_ske.json"
}

* 使用工具 **Res Depot** 編輯
* 將檔案拖曳到上面的區塊, 會自動補上類型和相對路徑
* 選好資源組, 再從上面拖曳檔案到下面, 再按存檔就完成

---
## DragonBones in Egret

1. WorldClock的實例在BaseFactory下

var DBFactory = new dragonBones.EgretFactory();
var worldClock = DBFactory.clock;

2. 動畫需設定Timer (要播放的Armature也須add到WorldClock內)
`egret.Ticker.getInstance().register(function (advancedTime) {
worldClock.advanceTime(-1); }, this);`

3. runtime 載入資源
* 名稱設定在 **resource/default.res.json**
* 如果透過工具設定, 通常副檔名前面的 **<font color=#ff0000>.</font>** 會換成 **<font color=#ff0000>_</font>**

let aniData = RES.getRes("Sample_001_ske_json");
let texData = RES.getRes("Sample_001_tex_json");
let tex: egret.Texture = RES.getRes("Sample_001_tex_png");

this.DBFactory.parseDragonBonesData(aniData);
this.DBFactory.parseTextureAtlasData(texData, tex);

4. 新增到 stage 並且播放

//名稱來自 Sample_001_ske.json 的 name 欄位
let armature: dragonBones.Armature = this.DBFactory.buildArmature("Sample_001");

//這裡轉型只是為了方便存取裡面的屬性
//egret官方特別註明: 型別通常都是DisplayObjectContainer
let display: egret.DisplayObjectContainer = armature.display;

this.DBFactory.clock.add(armature);

//新增到場景
this.addChild(display);

//設定顯示位置
display.x = this.stage.stageWidth * 0.5;
display.y = this.stage.stageHeight;

armature.animation.play();

---

## 相關連結
* [DragonBones 官方網站](http://www.dragonbones.com/cn/index.html)
* [DragonBones 下載位置](https://docs.egret.com/dragonbones/cn/index.html)
* [How to export DragonBones to Unity](https://www.youtube.com/watch?v=O2fTwwisInc)
* [Create DragonBones via script in Unity](https://www.youtube.com/watch?v=NoDR7iCnExw)

###### tags: `教學`