tilemap软件使用_使用Tilemap的等距2D环境

tilemap软件使用

With the release of Unity 2018.3, we introduced Isometric Tilemap support – closely following Hexagonal Tilemap support which was added in the 2018.2 release. The new Tilemap features provide a fast and performant way to create 2D environments based on isometric and hexagonal grid layouts, the likes of which are seen in many game classics, including the first entries of the Diablo and Fallout franchises, Civilization, Age of Empires, and many more.

随着Unity 2018.3的发布,我们引入了Isometric Tilemap支持-紧跟在2018.2版本中添加的Hexagonal Tilemap支持。 新的Tilemap功能提供了一种快速,高效的方法来基于等距和六边形网格布局创建2D环境,在许多经典游戏中,例如《暗黑破坏神》和《辐射》系列的首批参赛作品,《文明》,《帝国时代》,还有很多。

Both features build on top of the existing Tilemap system introduced back in Unity 2017.2, and working with them today is just as easy! They are also natively integrated into the Editor. In further Unity releases, they might be moved to the package manager.

这两个功能都建立在Unity 2017.2中引入的现有Tilemap系统的基础上,今天就可以轻松使用它们了! 它们也被本地集成到编辑器中。 在Unity的其他发行版中,它们可能会移到软件包管理器中。

If you’re interested in following along and experimenting with the techniques shown, we’ve created a pre-configured Isometric Starter Kit project with an animated character and multiple environment tilesets, which you can download for free.

如果您有兴趣遵循并尝试显示的技术,我们已经创建了一个预配置的Isometric Starter Kit项目,该项目具有动画角色和多个环境tileset,可以免费下载

等轴测图的项目设置 (Project Settings for Isometric Tilemap)

Before we start working with Tilemap, it is important to set up our project correctly. Isometric Tilemap works with 2-dimensional sprites, and it relies on correct renderer sorting in order to create the illusion of a top-down isometric view. We need to make sure that the tiles that are further away from the viewer get painted first; and those that are closer painted on top of them.

在开始使用Tilemap之前,正确设置项目很重要。 等轴测图贴图可用于二维Sprite,并且它依赖于正确的渲染器排序,以创建自上而下的等轴测图的错觉。 我们需要确保距离观看者更远的瓷砖首先被绘制; 以及那些更靠近它们的画。

To customize the order in which 2D objects are painted on the screen, we can use Unity’s Custom Axis Sort feature. You can define this setting either per-camera (currently, this is the default way to do it in the Scriptable Render Pipelines, including LWRP and HDRP) – or globally at the project level.

要自定义2D对象在屏幕上的绘制顺序,我们可以使用Unity的“自定义轴排序”功能。 您可以按摄像机定义此设置(当前,这是在可编写脚本的渲染管道(包括LWRP和HDRP)中进行此设置的默认方法),也可以在项目级别进行全局定义。

To define a Custom Axis Sort at the Project level, go to Edit > Project Settings > Graphics. In the Camera Settings section, you will see a Transparency Sort Mode dropdown, as well as the X, Y, and Z value settings for the Transparency Sort Axis.

要在项目级别定义自定义轴排序,请转到 编辑>项目设置>图形 。 在“相机设置”部分中,您会看到一个“透明度排序模式”下拉列表以及“透明度排序轴”的X,Y和Z值设置。

By default, the Transparency Sort Axis in Unity is set to (0, 0, 1) for XYZ respectively. However, all of our 2D tiles are actually on the same Z plane. Instead, we can determine which tiles are behind or in front by using their height on screen, rather than their depth. Tiles which are positioned higher on the screen will be sorted behind those which are placed lower. To sort the tiles based on height, change the Transparency Sort Mode to Custom; and set the Transparency Sort Axis values to (0, 1, 0).

默认情况下,对于XYZ,Unity中的透明度排序轴分别设置为(0,0,1)。 但是,我们所有的2D切片实际上都在同一Z平面上。 取而代之的是,我们可以通过使用屏幕上的高度而不是深度来确定哪些图块在后面还是在前面。 屏幕上位于较高位置的图块将排在较低位置的后面。 要根据高度对图块进行排序,请将透明度排序模式更改为自定义; 并将“透明度排序轴”值设置为(0,1,0)。

You can read the relevant Unity Documentation page for 2D sorting if you want to learn more about how it works.

如果您想了解更多有关2D排序的信息, 可以阅读相关的Unity文档 页面

In some cases, you may also want to adjust the Z value of your Transparency Sort Axis. We will cover this in more depth later on in this blog post.

在某些情况下,您可能还需要调整透明度排序轴的Z值。 我们将在本博客文章的后面部分对此进行更深入的介绍。

Tilemap类型 (Tilemap Types)

The Tilemap feature consists of several components working together. The first two are the Grid and Tilemap Game Objects. To create a Grid, simply right-click anywhere in the Hierarchy, go to 2D Object, and select the type of Tilemap you wish to use. By default, each new Grid is created with one child Tilemap Game Object of the corresponding type. The currently available Tilemap types are as follows:

Tilemap功能由多个相互配合的组件组成。 前两个是Grid和Tilemap游戏对象。 要创建网格,只需右键单击层次结构中的任意位置,转到2D对象,然后选择要使用的Tilemap类型。 默认情况下,将使用一个对应类型的子Tilemap游戏对象创建每个新Grid。 当前可用的Tilemap类型如下:

Tilemap – creates a rectangular Grid and Tilemap. An example of using this Tilemap can be seen in Unity’s 2D Game Kit.

Tilemap –创建一个矩形的Grid和Tilemap。 在Unity的 2D游戏工具包中 可以看到使用此Tilemap的示例 。

Hexagonal Point Top Tilemap – creates a Hexagonal Grid and Tilemap, where one of the vertices of each hexagon is pointing upwards.

六边形点顶部图块贴图 –创建一个六边形网格和图块图,其中每个六边形的一个顶点指向上方。

Hexagonal Flat Top Tilemap – another Hexagonal Grid type, where the top of the hexagon is an edge which is parallel to the top of the screen.

六边形平顶图块贴图 -另一种六边形网格类型,其中六边形的顶部是与屏幕顶部平行的边。

The last two types, Isometric and Isometric Z as Y, create two different implementations of the isometric grid. The difference between them arises when simulating different tile elevation levels, such as when we have a raised platform in our Isometric level.

最后两种类型, 等距等距Z为Y ,创建等距网格的两种不同实现。 当模拟不同的图块高程级别时,例如当我们在等轴测图中有一个升高的平台时,它们之间的差异就会出现。

A regular Isometric Tilemap is best used when you wish to create separate Tilemap Game Objects for each individual elevation level of the tiles. This will simplify the process of creating automatic collision shapes – but you will have less flexibility when it comes to height variation between the tiles since all the tiles on one layer will have to be on the same ‘plane’.

当您希望为图块的每个单独的高程级别创建单独的图块地图游戏对象时,最好使用 常规的 等距 图块地图。 这将简化创建自动碰撞形状的过程-但涉及到图块之间的高度变化时,灵活性会降低,因为一层上的所有图块都必须位于同一“平面”上。

In the case of an Isometric Z as Y Tilemap, the Z position value of each tile works in combination with the custom Transparency Axis Sort setting to make the tiles appear as stacked on top of one another. When painting on a Z as Y Tilemap, we dynamically adjust the Z setting on the brush to switch between different heights. The Z as Y Tilemap requires an additional Z value in the Custom Transparency Sort Axis to render correctly.

对于等 轴测Z为Y Tilemap的情况 ,每个图块的Z位置值都与自定义“透明轴排序”设置结合使用,以使图块看起来像是堆叠在一起。 在Z上绘制为Y Tilemap时,我们会动态调整笔刷的Z设置以在不同的高度之间切换。 将“ Z as Y”图块贴图 需要在“自定义透明度排序轴”中附加一个Z值才能正确渲染。

Note: The assets shown here are from the Temple tileset in our Isometric Starter Kit project. Feel free to grab it – completely free – and have some fun creating your own environments!

注意:此处显示的资产来自我们的 Isometric Starter Kit 项目中 的Temple模板集 完全免费-完全免费-尽情享受创建自己的环境的乐趣!

Think of the Grid as the ‘easel’ that holds your Tilemap Game Objects – which are essentially canvases that you will be painting your tiles onto. To start painting on a Tilemap, you also need a brush and a palette. A Tile Palette is what holds your tile assets, after which you can pick them with the brush tool and start painting.

可以将网格视为保存“ Tilemap游戏对象”的“画架”,这些对象实际上是要在其上绘制图块的画布。 要开始在Tilemap上绘画,还需要一个画笔和一个调色板。 瓷砖调色板是用来存放瓷砖资产的工具,之后您可以使用画笔工具将其选中并开始绘画。

To create a Tile Palette, choose Window > 2D > Tile Palette. In the newly opened window, in the top left dropdown choose “Create New Palette”. Make sure to set the grid type that corresponds to your use case. For this example, I will be using a regular Isometric Tilemap; as well as the assets from our Isometric Starter Kit project. Set the palette cell size to Manual to be able to customize the dimensions of your isometric tiles. In this case, I know that the dimensions of my tiles correspond to a grid of 1 in X and 0.5 in Y; however, for your use case, it will depend on the resolution, pixels per unit values selected at import and dimensions of the assets – essentially, on the isometric angle at which the tiles are rotated.

要创建“拼贴面板”,请选择“窗口”>“ 2D”>“拼贴面板”。 在新打开的窗口中,从左上方的下拉菜单中选择“创建新调色板”。 确保设置与您的用例相对应的网格类型。 在本例中,我将使用常规的等距图块; 以及我们 等距入门套件项目 的资产 。 将调色板单元格大小设置为“手动”,以能够自定义等距图块的尺寸。 在这种情况下,我知道我的图块的尺寸对应于X中为1且Y中为0.5的网格; 但是,在您的用例中,它取决于分辨率,在导入时选择的每单位像素值和资产的尺寸–本质上取决于磁贴旋转的等距角。

进口资产须知 (A note on importing assets)

You might be unsure about the correct import settings and tilemap size that will work for your assets. There is a general rule that you can follow here based on your initial asset dimensions. First, take a look at the resolution of your tiles. Typically, isometric tiles that are represented as a block are taller than they are wide; ‘flat’ tiles (ones that appear as a plane rather than a cube) are wider than they are tall. However, the width will always be the same between them. Therefore, if you want your tiles to take up exactly one Unity unit, set the Pixels Per Unit value in the tile import settings equal to their width in pixels. You may want to adjust this value in some cases – usually by decreasing it (or increasing the actual resolution of your assets); this could be useful if you are trying to produce an effect where some tiles appear to take up more than one grid cell and overlay the neighboring tiles.

您可能不确定适合您资产的正确导入设置和tilemap大小。 根据您的初始资产规模,有一个通用规则可以遵循。 首先,看看瓷砖的分辨率。 通常,以块表示的等轴测图块的高度大于宽度。 “扁平”砖(看起来像是平面而不是立方体)比它们的高还宽。 但是,它们之间的宽度将始终相同。 因此,如果您希望图块恰好占据一个Unity单位,请 在图块导入设置 中将“ 像素单位” 值设置为等于其宽度(以像素为单位)。 在某些情况下,您可能希望调整此值-通常是通过减小它(或增加资产的实际分辨率)来实现; 如果您尝试产生一种效果,其中某些图块似乎占据了一个以上的网格单元并覆盖相邻的图块,则这可能很有用。

In order to decide on the correct Y grid value for the tiles, take the height of the base (or cap) of a single tile, and divide it by the width. This will give you a Y value relative to the X, provided that X is 1. Let’s look at some examples:

为了确定图块的正确Y网格值,请获取单个图块底部(或顶盖)的高度,然后将其除以宽度。 假设X为1,这将为您提供一个相对于X的Y值。让我们看一些示例:

For the pixel art that we are using in this project, all tiles have a base height of 32 pixels, and are 64 pixels wide. Therefore, the grid size that we will be using is exactly 0.5 in Y.

对于我们在此项目中使用的像素图,所有图块的基本高度均为32像素,而宽度为64像素。 因此,我们将使用的网格大小恰好是Y的0.5。

The second block in the example image comes from an asset pack from Golden Skull Studios – you can check it out here. The example tile has been scaled down for reference, but the original assets are 128 pixels wide. The tile base is about 66 pixels tall, giving us a Y grid size of 66/128 – approximately 0.515 units.

示例图像中的第二个块来自Golden Skull Studios的资产包–您可以 在此处查看 。 示例图块已按比例缩小,但原始资源的宽度为128像素。 瓦片的底部大约是66像素高,这使我们的Y网格大小为66/128 –大约0.515个单位。

基本的Tilemap工作流程 (Basic Tilemap Workflow)

Once we have settled on the correct Grid dimensions, let’s go ahead and add some tiles to our palette. Simply grab one of your tile sprites and drag it over into the Tile Palette window. This will create a Tile Asset. It contains some information about the tile itself, such as the sprite(s) that it is using, a tint color, and the type of collider that it will generate. If you want to see the detailed information about a tile on the palette, choose the Select (S) tool at the top of the Tile Palette window and click on that tile. Now, in the Inspector, you should be able to see which Tile asset it is referencing.

确定正确的网格尺寸后,让我们继续向面板添加一些瓷砖。 只需抓住您的一个瓷砖精灵并将其拖动到“瓷砖调色板”窗口中即可。 这将创建一个图块资产。 它包含有关图块本身的一些信息,例如它所使用的精灵,色调颜色以及它将生成的对撞机类型。 如果要查看调色板上有关瓷砖的详细信息,请选择“瓷砖调色板”窗口顶部的“选择(S)”工具,然后单击该瓷砖。 现在,在检查器中,您应该能够看到它正在引用哪个Tile资产。

To paint the new Tile onto our Tilemap, select the Brush (B) tool, and click the Tile in the Palette. You will now be able to paint with the selected Tile in the scene view. Some other painting tools include the Eraser (D), Box Fill (U), Flood Fill (G), and the Tile Picker (I).

要将新的Tile绘制到我们的Tilemap上,请选择Brush(B)工具,然后单击Palette中的Tile。 现在,您将能够在场景视图中使用选定的图块进行绘制。 其他一些绘画工具包括橡皮擦(D),盒子填充(U),洪水填充(G)和瓷砖拾取器(I)。

Sometimes, you might also wish to edit the arrangement of the tiles in the palette itself. Just below the toolbar, you will see an Edit button. If you click it, you will go into the palette editing mode, during which the tools will affect the Tile Palette itself. Don’t forget to exit out of this mode once you’ve made the desired changes.

有时,您可能还希望在调色板本身中编辑拼贴的排列。 在工具栏下方,您将看到一个“编辑”按钮。 如果单击它,则将进入调色板编辑模式,在此模式下,工具会影响Tile Palette本身。 完成所需的更改后,不要忘记退出此模式。

Tilemap渲染器模式 (Tilemap Renderer Modes)

In some cases, you might see a situation where tiles of different types are not sorting correctly, despite being on the same Tilemap, like in the example below:

在某些情况下,您可能会遇到以下情况:尽管位于同一Tilemap上,但不同类型的tile仍无法正确排序,如下例所示:

This is determined by the Mode setting on the Tilemap Renderer component. By default, the Mode is set to Chunk.

这由Tilemap Renderer组件上的“模式”设置确定。 默认情况下,模式设置为块。

Chunk mode is effective at reducing the performance cost of Tilemap. Instead of rendering each tile individually, it batch renders them in one go, as a large block. However, there are two main drawbacks to using it. The first one is the fact that it does not support dynamic sorting with other 2D objects in the scene. This means that if your Tilemap is in Chunk mode, it will not be able to dynamically sort behind and in front of other objects, such as characters – only one or the other will be possible at a time, based on the Order in Layer setting. However, it is still extremely effective when you want to optimize your game, and can be used to batch render large areas of the ground.

模式可有效降低Tilemap的性能成本。 它不是单独渲染每个图块,而是一次性将它们作为一个大块批量渲染。 但是,使用它有两个主要缺点。 第一个事实是它不支持与场景中的其他2D对象进行动态排序。 这意味着,如果您的Tilemap处于“块”模式,它将无法动态排序在其他对象(例如字符)的前面和后面–根据“图层顺序”设置,一次只能选择一个或另一个。 但是,当您要优化游戏时,它仍然非常有效,可用于批量渲染大面积的地面。

However, this does not get around the issue of different tiles not sorting with each other. In order to batch-render tiles that come from two or more different sprites (i.e. textures), the sprites have to be unified under a single Sprite Atlas asset.

但是,这不能解决不同图块彼此不排序的问题。 为了批量渲染来自两个或多个不同Sprite(即纹理)的图块,必须将Sprite统一在一个Sprite Atlas资产下。

To create a Sprite Atlas, choose Assets > Create > Sprite Atlas. In the Sprite Atlas settings, you will find the list of Objects for Packing. Simply drag all of the tiles that you wish to be batch rendered into this list, and set the correct import settings – usually equivalent to those on your individual sprites.

要创建Sprite Atlas,请选择“ 资产”>“创建”>“ Sprite Atlas” 。 在Sprite Atlas设置中,您将找到 包装对象 列表 。 只需将希望批量渲染的所有图块拖动到此列表中,然后设置正确的导入设置-通常与单个子画面上的设置相同。

Once you have done that, the tiles will sort correctly; but they will only be visible in this way when in Play mode or at runtime.

完成此操作后,图块将正确排序; 但是只有在“播放”模式下或在运行时,它们才会以这种方式可见。

As such, it is better to set your Tilemap Renderer Mode to Individual while editing. It will sort each tile separately; which means that you will see them correctly rendered even outside of Play mode – which is extremely useful when you are still making changes to your level. Once you have your level structure in place, you can always set the Tilemap Renderer Mode back to Chunk.

因此,最好 在编辑时 将Tilemap渲染器模式设置为“ 个人” 。 它将分别对每个图块进行排序; 这意味着即使在“播放”模式之外,您也可以正确渲染它们-当您仍在更改关卡时,此功能非常有用。 关卡结构到位后,您始终可以将Tilemap Renderer Mode设置回Chunk。

Individual Render Mode is also useful when you want to add objects – such as trees, props, and elevated ground that you wish to sort dynamically with characters, or with each other. During this blog post, we will stick to using Individual Mode for all of our Tilemaps.

当您想添加对象(例如树木,道具和高架地面)时,希望使用角色或彼此进行动态排序,“单独渲染模式”也很有用。 在此博客文章中,我们将坚持对所有Tilemap使用“个人模式”。

使用多个图块 (Using Multiple Tilemaps)

Sometimes, you might want to use more than one Tilemap on the same Grid. In the case of Isometric and Hexagonal Tilemaps, it will be useful if you want to add prop objects to the level that also align with the grid; or if you want to add tiles that appear to be higher than the first layer.

有时,您可能想在同一Grid上使用多个Tilemap。 对于等轴测图和六边形图块贴图,如果要将支撑对象添加到也与网格对齐的水平位置,将很有用。 或者如果您想添加看起来比第一层更高的图块。

To attach another Tilemap to the grid, right-click on the Grid Game Object, and create a new Tilemap of the corresponding type.

要将另一个Tilemap附加到网格,请右键单击Grid Game Object,然后创建一个对应类型的新Tilemap。

In order to switch to painting on the new Tilemap, go back to the Tile Palette window, and change the Active Tilemap just below the main toolbar.

为了切换到新的Tilemap上的绘画,请回到Tile Palette窗口,并更改主工具栏正下方的Active Tilemap。

添加高架区域 (Adding Elevated Areas)

There are generally two ways to go about adding elevated ground to your levels. The one that you will most likely use depends on the type of tilemap you choose to go with. We’ll go over each of the possible cases.

通常,有两种方法可以将高地添加到您的水平。 您最有可能使用的地图取决于您选择使用的图块地图的类型。 我们将研究每种可能的情况。

Additionally, we have prepared a short video on the topic, which demonstrates one of these approaches with a regular Isometric Tilemap; as well as adding collision areas to the tiles. Check it out if you want to have a quick video reference for both of these things:

此外,我们准备了一个有关该主题的简短视频,该视频使用常规的Isometric Tilemap演示了其中一种方法。 以及向瓷砖添加碰撞区域。 如果您想同时获得这两个方面的快速视频参考,请查看以下内容:

演示地址

使用规则的等距图块图 (Using a Regular Isometric Tilemap)

For normal Isometric Tilemaps, you can simply create a new Tilemap under the same Grid; and give it a higher Order in Layer value. You can then change the Tile Anchor setting to make the new layer anchor to a higher point on the grid.

对于普通的等距图块,只需在同一网格下创建一个新的图块即可。 并为其指定更高的“层顺序”值。 然后,您可以更改“平铺锚点”设置,以使新图层锚定到网格上的较高点。

My ground-level Tilemap had a Tile Anchor of (0, 0) for X and Y respectively. I want my new layer to paint one unit higher; so I will change the new Tilemap’s anchor point to (1, 1). Additionally, I will give it an Order in Layer of 1 – just one unit higher than my base level.

我的地面图块贴图的X和Y分别为(0,0)的图块锚点。 我希望我的新图层可以多绘制一个单位; 因此我将新的Tilemap的锚点更改为(1,1)。 此外,我将向其下一层订单-比我的基本水平高一个单位。

I can now change my active Tilemap to the one with the second height level and paint away.

现在,我可以将活动的Tilemap更改为具有第二个高度级别的Tilemap并进行绘制。

使用Z作为Y等距图块 (Using a Z as Y Isometric Tilemap)

Sometimes it can be useful to simulate different heights using the same Tilemap. For this case, you can use a Z as Y Isometric Tilemap and Grid.

有时使用相同的Tilemap模拟不同的高度会很有用。 对于这种情况,可以将Z用作Y等轴测图和网格。

With a Z as Y Tilemap, the Z value of each tile has an additional influence on tile rendering order. We can adjust the Z value that tiles have while we are painting them, using the Z Position setting on our brush in the bottom part of the Tile Palette (which can also be changed using the ‘+’ and ‘-’ hotkeys):

使用Z作为Y Tilemap时,每个图块的Z值都会对图块渲染顺序产生其他影响。 我们可以使用“瓷砖调色板”底部的笔刷上的“ Z位置”设置(也可以使用“ +”和“-”热键进行更改)来调整在绘制瓷砖时所具有的Z值:

However, in order for our Z value to contribute properly and for the tiles to sort correctly, we need to go back to our Custom Axis Sort value and add a Z influence. The number that we use here is directly connected to the way in which Unity converts cell positions on an isometric grid to world space values.

但是,为了使我们的Z值正确起作用并且使图块正确排序,我们需要返回到“自定义轴排序”值并添加Z影响。 我们在此处使用的数字与Unity将等轴测网格上的像元位置转换为世界空间值的方式直接相关。

For example, a grid with XYZ dimensions of (1, 0.5, 1) – the default for isometric – will have a Z-axis sort value of -0.26. If you are curious as to how this number is calculated, or you are using a grid with a different cell size – read on to learn how to find the right Z value for your case.

例如,XYZ尺寸为(1、0.5、1)(等距的默认值)的网格的Z轴排序值为-0.26。 如果您对如何计算此数字感到好奇,或者您正在使用具有不同像元大小的网格,请继续阅读以了解如何为您的案例找到正确的Z值。

Once you have set the correct Custom Axis Sort value, you can start painting tiles that have different Z values. You can also adjust the increments in which the Z value moves the elevated tiles up or down by changing the Grid’s Z dimension – set to 1 by default.

设置正确的“自定义轴排序”值后,就可以开始绘制具有不同Z值的图块。 您还可以通过更改Grid的Z尺寸(默认设置为1)来调整Z值上下移动高架瓷砖的增量。

计算Z值 (Calculating the Z value)

There is a general formula you can use to work out the Z value of your axis sort. First, take the Y dimension of your grid. If you haven’t worked out your Y dimension yet, take a look at the note on importing assets at the top of this blog post. Multiply this value by negative 0.5, and subtract an additional 0.01 from it.

您可以使用一个通用公式来计算轴排序的Z值。 首先,取网格的Y尺寸。 如果尚未确定Y尺寸,请查看此博客文章顶部的有关导入资产的注释。 将该值乘以负0.5,然后再减去0.01。

Following this formula, a grid that has the dimensions (1, 0.5, 1) will give us a Z sorting value of -0.26 (negative point twenty-six). At this axis sort value, any (1, 0.5, 1) grid will have its tiles sorting correctly.

按照此公式,具有尺寸(1、0.5、1)的网格将为我们提供-0.26的Z排序值(负二十六个)。 在此轴排序值下,任何(1、0.5、1)网格都将对其图块进行正确排序。

If you want to find out more about where this value and calculation comes from, take a look at the documentation here. It explains in great depth how 2D renderers work, and what method is used when converting isometric cells into world space values.

如果您想了解更多有关该值和计算值的来源的信息,请查看此处的文档。 它深入解释了2D渲染器的工作原理,以及将等轴测图单元转换为世界空间值时使用的方法。

添加碰撞 (Adding Collision)

Now that we have some tiles placed higher than others, we can control the areas that the player can go to and transition between them using collision.

现在我们已经将一些图块放置在比其他图块高的位置,我们可以控制玩家可以进入的区域并使用碰撞在它们之间过渡。

There are many approaches to adding collision; but in our case, we want the player to ascend and descend along the level using a ramp, and as such, it is not obvious which objects should or shouldn’t have colliders on them. Instead, we can define collision by hand using an additional Tilemap.

增加碰撞的方法很多。 但是在我们的案例中,我们希望玩家使用坡道沿关卡上升和下降,因此,不清楚哪些对象应该或不应该具有对撞器。 相反,我们可以使用附加的Tilemap手动定义碰撞。

In this project, we have created some sprites that correspond to the different shapes that we will use to define our collision areas. We can paint these shapes onto our third Tilemap, in the areas that we do not want the player to pass over. For example, we want the player to be able to ascend to the cliff only using the ramp, rather than walking onto it directly.

在该项目中,我们创建了一些精灵,这些精灵与将用于定义碰撞区域的不同形状相对应。 我们可以将这些形状绘制到我们不希望玩家经过的区域的第三个Tilemap上。 例如,我们希望玩家仅使用坡道就能爬上悬崖,而不是直接走到悬崖上。

We can also add a custom Material in our Tilemap Renderer component in order to tint the tiles a different color that is distinct from the rest of our level.

我们还可以在Tilemap Renderer组件中添加自定义材质,以将图块着色为不同于本关其余部分的其他颜色。

Once we have placed our collision tiles, we can add a Tilemap Collider component to the collision Tilemap. This will auto-generate colliders for each individual tile based on the shape of the sprite.

放置碰撞图块后,我们可以将Tilemap Collider组件添加到碰撞图块中。 这将根据精灵的形状为每个单独的图块自动生成碰撞器。

For better performance, we can also add a Composite Collider 2D component, and make sure to tick Used by Composite on our Tilemap Collider. This unifies all of our individual colliders into one big shape.

为了获得更好的性能,我们还可以添加一个Composite Collider 2D组件,并确保在Tilemap Collider上勾选“由Composite使用”。 这将我们所有的对撞机统一为一个大形状。

添加道具 (Adding Props)

Adding props to the level is quite simple. You can either manually place the prop sprites at any desired point in the scene, or you can attach the props to the Tilemap Grid by making them into individual tiles. You can decide which approach works best for your case.

向该关卡添加道具非常简单。 您可以将道具精灵手动放置在场景中的任意位置,也可以通过将道具分成单独的图块来将其附加到Tilemap Grid。 您可以决定哪种方法最适合您的情况。

In this project, we’ve manually placed some trees around the level. The trees and the character have the same Order in Layer, allowing our character to sort behind and in front of them dynamically.

在此项目中,我们已在关卡周围手动放置了一些树木。 树和角色在图层中具有相同的顺序,使我们的角色可以动态地在它们的后面和前面排序。

We can define the point at which the player can pass the tree by using a collider. There are several ways in which we can do this.

我们可以使用对撞机定义玩家可以越过树的点。 我们有几种方法可以做到这一点。

The first one, as demonstrated in the videos, is to attach a child collider to the object, and change its shape as needed.

如视频所示,第一个是将儿童碰撞器附加到对象上,并根据需要更改其形状。

The other method is to define a Custom Physics Shape for the object within the Sprite Editor.

另一种方法是 在“精灵编辑器”中为对象 定义“ 自定义物理形状 ”。

To open the Sprite Editor, select the object’s sprite and find the Sprite Editor button in the Inspector. In the top-left dropdown, switch to the Custom Physics Shape editor. Here, you are able to create a polygonal shape to define the bounds of your custom collider.

要打开“精灵编辑器”,请选择对象的精灵,然后在检查器中找到“精灵编辑器”按钮。 在左上角的下拉菜单中,切换到“自定义物理形状”编辑器。 在这里,您可以创建多边形来定义自定义对撞机的边界。

Once you have defined a physics shape, you can attach a Polygon Collider component to your object, and it will correspond to that shape.

定义物理形状后,可以将Polygon Collider组件附加到对象上,并且该对象将与该形状相对应。

If you are using your props as tiles on a Tilemap, you could also use a Grid collider. Select the Tile Asset that corresponds to a prop tile (if you need a refresher on where to find it, take a look at the Basic Tilemap Workflow section). You will be able to see a dropdown setting for the Collider Type. By default, it is set to sprite – meaning the auto-generated collider will use the Physics Shape we talked about earlier. If you set it to grid, however, it will always exactly match with the shape of the grid cell that the prop is attached to. It may not be the most accurate way of implementing colliders but could be useful for a specific type of game.

如果将道具用作Tilemap上的图块,则也可以使用Grid Collider。 选择与道具图块相对应的图块资产(如果需要在何处重新学习,请查看“基本图块工作流程”部分)。 您将能够看到Collider Type的下拉设置。 默认情况下,它设置为sprite-这意味着自动生成的对撞机将使用我们之前提到的Physics Shape。 但是,如果将其设置为网格,则它将始终与道具附加到的网格单元的形状完全匹配。 它可能不是实现对撞机的最准确方法,但对于特定类型的游戏可能很有用。

To use the grid colliders for these tiles, select the Tilemap with your props and add a Tilemap Collider component.

要将栅格碰撞器用于这些图块,请选择带有道具的Tilemap并添加一个Tilemap Collider组件。

使用规则图块 (Using Rule Tiles)

Rule Tiles are extremely useful when it comes to automating the tile painting workflow. A Rule Tile acts as a normal tile, with an additional list of tiling parameters. Using these parameters – or rules – the tile can automatically choose which sprite should be painted based on its neighboring tiles.

当涉及到自动化瓷砖绘制工作流程时,Rule Tiles非常有用。 规则图块充当普通图块,并带有附加的切片参数列表。 使用这些参数(或规则),图块可以根据其相邻图块自动选择应该绘制哪个精灵。

Rule Tiles are useful when you want to avoid hand-picking differently rotated tiles – for example, when creating a cliff or platform. They can also be used to randomize between different variations of the same tile to avoid obvious patterns, and even to create animated tiles.

当您要避免手动挑选旋转角度不同的图块时(例如,在创建悬崖或平台时),规则图块非常有用。 它们还可以用于在同一图块的不同变体之间随机化,以避免出现明显的图案,甚至创建动画图块。

Isometric and Hexagonal Rule Tiles are available from Unity’s 2D Extras repository on GitHub. They also contain many other handy assets for the Tilemap feature that you may want to explore.

可从 GitHub上 Unity的 2D Extras存储库 中获得等距和六角规则 图块。 它们还包含您可能要探索的Tilemap功能的许多其他方便资源。

We have also included pre-configured Rule Tiles for each of the different tilesets in our Isometric Starter Kit project. Here are some examples of the tiles included in the project for you to experiment with:

在我们的 Isometric Starter Kit 项目中 ,我们还为每个不同的图块集预先配置了规则图块 。 以下是项目中包含的图块的一些示例,供您尝试:

更进一步 (Taking it further)

Now that you’ve learned the ins and outs of Isometric Tilemaps in Unity, download the Isometric Starter kit project here and try it out yourself! It’s also possible to interact with Tilemaps via script if you are a programmer, so that might be something you want to try as well.

既然您已经了解了Unity中的Isometric Tilemaps的来龙去脉,请在此处下载Isometric Starter kit项目 ,然后自己尝试! 如果您是程序员,也可以通过脚本与Tilemaps进行交互,因此您可能还想尝试一下。

For example, you can find out how you can implement a simple character controller which works with Isometric Tilemap by taking a look at this video:

例如,通过观看以下视频,您可以找到如何实现与Isometric Tilemap一起使用的简单字符控制器的方法:

演示地址

The artwork in this project was created for Unity by @castpixel and you can see more of her work here. If you are looking for additional 2D assets to experiment with using Tilemaps, you can check out the Unity Asset Store as well.

该项目中的艺术品是由 @castpixel 为Unity创建的 ,您可以 在这里 看到她的更多作品 。 如果您正在寻找其他2D资产以使用Tilemaps进行试验,则也可以 签出Unity资产商店

-

Learn best practices using Tilemap with beginner and advanced content on the Unity Learn Premium platform.

在Unity Learn Premium平台 上将Tilemap与 初学者和高级内容 一起学习最佳实践

翻译自: https://blogs.unity3d.com/2019/03/18/isometric-2d-environments-with-tilemap/

tilemap软件使用