Libgdx:如何使用动态尺寸在TiledMap周围绘制圆角边框?

时间:2014-03-20 12:02:50

标签: graphics libgdx border

在libgdx中,我有一个TiledMap,我用不同的Cell填充:

cell.setTile(new StaticTiledMapTile(reg1));
cell.setTile(new StaticTiledMapTile(reg2));
cell.setTile(new StaticTiledMapTile(reg...));

其中reg是纹理区域。

我渲染:

render = new OrthogonalTiledMapRenderer(map);
render.setView(cam);
render.render();

在整个游戏中,列数,行数和单元格大小会有所不同,因此它们必须保持动态。

现在,围绕这个TiledMap,我想添加一个圆角边框。下面我将在png中展示我计划如何做的一些例子:从左到右,首先是顶部边框,然后是右上角,然后是右边框。这些png文件中的每一个都具有方形尺寸。

top border top-right corner right border

我想在下面实现,这里是TiledMap右上角的缩放:

enter image description here

我打算将这些png用作TextureRegions,我可以将其设置为TiledMap中的单元格,如下所示:

    for (int x = 0; x < numcol+2; x++) {
            for (int y = 0; y < numrow+2; y++) {
                Cell cell = new Cell();                 

                if (y==numrow+1) {
                    cell.setTile(new StaticTiledMapTile(b_mid_top));
                }

                if (y==0) {
                    cell.setTile(new StaticTiledMapTile(b_mid_bottom));
                }
etc.

我对png的维度存在多个问题:正如我所提到的,整个游戏中细胞的大小可能会有所不同。据我所知,没有办法根据需要调整png中的单元格或纹理区域的大小。 所以我可以使用Image,动态调整它们,将它们作为actor添加到舞台上并绘制舞台,但我担心我可能会失去使用TiledMap的好处。另外,我必须一方面处理舞台坐标,另一方面处理TiledMap坐标,这听起来不是最好的方法。

所以我有点失落! 在TiledMap周围绘制边框的最佳方法是什么? 我准备放弃我目前的任何一个更好的想法。我对Libgdx不是很有经验,如果我犯了一些愚蠢的错误,我很抱歉。

1 个答案:

答案 0 :(得分:1)

我认为这个想法很好。如果tilesize更改了borderize也发生了变化。您无法在其周围创建不同大小的图块作为框架。如果您想要始终创建相同的框架,可以使用具有Map大小的简单Ninepatch

创建这样的东西:

NinePatch p = new NinePatch(texture, 5, 5, 5, 5); // the edge sizes are 5px here.

在render方法的内部,您可以使用tilemap的大小绘制它。你可以从Map对象中获取大小:

p.draw(batch, 0, 0, tilesize*tilecountx, tilesize*tilecounty);

如果你不喜欢他的想法,你可以选择第二个版本。使用边框创建一个新的TiledMap作为需要复制整个Tilemap的图块,其偏移量为1个图块(因为您需要有1个图块空间)并创建一个包含2行和多列的新图块。

应该看一下这样的例子:

map = new TiledMap(); // the map with the bordercells
MapLayers layers = map.getLayers();
for (int l = 0; l < map1.getLayers().getCount(); l++) {
    // create a new layer which is bigger
    TiledMapTileLayer newlayer = new TiledMapTileLayer(
            ((TiledMapTileLayer) map1.getLayers().get(0)).getWidth() + 2,
            ((TiledMapTileLayer) map1.getLayers().get(0)).getHeight() + 2,
            (int) ((TiledMapTileLayer) map1.getLayers().get(0))
                    .getTileWidth(), (int) ((TiledMapTileLayer) map1
                    .getLayers().get(0)).getTileHeight());

    // now add the cells here
    for (int x = 0; x < newlayer.getWidth(); x++) {
        for (int y = 0; y < newlayer.getHeight(); y++) {
            //add the right tile regions here!
            if(x == 0 && y == 0){
                Cell cell = new Cell();
                cell.setTile(new StaticTiledMapTile(first edge));
                newlayer.setCell(x, y, cell);
                continue;
            }

            if(x == newlayer.getWidth()-1 && y == 0){
                Cell cell = new Cell();
                cell.setTile(new StaticTiledMapTile(second edge));
                newlayer.setCell(x, y, cell);
                continue;
            }
            if(x == 0 && y == newlayer.getHeight()-1){
                Cell cell = new Cell();
                cell.setTile(new StaticTiledMapTile(third edge));
                newlayer.setCell(x, y, cell);
                continue;
            }

            if(x == newlayer.getWidth()-1 && y == newlayer.getHeight()-1){
                Cell cell = new Cell();
                cell.setTile(new StaticTiledMapTile(fourth edge));
                newlayer.setCell(x, y, cell);
                continue;
            }

            if(x == 0){ 
                Cell cell = new Cell();
                cell.setTile(new StaticTiledMapTile(textureregion for bottom here));
                newlayer.setCell(x, y, cell);
                continue;
            }

            if(y == 0){
                Cell cell = new Cell();
                cell.setTile(new StaticTiledMapTile(textureregion for first col));
                newlayer.setCell(x, y, cell);
                continue;
            }

            if(x == newlayer.getWidth()-1){
                Cell cell = new Cell();
                cell.setTile(new StaticTiledMapTile(textureregion for toprow));
                newlayer.setCell(x, y, cell);
                continue;
            }

            if(y == newlayer.getHeight()-1){
                Cell cell = new Cell();
                cell.setTile(new StaticTiledMapTile(textureregion for last col));
                newlayer.setCell(x, y, cell);
                continue;
            }
            //last but not least if none of this fit add the tile from the old map
            //dont forget the offsett
            newlayer.setCell(x, y, ((TiledMapTileLayer)map1.getLayers().get(l)).getCell(x-1, y-1)); //map1 is the original map without the borders
        }
    }
    layers.add(newlayer);
}

如果你真的有不同的瓷砖,我会为你使用TiledMap版本的每个瓷砖增加一个Bordertexture。如果您想调整Texture的大小,请为Sprite取一个.setSize(w,h)。 Sprite提供TextureRegion并扩展TiledMapTile。要创建静态Sprite,您还可以将Texture添加为StaticTiledMapTile因此,如果您接受这个想法,请在创建{{1}}之前使用精灵并将其调整为平铺大小。