![\"\"](\"http:\/\/www.pixnbgames.com\/blog\/wp-content\/uploads\/2017\/11\/Captura-de-pantalla-2017-11-22-a-las-23.20.38-1024x612.png\")
<\/p>\n
Supongamos ahora que tenemos nuestro personaje principal caminando por la escena. Una de las cosas que habr\u00e1 que detectar son las colisiones con el escenario. Una aproximaci\u00f3n muy b\u00e1sica puede ser comprobar si la posici\u00f3n donde se encuentra el personaje est\u00e1 ocupada por un tile o est\u00e1 vac\u00eda. El problema es que en nuestro ejemplo, dibujamos en la misma capa elementos con los que s\u00ed se colisiona (suelo, agua) y otros elementos de decoraci\u00f3n con los que en principio no debe haber colisi\u00f3n (casa, arbustos). Por lo tanto si usamos este sistema para detectar colisiones, nuestro personaje colisionar\u00e1 tambi\u00e9n con los elementos de decoraci\u00f3n.<\/p>\n
Una soluci\u00f3n a este problema es separar los elementos de nuestro escenario en varias capas: tendremos una principal por donde se muevan nuestros personajes, y tantas como necesitemos para decorar y ambientar la escena.<\/p>\n
![\"\"](\"http:\/\/www.pixnbgames.com\/blog\/wp-content\/uploads\/2017\/11\/map_layers.png\")
<\/p>\n
Adem\u00e1s…<\/h4>\n
Hemos se\u00f1alado el problema de utilizar una sola capa a la hora de detectar las colisiones, pero esto no tiene por qu\u00e9 ser as\u00ed ya que podemos utilizar otros sistemas de detecci\u00f3n de colisiones que no dependan directamente del mapa del escenario (mapas de durezas, motor de f\u00edsicas, etc.). Sin embargo, otra ventaja que nos aporta el uso de varias capas es poder organizar mejor nuestros recursos o assets<\/em>; ya que podemos tener tilesets de decoraci\u00f3n que podremos reutilizar en distintos mapas de nuestro juego, aunque el tileset principal del escenario cambie.<\/p>\n A continuaci\u00f3n veremos c\u00f3mo usar varios tilesets y varias capas en un mapa de nuestro juego.<\/p>\n <\/p>\n Para seguir avanzando en nuestro ejemplo, crearemos un segundo tileset, con tiles de 16×16 p\u00edxeles en el que usaremos elementos para decorar la escena. En mi caso, he llamado a este archivo decoration.png<\/em><\/strong>, est\u00e1 guardado en la misma ruta donde se encuentra nuestro mapa, y contiene los siguientes tiles:<\/p>\n <\/p>\n A continuaci\u00f3n, haremos las siguientes modificaciones a nuestro mapa:<\/p>\n Este es el resultado de los cambios:<\/p>\n Todas las capas utilizadas son \u00abCapas de patrones<\/em>\u00ab, que son las utilizadas para dibujar el escenario a partir de nuestros tilesets.<\/p>\n Seg\u00fan nos indica la documentaci\u00f3n oficial de libGDX, podemos usar las capas que necesitemos, pero es importante que en una capa s\u00f3lo usemos tiles de un tileset<\/strong>. Esto es as\u00ed porque al dibujar una capa con m\u00e1s de una textura, se ve afectado negativamente el rendimiento al dibujar en pantalla.<\/p>\n <\/p>\n Para continuar con el ejemplo, podemos seguir sobre el proyecto del art\u00edculo anterior<\/a> o crear un nuevo proyecto. En mi caso, har\u00e9 una copia del proyecto anterior utilizando mi herramienta de clonado<\/a>:<\/p>\n <\/p>\n libGDX<\/em> nos da funciones para tratar y dibujar el mapa completo, o hacerlo por capas.<\/p>\n Para tratar las capas de un mapa, podemos hacerlo usando su nombre o su \u00edndice dentro de la lista de capas existentes. La clase que representa una capa de un mapa creado con Tiled Map Editor<\/em> es La capa de terreno (\u00abterrain<\/em>\u00ab) nos interesa tenerla de forma aislada en un objeto de la clase Cuando trabajamos con varias capas usando un array de \u00edndices, es importante el orden en el que se colocan los elementos. Esto es, el orden del array de \u00edndices determina el orden en el que se dibujan las capas<\/em>. En nuestro caso, cuando dibujemos el array El dibujado de capas, al igual que si dibuj\u00e1ramos el mapa completo, se hace con un objeto de la clase Si observamos el m\u00e9todo Por \u00faltimo, indicar que primero se dibujan las capas de decoraci\u00f3n y luego se dibuja la capa de terreno para que \u00e9ste \u00faltima quede \u00abpor encima\u00bb del resto.<\/p>\n <\/p>\n Pod\u00e9is consultar el proyecto de ejemplo desde mi respositorio de GitHub<\/em><\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":" En este art\u00edculo, tratar\u00e9 por qu\u00e9 y c\u00f3mo usar varias capas en nuestros dise\u00f1os de escenarios. Es un art\u00edculo un poco largo, as\u00ed que intentar\u00e9 explicarlo de forma ordenada para que queden claros los conceptos que quiero tratar. Para cualquier Seguir leyendo C\u00f3mo usa libGDX + Tiled: usando con varias capas<\/span>Usar varios tilesets<\/h3>\n
![\"\"](\"http:\/\/www.pixnbgames.com\/blog\/wp-content\/uploads\/2017\/11\/background.png\")
<\/p>\nModificar el mapa<\/h3>\n
\n
![\"\"](\"http:\/\/www.pixnbgames.com\/blog\/wp-content\/uploads\/2017\/11\/Captura-de-pantalla-2017-11-26-a-las-22.14.15-1024x531.png\")
<\/p>\nA tener en cuenta<\/h4>\n
Crear un nuevo proyecto<\/h3>\n
![\"\"](\"http:\/\/www.pixnbgames.com\/blog\/wp-content\/uploads\/2017\/11\/clonar-proyecto-1024x465.png\")
<\/p>\nTratando capas en libGDX<\/h3>\n
Obtener capas<\/h4>\n
TiledMapTileLayer<\/code>. En este ejemplo veremos c\u00f3mo usar los dos m\u00e9todos.<\/p>\nTiledMapTileLayer<\/code>, ya que nos facilitar\u00e1 el trabajo en el futuro. Por otro lado, para el resto de capas usaremos un array de enteros llamado decorationLayersIndices<\/code>, donde colocamos los \u00edndices de las capas \u00abdecoration<\/em>\u00bb y \u00abbackground<\/em>\u00ab.<\/p>\n...\r\npublic class MyGdxTiledGame extends ApplicationAdapter {\r\n ...\r\n private TiledMap map;\r\n private TiledMapTileLayer terrainLayer;\r\n private int[] decorationLayersIndices;\r\n ...\r\n @Override\r\n public void create () {\r\n ...\r\n \/\/ Reading map layers\r\n MapLayers mapLayers = map.getLayers();\r\n terrainLayer = (TiledMapTileLayer) mapLayers.get(\"terrain\");\r\n decorationLayersIndices = new int[] {\r\n mapLayers.getIndex(\"decoration\"),\r\n mapLayers.getIndex(\"background\")\r\n };\r\n ...\r\n }\r\n ...\r\n}\r\n<\/pre>\ndecorationLayersIndices<\/code>, primero se dibujar\u00e1 la capa \u00abdecoration<\/em>\u00bb y luego la capa \u00abbackground<\/em>\u00bb por encima de la primera.<\/p>\nDibujar capas<\/h4>\n
OrthogonalTiledMapRenderer<\/code>. Veamos como ser\u00eda:<\/p>\npublic class MyGdxTiledGame extends ApplicationAdapter {\r\n ...\r\n private OrthogonalTiledMapRenderer renderer;\r\n ...\r\n @Override\r\n public void create () {\r\n ...\r\n \/\/ Instantiation of the render for the map object\r\n renderer = new OrthogonalTiledMapRenderer(map);\r\n }\r\n\r\n @Override\r\n public void render () {\r\n \/\/ Clear screen\r\n Gdx.gl.glClearColor(.5f, .7f, .9f, 1);\r\n Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);\r\n\r\n \/\/ Update the camera\r\n camera.update();\r\n renderer.setView(camera);\r\n \r\n \/\/ Rendering\r\n renderer.render(decorationLayersIndices);\r\n renderer.getBatch().begin();\r\n renderer.renderTileLayer(terrainLayer);\r\n renderer.getBatch().end();\r\n }\r\n ...\r\n}\r\n<\/pre>\nImportante<\/h4>\n
render()<\/code> del ejemplo, vemos que existen diferencias entre dibujar una capa directamente o dibujarla mediantes sus \u00edndices. En el primer caso, es neceseario iniciar el batch de dibujo antes de dibujar las capas y finalizarlo al terminar.<\/p>\nC\u00f3digo fuente<\/h3>\n