按键精灵 识别图片形状_精灵形状的2D世界建筑物简介

按键精灵 识别图片形状

Sprite Shape gives you the freedom to create rich free-form 2D environments straight in Unity and decorate them as you see fit, with a visual and intuitive workflow. The tool works by dynamically tiling sprites along spline paths based on a given set of angle ranges. Read on to learn how you can work with Sprite Shape, get colliders for your shapes, and use a little bit of scripting to build on top of the features’ functionality.

Sprite Shape使您可以自由地在Unity中直接创建丰富的自由格式2D环境，并通过可视和直观的工作流程随意装饰它们。 该工具通过根据一组给定的角度范围沿样条曲线路径动态平铺精灵来工作。 继续阅读以了解如何使用Sprite Shape，如何为形状获取碰撞器，并使用一些脚本来构建功能的基础。

Sprite Shape is still in preview, with a production release planned at a later date. That means that the workflow and the coding API described in this article may change in the future. However, that doesn’t stop you from trying it now!

Sprite Shape仍在预览中，计划在以后发布产品。 这意味着本文中描述的工作流程和编码API将来可能会更改。 但是，这并不能阻止您立即尝试！

安装精灵形状 (Installing Sprite Shape)

If you’re using Unity 2018.1 or newer, you can get Sprite Shape for your project by using the Package Manager.

如果您使用的是Unity 2018.1或更高版本，则可以使用Package Manager为项目获取Sprite Shape。

Go to Window > Package Manager, then select the All tab. From there, you’ll be able to find the 2D Sprite Shape package and add it to your project.

转到窗口>软件包管理器 ，然后选择全部标签。 从那里，您将能够找到2D Sprite Shape包并将其添加到您的项目中。

创建形状 (Creating a Shape)

精灵形状轮廓 (The Sprite Shape Profile)

Sprite Shape works by tiling sprites along spline paths created in the scene as game objects. However, to start creating paths, we must first set up an asset called the Sprite Shape Profile. It is used to define and store information about a particular type of shape. Within this asset, we assign the sprites we wish to use and tell Sprite Shape how they should be rendered. For example, we can configure which sprites are to be displayed based on the direction a part of our shape is facing, whether the shape has a fill texture, and so on.

Sprite Shape通过沿场景中创建的作为游戏对象的样条路径平铺精灵来工作。 但是，要开始创建路径，我们必须首先设置一个名为Sprite Shape Profile的资源。 它用于定义和存储有关特定形状的信息。 在此资源中，我们分配希望使用的精灵，并告诉Sprite Shape应该如何渲染。 例如，我们可以根据形状的一部分面向的方向，形状是否具有填充纹理等来配置要显示哪些精灵。

Let’s create a profile right now! To do so, right-click in the Assets window of your project and go to Create > Sprite Shape Profile. You will see that there are three types of Profiles available to you: Empty, Strip, and Shape. The only difference between these profiles is the number of pre-set angle ranges they come with. Let’s start by making a Strip profile – we’ll get to angle ranges in a second.

让我们现在创建一个配置文件！ 为此，在项目的Assets窗口中右键单击，然后转到Create> Sprite Shape Profile 。 您将看到有三种可用的轮廓： Empty，Strip和Shape 。 这些轮廓之间的唯一区别是它们附带的预设角度范围的数量。 让我们从制作Strip轮廓开始-我们将在一秒钟内达到角度范围。

We can now edit our Profile in the Inspector window. If you take a look at the Angle Ranges circle, you notice that it’s completely filled, meaning that it has one pre-defined angle range. An angle range determines which sprites are rendered along the path when your curve is facing that particular direction. Having one angle range that covers the full circle means that the same sprites will be displayed at all times.

现在，我们可以在“检查器”窗口中编辑配置文件。 如果查看“角度范围”圆，您会注意到它已完全填充，这意味着它具有一个预定义的角度范围。 角度范围确定当曲线面向特定方向时沿路径渲染哪些精灵。 具有一个覆盖整个圆的角度范围意味着将始终显示相同的精灵。

Under Sprites in the Inspector window, we can add or delete new sprites to the Angle Range by using the ‘+’ and ‘-’ buttons below. Let’s go ahead and add our first sprite to this shape!  For this and all future examples, I’m going to be using sprites available for free from our 2D Game Kit.

在“检查器”窗口中的“精灵”下，我们可以使用下面的“ +”和“-”按钮在“角度范围”中添加或删除新的精灵。 让我们继续，将我们的第一个精灵添加到该形状中！ 对于此示例以及所有以后的示例，我将使用2D游戏工具包中免费提供的精灵。

雪碧形状游戏对象 (The Sprite Shape Game Object)

Now that we have a profile set up, we can start creating shapes from it. To automatically use the profile in our new shape, make sure you have the profile selected in the Assets window; then right-click in the Hierarchy window and go to 2D Object > Sprite Shape.

现在我们已经设置了轮廓，我们可以开始从中创建形状。 要以我们的新形状自动使用配置文件，请确保在“资产”窗口中选择了配置文件； 然后在“层次结构”窗口中右键单击，然后转到2D对象>精灵形状 。

Note: if you’ve accidentally created an empty Sprite Shape or you would like to use a different profile, you can assign or change it within the Sprite Shape Controller component:

注意：如果您不小心创建了空的Sprite Shape或想要使用其他配置文件，则可以在Sprite Shape Controller组件中进行分配或更改：

The other component of the game object is the Sprite Shape Renderer, which acts similarly to a regular Sprite Renderer, allowing you to change the material, color, and layer order of the sprite.

游戏对象的另一个组件是Sprite Shape Renderer，其作用类似于常规的Sprite Renderer，允许您更改Sprite的材质，颜色和层顺序。

编辑样条线 (Editing the spline)

You can now start editing your shape by clicking Edit Spline in the Sprite Shape Controller options. Once you’ve got that enabled, within your scene you will be able to rearrange, add, and delete nodes on your spline. To add a new node, simply left-click anywhere on the spline. To delete a node, select it and press Delete.

现在，您可以通过单击Sprite Shape Controller选项中的Edit Spline开始编辑形状。 启用该功能后，您就可以在场景中重新排列，添加和删除样条线上的节点。 要添加新节点，只需在样条线上的任意位置单击鼠标左键。 要删除节点，请选择它，然后按Delete键。

Let’s talk a little bit about Point Modes available in the Sprite Shape Controller. Currently, we are in Linear point mode. This means that no curve is formed through our node. However, if we switch to one of the other two modes, such as the Mirrored mode, with a node selected, we will see that the node now has two tangents, and when we move them around, we can change the shape of the Bezier curve:

让我们来谈谈Sprite Shape Controller中可用的点模式。 目前，我们处于线性点模式。 这意味着没有曲线通过我们的节点形成。 但是，如果切换到其他两种模式之一(例如“镜像”模式)并选择了一个节点，我们将看到该节点现在具有两个切线，并且在四处移动它们时，我们可以更改Bezier的形状曲线：

The last mode is called Non-Mirrored mode. Enabling it unlinks the two tangents from each other, allowing you to adjust one at a time without affecting the other.

最后一种模式称为非镜像模式。 启用它可以使两个切线彼此取消链接，从而允许您一次调整一个切线而不影响另一个。

使用精灵编辑器 (Using the Sprite Editor)

Sometimes our sprites will need to be manually adjusted if we want them to be tiled in a particular way. In the examples above, you can see that since we are using a bridge sprite, we’re getting a shape that consists of bridge segments. What if we wanted to make it look like one long bridge strip instead?

有时，如果我们希望以特定方式平铺精灵，则需要手动调整它们。 在上面的示例中，您可以看到，由于我们使用的是桥精灵，因此我们得到的形状由桥段组成。 如果我们想使它看起来像一个长的桥条怎么办？

Fear not! The Sprite Editor is here to help. This blog post will not cover it in depth, but there is an excellent video tutorial on it on Unity’s YouTube channel. That said, knowing about certain parts of the Sprite Editor will allow you to use Sprite Shape more efficiently, and adjust sprites to suit your needs with ease.

不要怕！ Sprite编辑器在这里为您提供帮助。 这篇博客文章不会深入介绍它，但是Unity的YouTube频道上有一个很棒的视频教程 。 就是说，了解Sprite Editor的某些部分将使您能够更有效地使用Sprite Shape，并轻松调整Sprite以适应您的需求。

Let’s edit our bridge sprite! With it selected, in the Inspector window, you will be able to find the Sprite Editor button. Click it, and the Sprite Editor window will be brought up.

让我们编辑桥精灵！ 选中它，在“检查器”窗口中，您将能够找到“精灵编辑器”按钮。 单击它，将显示“ 精灵编辑器”窗口。

The main things of interest to us about the sprite editor will be the four green control points around the sprite, as well as the border settings in the Sprite window at the bottom right. By using borders, we can tell Sprite Shape which part of the shape we want to be tiled, and which parts we want to act as our border sprites – which will only be rendered at the start and end nodes of our path, or at angled corners. We can adjust our bridge sprite’s left and right borders to make sure only the middle section of the bridge is tiled.

关于精灵编辑器，我们感兴趣的主要内容是精灵周围的四个绿色控制点，以及右下方“精灵”窗口中的边框设置。 通过使用边界，我们可以告诉Sprite Shape我们要平铺形状的哪个部分，以及我们要用作边界sprite的哪些部分–仅在路径的起点和终点或成角度地呈现角落。 我们可以调整桥精灵的左右边界，以确保仅对桥的中间部分进行平铺。

One other setting that can be of use is the Pivot point of the sprite. The Pivot determines how the sprite is rendered relative to the spline. Currently, our bridge sprite has a pivot in the center, which makes the spline pass it right in the middle. If we set it to be at the top of the bridge, the sprite will render below the spline. This can be useful for adjusting the relative position of auto-generated colliders for your shape which we’ll cover in a bit, as well as for more precision when using Sprite Shape to decorate an environment.

可以使用的另一种设置是精灵的枢轴点。 枢轴确定如何相对于样条线渲染精灵。 目前，我们的桥精灵在中心具有一个枢轴，这使该样条曲线从中间穿过。 如果将其设置在桥的顶部，则精灵将在样条线下方渲染。 这对于调整将自动覆盖的形状的自动碰撞器的相对位置很有用，我们将稍作介绍，并在使用Sprite Shape装饰环境时提高精度。

精灵变化 (Sprite Variations)

On the note of decorating environments, Sprite Shape also allows you to assign more than one sprite per angle range, and switch between them on your shape. This can be used for adding visual variety to your shapes, or in creating prop and decoration ‘brushes’.

关于装饰环境，“精灵形状”还允许您为每个角度范围分配一个以上的精灵，并在形状上在它们之间切换。 这可用于为形状增加视觉效果，或用于创建道具和装饰“画笔”。

I’ve prepared a simple hanging moss profile with two sprites assigned to a single angle range. I can use this profile to add decorative moss to one of the other shapes in my scene.

我准备了一个简单的悬挂式苔藓轮廓，其中两个精灵分配了一个角度范围。 我可以使用此配置文件将装饰性