【v2.x OGE教程 12】 關卡編輯器幫助文檔
【v2.x OGE教程 12】
關卡編輯器幫助文檔
一、簡單介紹
關卡編輯器用於遊戲關卡界面元素的可視化編輯,包含元素的位置、尺寸以及其他自己定義屬性。通過解析生成的數據文件就可以獲取關卡信息，並能隨時調整。以降低開發工作量，提高開發效率。
二、界面
主界面
圖01_主界面
1) 畫布
① 簡單介紹
畫布用於關卡元素的預覽，並提供元素選擇和坐標設置等功能；畫布的尺寸與其正在顯示的關卡的尺寸同樣
圖02_畫布
② 選擇元素
a. 單選：鼠標左鍵單擊就可以選中單個元素，選中後的元素周圍出現藍色的方框，未選中的則為灰色虛線框
b. 多選：按住Ctrl鍵不放，再依次點擊要多選的元素就可以多選
c. 取消選擇：點擊畫布的隨意空白區域就可以取消選中
③ 移動元素
選中要移動的元素。用鼠標拖拽或者借助鍵盤的方向按鍵均可移動所選元素，也能夠通過在屬性列表中直接輸入元素的坐標來移動元素
2) 菜單條
① 簡單介紹
菜單條是編輯器經常使用操作的集合，包含“文件”和“幫助”菜單兩大類。
圖03_菜單條
② 文件菜單
a. 新建項目
用於打開“新建項目”窗體，在該窗體中輸入新項目名稱後點擊確定button就可以創建一個新項目
圖04_新建項目
註意：新項目名稱不能與已有項目的名稱反復
b. 打開項目
用於打開已有項目。
點擊菜單button，在彈出窗體中選擇要打開的項目配置文件（xml格式的）就可以打開項目
圖05_打開項目
c. 保存項目
用於保存對項目的改動
d. 導出項目
用於導出項目所生成的關卡數據文件。
點擊菜單,在彈出窗體中選擇要導出的目標文件夾。再點擊確定後將在指定文件夾下 生成關卡數據文件
圖06_導出項目
③ 幫助菜單
打開幫助
3) 快捷工具欄
① 簡單介紹
快捷工具欄是經常使用功能button的集合
圖07_快捷工具欄
② 項目相關button
用於新建、打開和保存項目
③ 對齊button組
用於對齊界面元素，僅當畫布中已選中了多個元素時有效；對齊時，以多選時第一個選中的元素為標準
a. 頂端對齊
將全部選中元素的縱坐標設為第一個選中的元素的縱坐標
b. 底端對齊
將全部選中元素的底端與第一個選中的元素的底端對齊
c. 左對齊
將全部選中元素的橫坐標設為第一個選中的元素的橫坐標
d. 右對齊
將全部選中元素的右端與第一個選中的元素的右側對齊
e. 橫向居中對齊
將全部選中元素的中心點的縱坐標設為第一個選中的元素的中心點的縱坐標
f. 縱向居中對齊
將全部選中元素的中心點的橫坐標設為第一個選中的元素的中心點的橫坐標
g. 中心對齊
將全部選中元素的中心點的坐標設為第一個選中的元素的中心點的坐標
④ 布局button組
用於高速設置界面元素的位置。僅僅對單個元素有效
a. 置頂
將選中元素的縱坐標設為0
b. 置底
將選中元素的底端與畫布的底端對齊
c. 左置
將選中元素的橫坐標設為0
d. 右置
將選中元素的右端與畫布右端對齊
e. 橫向居中
將選中元素的中心點的縱坐標設置為畫布中心點的縱坐標
f. 縱向居中
將選中元素的中心點的橫坐標設置為畫布中心點的橫坐標
g. 居中
將選中元素的中心點的坐標設置為畫布中心點的坐標
⑤ 刪除button
用於刪除畫布中選中的元素，支持多選
4) 元素列表
① 簡單介紹
元素列表區域顯示精靈列表和關卡元素列表
② 精靈列表
精靈列表顯示項目的全部精靈。選中某個精靈後，“屬性列表”和“自己定義屬性列表”
將顯示該精靈的屬性信息
圖08_精靈列表
a. 精靈簡單介紹
精靈指關卡編輯器中能夠在關卡內或者關卡間復用的界面元素。將精靈加入到關卡後，關卡中將生成一個與精靈的各項屬性同樣的關卡元素
b. 加入精靈button
點擊後加入一個新的精靈
c. 刪除精靈button
點擊後刪除選中的精靈
d. 將精靈加入到關卡中
選擇要加入的精靈，將其用鼠標拖拽到畫布中就可以將該精靈加入到當前的關卡中
5) 關卡列表
關卡列表顯示項目中的全部關卡及關卡的元素列表，是一個樹形結構
圖09_關卡列表
① 關卡
樹形結構的第一層顯示項目中的關卡列表，選中某個關卡後，“屬性列表”和“自己定義屬性列表”將顯示其相關屬性。畫布將切換到該關卡的布局
② 元素
樹形結構的第二層顯示關卡的元素列表，選中某個元素後。“屬性列表”和“自己定義屬性列表”將顯示其相關屬性，畫布將切換到該元素所屬關卡的布局，並框選該元素相應的畫布元素
③ 加入關卡button
點擊後加入一個新的關卡
④ 刪除關卡button
點擊後刪除選中的關卡
6) 屬性列表
① 簡單介紹
屬性列表區域用於顯示和改動精靈、關卡及關卡元素的基本信息（假設“元素列表”區域中選中的選項卡為“精靈列表”。則顯示當前選中的精靈信息，反之則顯示關卡或者關卡元素信息）。包含坐標和尺寸等
圖10_屬性列表
② 名稱
用於顯示和改動當前對象的名稱（註：名稱僅用於方便編輯器的顯示，在引擎中無意義）
③ 位置
用於顯示和改動當前對象的坐標。僅當顯示對象為關卡元素時有效
④ 尺寸
用於顯示和改動當前對象的寬和高,假設改動了關卡的尺寸,畫布將同步更新
⑤ 類型
用於顯示和改動當前對象的類型值，僅當顯示對象為精靈和關卡元素時有效
⑥ 圖片
用於設置該元素的背景圖片（僅用於方便編輯器的顯示。在引擎中無意義），僅當顯示對象為精靈或者關卡元素時有效，點擊右側的button能夠導入圖片資源
7) 自己定義屬性列表
① 簡單介紹
自己定義屬性列表區域用於顯示和改動精靈、關卡及關卡元素的擴展信息（假設“元素列表”區域中選中的選項卡為“精靈列表”。則顯示當前選中的精靈信息，反之則顯示關卡或者關卡元素信息）
圖11_自己定義屬性
② 改動自己定義屬性
用鼠標選中要改動的單元格，再單擊單元格或按下F2就可以改動自己定義屬性的名稱或者值
③ 加入自己定義屬性
在標有“*”的行（一般為列表的最後一行）中依次輸入屬性名稱和值就可以加入一個自己定義屬性
④ 刪除自己定義屬性
選則要刪除的屬性所在的行，按Delete鍵就可以刪除
註意：自己定義屬性的名稱不能反復，假設輸入了反復的名稱。將會被自己主動設置為一個不反復的默認值Property_N
三、演示樣例
1. 新建項目
1) 點擊文件菜單，選擇新建項目
2) 在彈出的對話框中輸入項目名稱，點擊確定
2. 創建精靈
1) 選中程序右上角的“精靈列表”選項卡
2) 點擊“加入精靈”button，將創建一個新的精靈。如圖12
圖12_演示樣例_創建精靈
3) 依次改動精靈的名稱、尺寸和類型
4) 設置精靈的圖片，假設列表中沒有須要的圖片，能夠通過點擊右側的“+”button來導入
5) 反復上述步驟。創建須要的精靈
3. 創建關卡
1) 選中程序右上角的“關卡列表”選項卡
2) 點擊“加入關卡”button，將創建一個新的關卡。如圖13
圖13_演示樣例_加入關卡
3) 依次設置關卡的名稱和尺寸
4. 加入關卡元素
1) 選中“精靈列表”
2) 選中須要的精靈。將其拖拽到“畫布”中，如圖14
圖14_演示樣例_加入元素
3) 反復上述步驟,加入須要的關卡元素
5. 改動元素屬性
1) 選中“關卡列表”選項卡
2) 展開指定的關卡,選中指定元素(也能夠用鼠標左鍵單擊畫布中的圖片來選中指定的關卡元素)如圖15
圖15_演示樣例_選擇元素
3) 設置自己定義屬性
① 選中“自己定義屬性”列表中，最左標識有“*”的行
② 選中“名稱”單元格。再用鼠標左鍵單擊一次該單元格
③ 輸入新的名稱
④ 選中“值”單元格。再用鼠標左鍵單擊一次該單元格
⑤ 輸入新的值
⑥ 反復上述步驟
四、在項目中使用
1. 導出為數據文件
在關卡編輯器中將關卡導出，生成對應的xml數據文件。然後將數據文件復制到項目的合適位置
2. 載入關卡數據文件並使用
註:關卡載入器已集成到引擎中,所在包名:com.orange.util.level
//自己定義屬性的名稱
public static final String TAG_ENTITY_ATTRIBUTE_TYPE_VALUE_BOX = "box";
public static final String TAG_ENTITY_ATTRIBUTE_TYPE_VALUE_CIRCLE = "circle";
public static final String TAG_ENTITY_ATTRIBUTE_TYPE_VALUE_TRIANGLE = "triangle";
public static final String TAG_ENTITY_ATTRIBUTE_TYPE_VALUE_HEXAGON = "hexagon";
@Override
public void onSceneCreate(SceneBundle bundle) {
// TODO Auto-generated method stub
super.onSceneCreate(bundle);
final String FACE_BOX = "face_box.png";
RegionRes.loadBitmapTextureFromAssets(FACE_BOX);
//關卡的容器
final EntityGroup entityGroup = new EntityGroup(this);
this.attachChild(entityGroup);
//初始化關卡載入器對象
final LevelLoader levelLoader = new LevelLoader();
//關卡元素的容器
levelLoader.registerEntityLoader(LevelConstants.TAG_LEVEL, new IEntityLoader() {
@Override
public IEntity onLoadEntity(final String pEntityName, final Attributes pAttributes) {
final int width = SAXUtils.getIntAttributeOrThrow(pAttributes, LevelConstants.TAG_LEVEL_ATTRIBUTE_WIDTH);
final int height = SAXUtils.getIntAttributeOrThrow(pAttributes, LevelConstants.TAG_LEVEL_ATTRIBUTE_HEIGHT);
entityGroup.setWidth(width);
entityGroup.setHeight(height);
return entityGroup;
}
});
//關卡元素
levelLoader.registerEntityLoader(LevelConstants.TAG_ENTITY, new IEntityLoader() {
@Override
public IEntity onLoadEntity(final String pEntityName, final Attributes pAttributes) {
final int x = SAXUtils.getIntAttributeOrThrow(pAttributes, LevelConstants.TAG_ENTITY_ATTRIBUTE_X);
final int y = SAXUtils.getIntAttributeOrThrow(pAttributes, LevelConstants.TAG_ENTITY_ATTRIBUTE_Y);
final int width = SAXUtils.getIntAttributeOrThrow(pAttributes, LevelConstants.TAG_ENTITY_ATTRIBUTE_WIDTH);
final int height = SAXUtils.getIntAttributeOrThrow(pAttributes, LevelConstants.TAG_ENTITY_ATTRIBUTE_HEIGHT);
final String type = SAXUtils.getAttributeOrThrow(pAttributes, LevelConstants.TAG_ENTITY_ATTRIBUTE_TYPE);
Debug.d("x=" + x);
Debug.d("y=" + y);
final VertexBufferObjectManager vertexBufferObjectManager = LevelScene.this.getVertexBufferObjectManager();
final AnimatedSprite face;
if(type.equals(TAG_ENTITY_ATTRIBUTE_TYPE_VALUE_BOX)) {
face = new AnimatedSprite(x, y, FACE_BOX, vertexBufferObjectManager);
} else if(type.equals(TAG_ENTITY_ATTRIBUTE_TYPE_VALUE_CIRCLE)) {
face = new AnimatedSprite(x, y, FACE_BOX, vertexBufferObjectManager);
} else if(type.equals(TAG_ENTITY_ATTRIBUTE_TYPE_VALUE_TRIANGLE)) {
face = new AnimatedSprite(x, y, FACE_BOX, vertexBufferObjectManager);
} else if(type.equals(TAG_ENTITY_ATTRIBUTE_TYPE_VALUE_HEXAGON)) {
face = new AnimatedSprite(x, y, FACE_BOX, vertexBufferObjectManager);
} else {
throw new IllegalArgumentException();
}
face.animate(200);
return face;
}
});
try {
//開始載入
levelLoader.loadLevelFromAsset("Level_1.lvl");
} catch (final IOException e) {
Debug.e(e);
}
}
【v2.x OGE教程 12】 關卡編輯器幫助文檔