ios - Swift Sprite 工具包垂直背景无限图像

Question

我有 3 张图片:

topBg.png midBg.png botBg.png

我想在顶部场景设置topBg.png 高度= 200

middleBg.png 应无限缩放或垂直重复

botBg.png - 应该在底部并且高度 = 200

我有下一个代码:

override func didMove(to view: SKView) {
        self.bgTopSpriteNode = self.childNode(withName: "//bgTopNode") as? SKSpriteNode
        self.bgMiddleSpriteNode = self.childNode(withName: "//bgMiddleNode") as? SKSpriteNode
        self.bgBottomSpriteNode = self.childNode(withName: "//bgBottomNode") as? SKSpriteNode

        if let bgTopSpriteNode = self.bgTopSpriteNode,
            let bgMiddleSpriteNode = self.bgMiddleSpriteNode,
            let bgBottomSpriteNode = self.bgBottomSpriteNode {



            bgTopSpriteNode.size.width = self.frame.width
            bgTopSpriteNode.size.height = 200
            bgTopSpriteNode.position.x = 0

            bgMiddleSpriteNode.size.width = self.frame.width
            bgMiddleSpriteNode.size.height = self.frame.height-400
            bgMiddleSpriteNode.position.x = 0

            bgBottomSpriteNode.size.width = self.frame.width
            bgBottomSpriteNode.size.height = 200
            bgBottomSpriteNode.position.x = 0
        }

    }

但是如何设置图片的Y位置。因为坐标从屏幕中心开始，而不是从左上角开始，我不知道如何转换它们。

Answer 1

有几种不同的方法可以实现您的目标。

• 首先，如果场景的 anchor 位于 (0.5,0.5)，则可以使用简单的 size.height/2 计算屏幕顶部和底部的 y 位置。 (不要使用框架 - 使用大小。这样，您就可以考虑场景的 scaleMode。)

• 听起来您对场景的原点位于中心感到沮丧。如果您想将它移到角落，您可以通过将场景的 anchorPoint 属性设置为 (0.0, 0.0) 来轻松实现，例如左下角。然后，您的 y 值为 0 和 size.height。如果您使用的是 .sks 编辑器，它会显示在界面中 - 您可以在那里设置它。否则，您可以通过编程方式设置它。

• 最后，您可以将场景的 scaleMode 设置为 .aspectFill 之类的东西，直接设置场景的大小(例如，对于 iPad，设置为 1024x768)，然后将图像放在需要的位置。如果您正在使用 .sks 文件，这种方法特别适用；加载场景时，可以根据场景所在 View 的纵横比设置场景的大小，以适应不同的纵横比。例如，您可以为 iPhone 场景采用 320x480“引用尺寸”。每当您加载场景时，您都可以将场景的大小设置为 320 点宽和任意高的点以匹配设备的纵横比。然后，您的所有图形都将以 320pt 宽生成，您可以在场景大小上按比例向上或向下滑动它们以进行布局。这有点复杂，但比尝试处理多个设备的单独布局注意事项要容易得多。

我还应该指出几件事。

• 您可以使用 sprite 的 anchorPoint 属性来指定从何处测量 sprite 的坐标。这对于您希望图像与某物齐平的情况非常方便。例如，如果你想要一个图像与屏幕的左侧齐平，将它的位置设置为恰好在屏幕的左侧，然后将它的 anchorPoint.x 设置为 0.0；这会将 Sprite 的左边缘放在屏幕的左边缘。这也适用于场景，正如您遇到的那样 - 移动场景的 anchor 会移动场景中相对于其大小的所有内容。

• 您所描述的内容不需要三张图片。您可以使用单个 Sprite 并设置其 centerRect 属性以告诉它使用图像的顶部和底部并垂直拉伸(stretch)中心部分。您必须做一些数学运算才能设置正确的 xScale 和 yScale(不是宽度和高度，IIRC)，但是您可以用一个 Sprite 而不是三个来绘制所有这些。这在您的情况下非常方便，因为您可以将 Sprite 留在 (0,0)，将其比例设置为与整个场景的大小相匹配，然后设置 centerRect 属性 - 您不必进行任何定位数学。