XNA等距瓷砖渲染问题

时间:2010-11-30 22:26:41

标签: xna tiles sprite isometric

我目前正在研究XNA游戏原型。我正在尝试实现游戏世界的等距视图(或者它是othographic?我不确定哪个是这个投影的正确术语 - 见图片)。 世界应该是一个由立方体瓷砖构成的基于瓷砖的世界(例如类似于Minecraft的世界),并且我试图通过使用精灵来渲染它。

所以我有一张精灵表,上面有立方体,正面和侧面(可见面)。我使用3个单独的调用drawSprite绘制瓷砖,一个用于顶部,一个用于侧面,一个用于前面,使用源矩形选择我想要绘制的面,目标矩形用于设置屏幕上的位置到一个公式,从3D世界坐标转换为等距(正交?)。

(样本精灵: Sprite

只要我绘制面部效果很好,但如果我尝试绘制每个块的精细边缘(按照平铺网格),我可以看到我得到一个随机渲染模式,其中一些行被覆盖面对自己,有些则不是。

请注意,对于我的世界代表,X从左到右,Y在屏幕内到外屏幕,Z在上下。

在这个例子中,我只使用顶部边缘。这是我得到的(图片):

alt text

我不明白为什么会显示某些线条而某些线条不显示。 我使用的渲染代码是(注意在这个例子中,我只绘制每个维度中的最顶层):

/// <summary>
/// Draws the world
/// </summary>
/// <param name="spriteBatch"></param>
public void draw(SpriteBatch spriteBatch)
{
    Texture2D tex = null;

    // DRAW TILES
    for (int z = numBlocks - 1; z >= 0; z--)
    {
        for (int y = 0; y < numBlocks; y++)
        {
            for (int x = numBlocks - 1; x >=0 ; x--)
            {

                myTextures.TryGetValue(myBlockManager.getBlockAt(x, y, z), out tex);
                if (tex != null)
                {
                    // TOP FACE
                    if (z == 0)
                    {
                        drawTop(spriteBatch, x, y, z, tex);
                        drawTop(spriteBatch, x, y, z, outlineTexture);
                    }

                    // FRONT FACE
                    if(y == numBlocks -1)
                        drawFront(spriteBatch, x, y, z, tex);

                    // SIDE FACE
                    if(x == 0)
                        drawSide(spriteBatch, x, y, z, tex);

                }
            }
        }
    }
}


private void drawTop(SpriteBatch spriteBatch, int x, int y, int z, Texture2D tex)
        {
            int pX = OffsetX + (int)(x * TEXTURE_TOP_X_OFFRIGHT + y * TEXTURE_SIDE_X);
            int pY = OffsetY + (int)(y * TEXTURE_TOP_Y + z * TEXTURE_FRONT_Y);
            topDestRect.X = pX;
            topDestRect.Y = pY;
            spriteBatch.Draw(tex, topDestRect, TEXTURE_TOP_RECT, Color.White);   
        }

我尝试使用不同的方法,在第一个之后创建第二个3层嵌套for循环,所以我保持第一个循环中的顶面绘制和第二个循环中的边缘突出显示(我知道,这是低效的,我也应该避免为每个瓷砖绘制一个方法调用来绘制它,但我现在只是想让它工作起来。)

结果在某种程度上更好但仍未按预期工作,缺少顶行,请参见图片:

alt text

知道为什么我遇到这个问题?在第一种方法中,它可能是一种z战斗,但我是按照精确的顺序绘制精灵,所以它们不应该覆盖已经存在的东西吗?

谢谢大家

3 个答案:

答案 0 :(得分:1)

哇,对不起伙计我是个白痴:)我用SpriteBatch.begin(SpriteSortMode.BackToFront)启动了批处理,但我没有在绘图中使用任何z值。 我应该使用SpriteSortMode.Deferred!它现在工作正常。谢谢大家!

答案 1 :(得分:0)

尝试将源矩形和目标矩形的大小调整1或2像素。我有一种潜在的怀疑,这与这些矩形被处理为待渲染区域的“轮廓”以及一种逐个问题的方式有关。这不是专家建议,只是编码员的直觉。

答案 2 :(得分:0)

看起来像子像素精度或缩放问题。还要尽量确保纹理/平铺宽度/高度是2(32,64,128等)的幂,因为这样可以减少效果。从这些照片中分辨出来真的很难。

我不知道如何扩展所有内容,但是你应该尽可能避免舍入(特别是在你的drawTop()方法中)。每次你绕一些位置/坐标机会都很好,你可能会增加错误/随机偏移。尝试使用double(或更好:float)坐标而不是整数。