绘制等距Tilemap

时间:2010-12-23 01:55:02

标签: c# xna 2d isometric

我一直在用C#/ XNA游戏工作室绘制等距地图,虽然我已经走得很远但看起来不太正确,我想知道是否有人可以提供帮助。

这是我绘制地图的代码:

public void Draw(SpriteBatch theBatch, int drawX, int drawY)
    {

        if ((drawY % 2 == 0))
            theBatch.Draw(tileTexture, new Rectangle((drawX * width), (drawY * length / 2), width, length), Color.White);
        else
            theBatch.Draw(tileTexture, new Rectangle(((drawX * width) + (width / 2)), (drawY * length / 2), width, length), Color.White);
    }

此方法中的代码就像在嵌套的for循环中一样,从左到右,从上到下绘制。当y值为奇数时,行被移位以适合,但它看起来有点偏。

这是8x5地图的生成输出:

http://imgur.com/xpDRU.png

正如你所看到的,它看起来不太合适,而且我不确定它是否与我的代码中的数学有关,或者它是否与订单有关。一切都被吸引进来。我对于C#来说非常陌生并且使用精灵,所以任何帮助都会非常感激。

因为它可能有用,所以这里是绘制地图的其他相关代码部分。

整个瓷砖类:

public class Tile
{
    // Dimension variables
    int height;
    int width;
    int length;

    String type;
    Texture2D tileTexture;
    Vector2 coordinates;

    /// 
    /// Tile Constructor
    /// 
    public Tile(ContentManager theContent, String theType, Vector2 theCoordinates)
    {
        width = 68;
        length = 46;

        type = theType;
        coordinates = theCoordinates;

        // Sets the right texture to the texture ref
        if (theType == "grass")
            tileTexture = theContent.Load<Texture2D>(@"Tiles\iso_grass");
    }

    /// 
    ///  Draws the tile at the given location
    /// 
    public void Draw(SpriteBatch theBatch, int drawX, int drawY)
    {

        if ((drawY % 2 == 0))
            theBatch.Draw(tileTexture, new Rectangle((drawX * width), (drawY * length / 2), width, length), Color.White);
        else
            theBatch.Draw(tileTexture, new Rectangle(((drawX * width) + (width / 2)), (drawY * length / 2), width, length), Color.White);
    }


}

TileRow类,它包含一行tile。

public class TileRow
{
        public List<Tile> Row = new List<Tile>();
        public int rowLength;

        public TileRow(int theLength, int yIndex, ContentManager theContent)
        {
            rowLength = theLength;
            Tile thisTile;

            // Here the tiles are created and added to the row
            for (int x = 0; x < rowLength; x++)
            {
                thisTile = new Tile(theContent, "grass", new Vector2(x, yIndex));
                Row.Add(thisTile);
            }
        }

        /// 
        /// Draw -- invokes the draw method of each tile in the row
        /// 
        public void DrawRow(SpriteBatch theBatch, int currentY)
        {
            for (int x = 0; x < rowLength; x++)
            {
                Row[x].Draw(theBatch, currentY, x);
            }
        }
    }
}

和MapStruct类,它包含所有行

public class MapStruct
{

    public List<TileRow> allRows = new List<TileRow>();
    int depth;

    // Constructor
    public MapStruct(ContentManager theContent, int theDepth, int rowLength)
    {
        depth = theDepth;
        TileRow thisRow;

        // Here we make a row of tiles for each level of depth
        for (int y = 0; y < depth; y++)
        {
            thisRow = new TileRow(rowLength, depth, theContent);
            allRows.Add(thisRow);
        }
    }

    ///
    /// Draw - this method invokes the draw method in each tile row, which then draws each tile
    ///
    public void DrawMap(SpriteBatch theBatch)
    {
        for (int y = 0; y < depth; y++)
        {
            allRows[y].DrawRow(theBatch, y);
        }
    }
}

如何解决这个问题的任何帮助,以及如何改进我的代码的建议将不胜感激!

2 个答案:

答案 0 :(得分:1)

看起来你的循环对每行的Y增加了一点点。 我在你的Tile函数中找到了这个变量。

length = 46;

我没有检查过,但我相信“长度”是瓷砖的高度?如果是这样,请尝试调整一下。也许,你忘记了减去瓷砖的高度。因此,如果图块的边是6像素,那么偏移pr的长度。行只有40个。

还要记得从上到下绘制,因为最近必须绘制最接近相机的贴片,以使深度错觉。

答案 1 :(得分:0)

我相信BerggreenDK是对的,但你的评论似乎让你误解了他的答案。您的瓷砖需要以Y偏移绘制,该偏移仅包括绿色表面区域“屏幕高度”。因此,绘制完整的图块大小,但偏移长度为5的行(其中10是估计的偏移量,5是该值的一半,因为每行应该仅偏移距离的一半)。

theBatch.Draw(tileTexture, new Rectangle((drawX * width), (drawY * (length) / 2), width, length - 5), Color.White);

...如果我的参数正确的话。

此外,行需要从后向前绘制,但它们似乎是从左到右绘制的?我不知道XNA,所以无法显示代码来解决这个问题...当我仔细观察时,“更远的地方”的某些瓷砖被“更近”的瓷砖覆盖。我不知道XNA并且没有确定绘图顺序是如何确定的,所以不能提供修复...