精灵套件 - 绘制带有多色边框的圆圈

Question

我想绘制一个类似于此的圆圈：

我将让不同的物体与圆相互作用（碰撞），但物体会根据触摸的颜色进行不同的交互。

这可以使用bezier路径完成吗？我希望将圆圈的每种颜色设置为不同的变量。

我最初的想法是在Photoshop中绘制圆圈并将其导入Sprite Kit但我不知道如何将这些颜色分成不同的变量。

Answer 1

将对象作为png（来自photoshop或其他）导入游戏中，当节点与其发生碰撞时，检测其接触的点并计算距离圆心的x和y的差异。即使圆圈在旋转，这也应该总是告诉你碰撞物体击中的颜色，只要你将颜色映射到＆＃34;区域＆＃34;已经。有意义吗？

或者，您可以创建一个透明圆（SKShapeNode）并将八个SKShapeNode弧作为该透明圆的子项。故意定位他们。这增加了每个将成为单独对象的好处，可以拥有自己的strokeColor，以及它自己的触摸方法。它们需要是可碰撞的，而父透明圆圈需要忽略碰撞才能发挥作用。

至于如何检测圆圈的哪个部分被击中，我将采用以下方式：

给定一个被分成8个大小相同的饼块的圆圈，您应该能够根据与圆心相比的碰撞点的x和y值来确定哪个部分接收到了碰撞。例如，假设Y轴是每个四个部分的两半之间的划分（见图），您可以先按象限缩小碰撞范围，如下所示：

cx，cy =碰撞x和y值 ox，oy =圆的正中心（原点）的x和y值

伪代码：

if cx > ox && cy > oy, then the collision occurred in quadrant 1
if cx > ox && cy < oy, then the collision occurred in quadrant 2
if cx < ox && cy < oy, then the collision occurred in quadrant 3
if cx < ox && cy > oy, then the collision occurred in quadrant 4

由于每个象限中有两个部分，您可以进一步细化此逻辑，通过比较差异来确定碰撞发生的两个部分

伪代码：

if the difference between cx and ox > the difference between cy and oy, then the collision occurred in Section 2
else the collision occurred in section 1

将这些逻辑组合到一个嵌套的if-else语句中，您将拥有以下内容：

伪代码：

if cx > ox && cy > oy, then the collision occurred in quadrant 1
......if the difference between cx and ox > the difference between cy and oy, then the collision occurred in Section 2
......else the collision occurred in section 1
if cx > ox && cy < oy, then the collision occurred in quadrant 2
......if the difference between cx and ox > the difference between cy and oy, then the collision occurred in Section 3
......else the collision occurred in section 4
if cx < ox && cy < oy, then the collision occurred in quadrant 3
......if the difference between cx and ox > the difference between cy and oy, then the collision occurred in Section 6
......else the collision occurred in section 5
if cx < ox && cy > oy, then the collision occurred in quadrant 4
......if the difference between cx and ox > the difference between cy and oy, then the collision occurred in Section 7
......else the collision occurred in section 8

HTH！