机器人的OpenGL - ES纹理出血 [英] Android OpenGL - ES Texture bleeding

问题描述

我写一个小的应用程序，在目前产生的纹理随机地图。

I am writing a small app that at the moment generates a random map of textures.

我画这个图是一个10×15组圣城，这是逸岸所有的三角形带。我用的是地图抓住一个int，我再取作为纹理的这个广场在textureAtlas的位置。因此，例如0左下方板砖。这本地图册是128×128，并分割成32像素的瓷砖。

I am drawing this map as a 10 x 15 group of "quads" which are infact all triangle strips. I use the "map" to grab an int which I then take as the location of the texture for this square in the textureAtlas. so for example 0 is the bottom left "tile". The atlas is 128 x 128 and split into 32 pixel tiles.

不过，我似乎得到一些奇怪的文物，其中从一砖纹理匍匐在下一瓦。我想知道，如果它是图像本身，但据我可以告诉像素的确切位置，他们应该的。然后我看着纹理COORDS我被指定，但他们都期待准确的（0.0，0.25，0.5，0.75，1.0 - 将其分割成4行和列我所期望的）。

However I seem to be getting some odd artifacts where the texture from the one tile is creeping in to the next tile. I wondered if it was the image itself but as far as I can tell the pixels are exactly where they should be. I then looked at the texture coords I was specifying but they all look exact (0.0, 0.25, 0.5, 0.75, 1.0 - splitting it into the 4 rows and columns I would expect).

奇怪的是，如果我在模拟器上运行它，我没有得到任何文物。

The odd thing is if I run it on the emulator I do not get any artifacts.

有我缺少这将导致1个像素的出血设置？这似乎只是垂直太 - 这可能与在手机上我伸展，在这个方向作为手机的屏幕上的图像大于正常的方向

Is there a setting I am missing which would cause bleeding of 1 pixel? It seemed to only be vertical too - this could be related to on the phone I am "stretching" the image in that direction as the phone's screen is larger than normal in that direction.

我加载纹理像这样：

//Get a new ID
    int id = newTextureID(gl);

    //We will need to flip the texture vertically
    Matrix flip = new Matrix();
    flip.postScale(1f, -1f);

    //Load up and flip the texture
    Bitmap temp = BitmapFactory.decodeResource(context.getResources(), resource);

    //Store the widths for the texturemap
    int width = temp.getWidth();
    int height = temp.getHeight();
    Bitmap bmp = Bitmap.createBitmap(temp, 0, 0, width, height, flip, true);
    temp.recycle();

    //Bind
    gl.glBindTexture(GL10.GL_TEXTURE_2D, id);

    //Set params
    gl.glTexParameterf(GL10.GL_TEXTURE_2D, GL10.GL_TEXTURE_MIN_FILTER, gl.GL_LINEAR);
    gl.glTexParameterf(GL10.GL_TEXTURE_2D, GL10.GL_TEXTURE_MAG_FILTER, gl.GL_LINEAR);

    //Push onto the GPU
    GLUtils.texImage2D(GL10.GL_TEXTURE_2D, 0, bmp, 0);

    TextureAtlas atlas = new TextureAtlas(id, width, height, tileSize);
    return atlas;

我然后渲染它，如下所示：

I then render it like so:

gl.glBindTexture(GL10.GL_TEXTURE_2D, currentAtlas.textureID);
    //Enable the vertices buffer for writing and to be used during our rendering
    gl.glEnableClientState(GL10.GL_VERTEX_ARRAY);
    //Specify the location and data format of an array of vertex coordinates to use
    gl.glVertexPointer(3, GL10.GL_FLOAT, 0, vertexBuffer);

    //Enable the texture buffer
    gl.glEnableClientState(GL10.GL_TEXTURE_COORD_ARRAY);
    gl.glTexCoordPointer(2, GL10.GL_FLOAT, 0, textureBuffer);
    gl.glDrawElements(GL10.GL_TRIANGLES, indices.length, GL10.GL_UNSIGNED_SHORT, indexBuffer);

我想拍摄照片​​，但我不能确定如何从手机屏幕盖...

I would take a picture, but I am unsure how to get a screen cap from the phone...

如果有人知道我怎么能捕捉到当前帧，也许把它伸到一个文件，我会做，如果这有助于解释这是怎么回事！

If anyone knows of how I can capture the current frame and perhaps put it out into a file I will do that if it helps explain what is going on!

期待您的回复。

编辑：这是一个screencap - 注意我运行应用程序的景观，但上限是在画像。此外借口可怕的纹理。：D他们只是一个占位符/乱搞

Here is a screencap - note I run the app in landscape but cap is in portrait. Also excuse the horrible textures :D they were merely a place holder / messing around.

ScreenCap

推荐答案

好了，说给朋友后，我设法解决这个小问题。

Well, after speaking to a friend I managed to solve this little problem.

事实证明，如果你想有确切的像素完美的纹理，你必须指定纹理的边缘是半路到像素。

It turns out that if you wish to have exact pixel perfect textures you have to specify the edge of the texture to be halfway into the pixel.

要做到这一点，我只是增加半个像素或减去半个像素的测量纹理COORDS。

To do this I simply added half a pixel or subtracted half a pixel to the measurement for the texture coords.

像这样：

//Top Left
            textureCoords[textPlace] = xAdjust*currentAtlas.texSpaceWidth + currentAtlas.halfPixelAdjust;        textPlace++;
            textureCoords[textPlace] = (yAdjust+1)*currentAtlas.texSpaceHeight - currentAtlas.halfPixelAdjust;    textPlace++;

加载纹理地图时，这是简单的计算：

This was simply calculated when loading the texture atlas:

(float)(0.5 * ((1.0f / numberOfTilesInAtlasRow) / pixelsPerTile));

虽然如果高度是不同的，以每个tile的宽度（可能发生），你将需​​要单独计算它们。

Although if the height was different to the width of each tile (which could happen) you would need to calculate them individually.

这已经解决了所有的文物，所以我可以继续。希望它可以帮助别人！

This has solved all the artifacts so I can continue on. Hope it helps someone else!

这篇关于机器人的OpenGL - ES纹理出血的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！