1

我一直在尝试创建一个tileset生成器(将两个图像混合在一起),但我被困在我需要什么样的方法才能使一个纹理/图像重叠到主要的,或者以某种方式在特定点淡出- 或者这是不能自动完成(或不应该完成)的事情?

瓷砖示例

随着绿色图像淡出,蓝色图像应在绿色图像之上淡入以进行平滑过渡。如果我已经有两张图片 - 我该怎么做?

现在,我只能剪掉蓝色的部分。所以剩下的唯一部分是绿色,当我尝试添加叠加层时,它只是很难看,我认为 alpha 水平应该增加(蓝色应该越靠近右下角越蓝)。

有什么想法我应该看的吗?

我目前的方法:但目前,这只适用于一个角落,但应该适用于“所有”角落;无法弄清楚是什么原因造成的。

点入多边形法

public static Bitmap GenerateTile(Bitmap bitmap, Bitmap copyFrom, int x, int y, int width, int height, Point[] cutoff)
{
        if (bitmap.Size != copyFrom.Size)
            throw new Exception("Invalid image size. Image sizes must match");

        Bitmap bmap = new Bitmap(width, height);
        Bitmap overlay = new Bitmap(width, height);

        Point min, max;
        float alpha;

        // returns minimum x, y and maximum x, y
        GetCorners(cutoff, out min, out max);

        for (int bx = x; bx < (x + width); bx++)
        {
            for (int by = y; by < (y + height); by++)
            {
                if (!IsInPolygon2(cutoff, new Point(bx, by)))
                {
                    bmap.SetPixel(bx, by, bitmap.GetPixel(bx, by));
                }
                else
                {

                    alpha = ((float)((max.X - bx) + (max.Y - by)) / (float)((max.X - min.X) + (max.Y - min.Y)));

                    if (alpha >= 0 && alpha <= 0.5f)
                    {
                        bmap.SetPixel(bx, by, Color.FromArgb((int)((alpha / 0.5f) * 255f), bitmap.GetPixel(bx, by)));
                        overlay.SetPixel(bx, by, Color.FromArgb((int)(255f - ((alpha / 0.5f) * 255f)), copyFrom.GetPixel(bx, by)));
                    }
                }
            }
        }

        using (Graphics g = Graphics.FromImage(bmap))
        {
            g.DrawImageUnscaled(overlay, 0, 0);
        }

        return bmap;
}

我的方法返回以下结果(还不好): 产生

// bottom right corner
points.Add(new Point(image.Width / 2, image.Height));
points.Add(new Point(image.Width, image.Height / 2));
points.Add(new Point(image.Width, image.Height));
points.Add(new Point(image.Width / 2, image.Height));

// rightside
points.Add(new Point(image.Width / 2, image.Height));
points.Add(new Point(image.Width, image.Height));
points.Add(new Point(image.Width, 0));
points.Add(new Point(image.Width / 2, 0));
points.Add(new Point(image.Width / 2, image.Height));
4

1 回答 1

1

我会尝试将草和雪纹理混合在一起作为 3D 基元。这样,您就不需要为纹理和淡入淡出方向的每种组合生成单独的位图。为了演示,您可以将以下代码片段粘贴到DrawVisual Studio 中默认 XNA 项目的方法中:

GraphicsDevice.Clear(Color.CornflowerBlue);
GraphicsDevice.BlendState = BlendState.NonPremultiplied;
effect.TextureEnabled = true;
effect.VertexColorEnabled = true;
effect.World = Matrix.CreateTranslation(new Vector3(-0.5f, -0.5f, 0))
    * Matrix.CreateScale(300)
    * Matrix.CreateTranslation(-Vector3.UnitZ);
effect.Projection = Matrix.CreateOrthographic(GraphicsDevice.Viewport.Width, GraphicsDevice.Viewport.Height, 1, 10000);
effect.View = Matrix.CreateLookAt(Vector3.UnitZ, Vector3.Zero, Vector3.UnitY);

var grassVertices = new[]
{
    new VertexPositionColorTexture(Vector3.Zero, new Color(1f, 1f, 1f, 1f), Vector2.Zero),
    new VertexPositionColorTexture(Vector3.UnitY, new Color(1f, 1f, 1f, 1f), Vector2.UnitY),
    new VertexPositionColorTexture(new Vector3(1, 1, 0), new Color(1f, 1f, 1f, 1f), Vector2.One),
    new VertexPositionColorTexture(Vector3.Zero, new Color(1f, 1f, 1f, 1f), Vector2.Zero),
    new VertexPositionColorTexture(new Vector3(1, 1, 0), new Color(1f, 1f, 1f, 1f), Vector2.One),
    new VertexPositionColorTexture(Vector3.UnitX, new Color(1f, 1f, 1f, 0f), Vector2.UnitX),
};
effect.Texture = grassTexture;
effect.Techniques[0].Passes[0].Apply();
GraphicsDevice.DrawUserPrimitives(PrimitiveType.TriangleList, grassVertices, 0, 2);

var snowVertices = new[]
{
    new VertexPositionColorTexture(Vector3.Zero, new Color(1f, 1f, 1f, 0f), Vector2.Zero),
    new VertexPositionColorTexture(Vector3.UnitY, new Color(1f, 1f, 1f, 0f), Vector2.UnitY),
    new VertexPositionColorTexture(new Vector3(1, 1, 0), new Color(1f, 1f, 1f, 0f), Vector2.One),
    new VertexPositionColorTexture(Vector3.Zero, new Color(1f, 1f, 1f, 0f), Vector2.Zero),
    new VertexPositionColorTexture(new Vector3(1, 1, 0), new Color(1f, 1f, 1f, 0f), Vector2.One),
    new VertexPositionColorTexture(Vector3.UnitX, new Color(1f, 1f, 1f, 1f), Vector2.UnitX),
};
effect.Texture = snowTexture;
effect.Techniques[0].Passes[0].Apply();
GraphicsDevice.DrawUserPrimitives(PrimitiveType.TriangleList, snowVertices, 0, 2);

这是LoadContent初始化资源的方法所需要的:

grassTexture = Content.Load<Texture2D>("grass");
snowTexture = Content.Load<Texture2D>("snow");
effect = new BasicEffect(GraphicsDevice);

要在其他方向创建平铺淡入淡出,您只需编辑grassVerticessnowVertices。对于直接向右、向左、向上或向下的渐变,您需要使用四个三角形而不是两个。

于 2013-03-16T09:18:06.287 回答