上次我已說過Java實現2.5D的關鍵在于斜視圖坐標的轉化，只要“你的美工”或者“你——的美工”技術到位，2D到2.5D的圖形就簡單實現來說就已經足夠了（暫不考慮日照及云霧等特殊效果）。但反過來說，2.5D界面也確實對美工有了一定的要求，如果沒有好的原圖，2.5D程序實現起來將事倍功半，枉費氣力不說，還達不到應有的效果。
而遺憾的是，對于我這種非游戲開發人員來說，游戲美工簡直不可求更不可遇，而我搜遍google，卻也找不到多少2.5D地圖可供使用（我想找皇家騎士團或最終幻想戰略版那種地圖，居然沒有現成的……準備過兩天重下游戲自己摳圖……）。于是我怒從胸中起，惡向膽邊行，將一種更加極端的方法付諸于實踐……
我所謂更加極端的方法，就是利用看上去向2.5D的2D程序蒙混過關——也就是所謂的“偽2.5D實現”
舉例來說，下為我以前文章中曾構建過的2D地圖：
我們可以看到，在此例中角色及建筑始終由X,Y交織點確定，即采取通常的2D算法實現。
但我們都知道，3D或2D本質上區別只是視覺上的，反映到屏幕上的無外是分辨率不等的象素罷了。如果我們直接將做好的2D地圖放入其中，能否起到想要的作用呢？
我們來試試看，首先，我載入一個做好的2.5D地圖（取材自幻想三國,原圖大小2675X930，我以800X600卷簾顯示）
我們可以看到，由于采用了2.5D的視覺圖，單就畫面而言，通常沒有人會懷疑所見到的是“斜45度立體視圖”。
而問題來了，原來我們使用的傳統2D地圖描繪方式(見文章)，要如何應用在這張偽2.5D的視圖中呢？這時的難點就在于，我們要如何令原來在2D地圖中使用的數組，在此圖中發揮作用。
這時候有兩種殊途同歸的方式可供選擇：一是利用ps等工具，在斜視圖上生成鏤空圖，利用樓空圖生成map數組來演算此斜視圖。二是直接利用編輯器等工具在斜視圖上標注通行區域，以此生成數組。
我并沒有開發專用的編輯器，所以利用ps制作鏤空圖如下(原圖于斜視圖大小一致，為演示用縮小)：
其中我將黑色設定為禁行區域，白色為通行區域，而生成一個二維的整形數組，代表map的所有x,y點
將字符打印成地圖如下（部分）
此時，我們就可以利用地圖數組在斜視圖上描繪出對應的x,y點。
于通常的2D地圖相同，坐標由左上x,y點開始，到右下x,y點結束，描繪出了整張地圖內容(圖中紅色為不可移動區域，黑色為可移動區域)
那么我們現在要做的，就是將角色置身于當中了。
利用構建好的sprite類，我們能輕松的分解角色圖，我將一個ro中人物置身其中。
這時，由于地圖+人物俱為斜視圖，所以會形成斜45度視角的錯覺。
但新的問題來了，我們如何令角色移動呢？首先，我們顯示角色的移動路徑出來。
大家可以看到，如果我們沿用原來2D的尋徑方式，那么在移動過程中角色將按照2D路線行走。雖然對平面游戲來說在正常不過，但對于已經是"2.5D"畫面的我們來講，顯然是不能夠容忍的，這時候就需要我們摒棄原先的尋徑方式，將2.5D尋徑的A*方法引入其中，具體方式將在下次介紹。
最后，我們去除輔助線等，運行效果如下：
由于設定的關系，此時背景畫面隨角色運動而卷簾移動，但就操作感受上講，與普通的2.5D游戲是無異的。
上述操作代碼如下：
package org.loon.framework.game.image;
import java.awt.Color;
import java.awt.Frame;
import java.awt.Graphics;
import java.awt.Image;
import java.awt.Panel;
import java.awt.event.KeyEvent;
import java.awt.event.KeyListener;
import java.awt.event.MouseEvent;
import java.awt.event.MouseListener;
import java.awt.event.WindowAdapter;
import java.awt.event.WindowEvent;
import org.loon.framework.game.script.map.BitmapToMap;
import org.loon.framework.game.sprite.Configure;
import org.loon.framework.game.sprite.Event;
import org.loon.framework.game.sprite.Sprite;
import org.loon.framework.game.sprite.SpriteGroup;
/**
* <p>
* Title: LoonFramework
* </p>
* <p>
* Description:Java純2D偽2.5D測試
* </p>
* <p>
* Copyright: Copyright (c) 2007
* </p>
* <p>
* Company: LoonFramework
* </p>
*
* @author chenpeng
* @email：ceponline@yahoo.com.cn
* @version 0.1
*/
public class RpgTest extends Panel implements KeyListener, MouseListener {
/**
*
*/
private static final long serialVersionUID = 1L;
BitmapToMap btm = null;
Sprite[] roleMain = new Sprite[2];
Configure config = null;
//role圖行排列順序
final String imgList = "0,1,2,3,4,6,5,7";
Image img = null;
public RpgTest() {
setSize(800, 600);
setBackground(Color.BLACK);
//精靈組
SpriteGroup sgp = new SpriteGroup();
//載入角色圖
Bitmap bit = new Bitmap("./imagerpg/ro.png");
try {
// 重新排列圖片行列，超出索引則指定位置無圖
img = bit.getScriptRegroup(70, 124, imgList);
} catch (Exception e) {
e.printStackTrace();
}
//創建精靈,寬70，高124
roleMain[0] = new Sprite(img, 70, 124);
//定位
roleMain[0].setXY(45,50);
roleMain[0].setVisible(true);
roleMain[1] = new Sprite(img, 70, 124);
roleMain[1].setXY(31,41);
roleMain[1].setVisible(true);
//變更角色方向
roleMain[1].setDirection(5);
// 加載原始背景圖，背景鏤空圖（行走區域標注圖）
btm = new BitmapToMap("./imagerpg/map_1.png", "./imagerpg/map_1_2.png",800,600);
//鏤空色
btm.setFiltrateColor(new LColor(255, 255, 255));
//打印字符地圖
System.out.println(btm.toStringMap());
// 允許顯示網格
btm.setReseau(false);
// 加載角色
sgp.add(roleMain[0]);
sgp.add(roleMain[1]);
// 追蹤指定對象
// roleMain[1].setPursueObject(roleMain[0]);
// 以數組方式注入
// config=new Configure(btm,roleMain);
// 以spriteGroup方式注入Configure統一地圖與角色管理
config = new Configure(btm, sgp);
//使用2.5d視角走法
config.set25d(true);
//顯示移動路徑
config.setMovePath(false);
setFocusable(true);
addKeyListener(this);
addMouseListener(this);
}
public void update(Graphics g) {
paint(g);
}
public void paint(Graphics g) {
// g.drawImage(img, 0, 0, this);
config.draw(g);
// g.drawImage(bit.getFleshKeepOut("./s.jpg"), 0, 0, this);
// g.dispose();
}
public void keyPressed(KeyEvent e) {
// 控制指定角色移動
config.go(roleMain[0], Event.select(e.getKeyCode()));
// 刷新
repaint();
}
public void keyReleased(KeyEvent e) {
}
public void keyTyped(KeyEvent e) {
}
public void mouseClicked(MouseEvent e) {
config.goMouse(roleMain[0], e.getPoint(), getGraphics());
}
public void mouseEntered(MouseEvent arg0) {
}
public void mouseExited(MouseEvent arg0) {
}
public void mousePressed(MouseEvent arg0) {
}
public void mouseReleased(MouseEvent arg0) {
}
public static void main(String[] args) {
java.awt.EventQueue.invokeLater(new Runnable() {
public void run() {
Frame frm = new Frame("Java純2D偽2.5D測試");
frm.add(new RpgTest());
frm.setResizable(false);
frm.setSize(800, 600);
frm.addWindowListener(new WindowAdapter() {
public void windowClosing(WindowEvent e) {
System.exit(0);
}
});
frm.setLocationRelativeTo(null);
frm.setVisible(true);
}
});
}
}
而遺憾的是，對于我這種非游戲開發人員來說，游戲美工簡直不可求更不可遇，而我搜遍google，卻也找不到多少2.5D地圖可供使用（我想找皇家騎士團或最終幻想戰略版那種地圖，居然沒有現成的……準備過兩天重下游戲自己摳圖……）。于是我怒從胸中起，惡向膽邊行，將一種更加極端的方法付諸于實踐……
我所謂更加極端的方法，就是利用看上去向2.5D的2D程序蒙混過關——也就是所謂的“偽2.5D實現”
舉例來說，下為我以前文章中曾構建過的2D地圖：
我們可以看到，在此例中角色及建筑始終由X,Y交織點確定，即采取通常的2D算法實現。
但我們都知道，3D或2D本質上區別只是視覺上的，反映到屏幕上的無外是分辨率不等的象素罷了。如果我們直接將做好的2D地圖放入其中，能否起到想要的作用呢？
我們來試試看，首先，我載入一個做好的2.5D地圖（取材自幻想三國,原圖大小2675X930，我以800X600卷簾顯示）
我們可以看到，由于采用了2.5D的視覺圖，單就畫面而言，通常沒有人會懷疑所見到的是“斜45度立體視圖”。
而問題來了，原來我們使用的傳統2D地圖描繪方式(見文章)，要如何應用在這張偽2.5D的視圖中呢？這時的難點就在于，我們要如何令原來在2D地圖中使用的數組，在此圖中發揮作用。
這時候有兩種殊途同歸的方式可供選擇：一是利用ps等工具，在斜視圖上生成鏤空圖，利用樓空圖生成map數組來演算此斜視圖。二是直接利用編輯器等工具在斜視圖上標注通行區域，以此生成數組。
我并沒有開發專用的編輯器，所以利用ps制作鏤空圖如下(原圖于斜視圖大小一致，為演示用縮小)：
其中我將黑色設定為禁行區域，白色為通行區域，而生成一個二維的整形數組，代表map的所有x,y點
將字符打印成地圖如下（部分）
此時，我們就可以利用地圖數組在斜視圖上描繪出對應的x,y點。
于通常的2D地圖相同，坐標由左上x,y點開始，到右下x,y點結束，描繪出了整張地圖內容(圖中紅色為不可移動區域，黑色為可移動區域)
那么我們現在要做的，就是將角色置身于當中了。
利用構建好的sprite類，我們能輕松的分解角色圖，我將一個ro中人物置身其中。
這時，由于地圖+人物俱為斜視圖，所以會形成斜45度視角的錯覺。
但新的問題來了，我們如何令角色移動呢？首先，我們顯示角色的移動路徑出來。
大家可以看到，如果我們沿用原來2D的尋徑方式，那么在移動過程中角色將按照2D路線行走。雖然對平面游戲來說在正常不過，但對于已經是"2.5D"畫面的我們來講，顯然是不能夠容忍的，這時候就需要我們摒棄原先的尋徑方式，將2.5D尋徑的A*方法引入其中，具體方式將在下次介紹。
最后，我們去除輔助線等，運行效果如下：
由于設定的關系，此時背景畫面隨角色運動而卷簾移動，但就操作感受上講，與普通的2.5D游戲是無異的。
上述操作代碼如下：
package org.loon.framework.game.image;import java.awt.Color;import java.awt.Frame;import java.awt.Graphics;import java.awt.Image;import java.awt.Panel;import java.awt.event.KeyEvent;import java.awt.event.KeyListener;import java.awt.event.MouseEvent;import java.awt.event.MouseListener;import java.awt.event.WindowAdapter;import java.awt.event.WindowEvent;import org.loon.framework.game.script.map.BitmapToMap;import org.loon.framework.game.sprite.Configure;import org.loon.framework.game.sprite.Event;import org.loon.framework.game.sprite.Sprite;import org.loon.framework.game.sprite.SpriteGroup;/**
* <p> * Title: LoonFramework * </p> * <p> * Description:Java純2D偽2.5D測試 * </p> * <p> * Copyright: Copyright (c) 2007 * </p> * <p> * Company: LoonFramework * </p> * * @author chenpeng * @email：ceponline@yahoo.com.cn * @version 0.1 */public class RpgTest extends Panel implements KeyListener, MouseListener { /**
* */ private static final long serialVersionUID = 1L; BitmapToMap btm = null; Sprite[] roleMain = new Sprite[2]; Configure config = null; //role圖行排列順序 final String imgList = "0,1,2,3,4,6,5,7"; Image img = null; public RpgTest() { setSize(800, 600); setBackground(Color.BLACK); //精靈組 SpriteGroup sgp = new SpriteGroup(); //載入角色圖 Bitmap bit = new Bitmap("./imagerpg/ro.png"); try { // 重新排列圖片行列，超出索引則指定位置無圖 img = bit.getScriptRegroup(70, 124, imgList); } catch (Exception e) { e.printStackTrace(); } //創建精靈,寬70，高124 roleMain[0] = new Sprite(img, 70, 124); //定位 roleMain[0].setXY(45,50); roleMain[0].setVisible(true); roleMain[1] = new Sprite(img, 70, 124); roleMain[1].setXY(31,41); roleMain[1].setVisible(true); //變更角色方向 roleMain[1].setDirection(5); // 加載原始背景圖，背景鏤空圖（行走區域標注圖） btm = new BitmapToMap("./imagerpg/map_1.png", "./imagerpg/map_1_2.png",800,600); //鏤空色 btm.setFiltrateColor(new LColor(255, 255, 255)); //打印字符地圖 System.out.println(btm.toStringMap()); // 允許顯示網格 btm.setReseau(false); // 加載角色 sgp.add(roleMain[0]); sgp.add(roleMain[1]); // 追蹤指定對象 // roleMain[1].setPursueObject(roleMain[0]); // 以數組方式注入 // config=new Configure(btm,roleMain); // 以spriteGroup方式注入Configure統一地圖與角色管理 config = new Configure(btm, sgp); //使用2.5d視角走法 config.set25d(true); //顯示移動路徑 config.setMovePath(false); setFocusable(true); addKeyListener(this); addMouseListener(this); } public void update(Graphics g) { paint(g); } public void paint(Graphics g) { // g.drawImage(img, 0, 0, this); config.draw(g); // g.drawImage(bit.getFleshKeepOut("./s.jpg"), 0, 0, this); // g.dispose(); } public void keyPressed(KeyEvent e) { // 控制指定角色移動 config.go(roleMain[0], Event.select(e.getKeyCode())); // 刷新 repaint(); } public void keyReleased(KeyEvent e) { } public void keyTyped(KeyEvent e) { } public void mouseClicked(MouseEvent e) { config.goMouse(roleMain[0], e.getPoint(), getGraphics()); } public void mouseEntered(MouseEvent arg0) { } public void mouseExited(MouseEvent arg0) { } public void mousePressed(MouseEvent arg0) { } public void mouseReleased(MouseEvent arg0) { } public static void main(String[] args) { java.awt.EventQueue.invokeLater(new Runnable() { public void run() { Frame frm = new Frame("Java純2D偽2.5D測試"); frm.add(new RpgTest()); frm.setResizable(false); frm.setSize(800, 600); frm.addWindowListener(new WindowAdapter() { public void windowClosing(WindowEvent e) { System.exit(0); } }); frm.setLocationRelativeTo(null); frm.setVisible(true); } }); }}
浙公網安備 33010602011771號