Java中2.5D遊戲（斜45度角）的設計與實作(2)

上次我已說過Java實作2.5D的關鍵在于斜視圖坐标的轉化，隻要“你的美工”或者“你——的美工”技術到位，2D到2.5D的圖形就簡單實作來說就已 經足夠了（暫不考慮日照及雲霧等特殊效果）。但反過來說，2.5D界面也确實對美工有了一定的要求，如果沒有好的原圖，2.5D程式實作起來将事倍功半， 枉費氣力不說，還達不到應有的效果。

而遺憾的是，對于我這種非遊戲開發人員來說，遊戲美工簡直不可求更不可遇，而我搜遍google，卻 也找不到多少2.5D地圖可供使用（我想找皇家騎士團或最終幻想戰略版那種地圖，居然沒有現成的……準備過兩天重下遊戲自己摳圖……）。于是我怒從胸中 起，惡向膽邊行，将一種更加極端的方法付諸于實踐……

我所謂更加極端的方法，就是利用看上去向2.5D的2D程式蒙混過關——也就是所謂的“僞2.5D實作”

我們可以看到，在此例中角色及建築始終由X,Y交織點确定，即采取通常的2D算法實作。

但我們都知道，3D或2D本質上差別隻是視覺上的，反映到螢幕上的無外是分辨率不等的象素罷了。如果我們直接将做好的2D地圖放入其中，能否起到想要的作用呢？

我們來試試看，首先，我載入一個做好的2.5D地圖（取材自幻想三國,原圖大小2675X930，我以800X600卷簾顯示）

我們可以看到，由于采用了2.5D的視覺圖，單就畫面而言，通常沒有人會懷疑所見到的是“斜45度立體視圖”。

這時候有兩種殊途同歸的方式可供選擇：一是利用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>

 * Description:Java純2D僞2.5D測試

 * Copyright: Copyright (c) 2007

 * Company: LoonFramework

 * 

 * @author chenpeng

 * @email：[email][email protected][/email]

 * @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);

            }

        });

}

本文轉自 cping 51CTO部落格，原文連結:http://blog.51cto.com/cping1982/130065