我想在我的游戏中(在 SpriteKit 中)创建一个带有按钮和图像的商店，但我需要这些项目是可滚动的，这样玩家就可以在商店上下滚动(像 UITableView 但有多个 SKSpriteNodes 和每个单元格中的 SKLabelNodes)。知道如何在 SpriteKit 中做到这一点吗？

最佳答案

如约而至的第二个答案，我刚刚弄清楚了问题。

我建议始终从我的 gitHub 项目中获取此代码的最新版本，以防我在这个答案后进行了更改，链接位于底部。

第 1 步:创建一个新的 swift 文件并粘贴此代码

import SpriteKit

/// Scroll direction
enum ScrollDirection {
    case vertical // cases start with small letters as I am following Swift 3 guildlines.
    case horizontal
}

class CustomScrollView: UIScrollView {

// MARK: - Static Properties

/// Touches allowed
static var disabledTouches = false

/// Scroll view
private static var scrollView: UIScrollView!

// MARK: - Properties

/// Current scene
private let currentScene: SKScene

/// Moveable node
private let moveableNode: SKNode

/// Scroll direction
private let scrollDirection: ScrollDirection

/// Touched nodes
private var nodesTouched = [AnyObject]()

// MARK: - Init
init(frame: CGRect, scene: SKScene, moveableNode: SKNode) {
    self.currentScene = scene
    self.moveableNode = moveableNode
    self.scrollDirection = scrollDirection
    super.init(frame: frame)

    CustomScrollView.scrollView = self
    self.frame = frame
    delegate = self
    indicatorStyle = .White
    scrollEnabled = true
    userInteractionEnabled = true
    //canCancelContentTouches = false
    //self.minimumZoomScale = 1
    //self.maximumZoomScale = 3

    if scrollDirection == .horizontal {
        let flip = CGAffineTransformMakeScale(-1,-1)
        transform = flip
    }
}

required init?(coder aDecoder: NSCoder) {
    fatalError("init(coder:) has not been implemented")
   }
}

// MARK: - Touches
extension CustomScrollView {

/// Began
override func touchesBegan(touches: Set<UITouch>, withEvent event: UIEvent?) {

    for touch in touches {
        let location = touch.locationInNode(currentScene)

        guard !CustomScrollView.disabledTouches else { return }

        /// Call touches began in current scene
        currentScene.touchesBegan(touches, withEvent: event)

        /// Call touches began in all touched nodes in the current scene
        nodesTouched = currentScene.nodesAtPoint(location)
        for node in nodesTouched {
            node.touchesBegan(touches, withEvent: event)
        }
    }
}

/// Moved
override func touchesMoved(touches: Set<UITouch>, withEvent event: UIEvent?) {

    for touch in touches {
        let location = touch.locationInNode(currentScene)

        guard !CustomScrollView.disabledTouches else { return }

        /// Call touches moved in current scene
        currentScene.touchesMoved(touches, withEvent: event)

        /// Call touches moved in all touched nodes in the current scene
        nodesTouched = currentScene.nodesAtPoint(location)
        for node in nodesTouched {
            node.touchesMoved(touches, withEvent: event)
        }
    }
}

/// Ended
override func touchesEnded(touches: Set<UITouch>, withEvent event: UIEvent?) {

    for touch in touches {
        let location = touch.locationInNode(currentScene)

        guard !CustomScrollView.disabledTouches else { return }

        /// Call touches ended in current scene
        currentScene.touchesEnded(touches, withEvent: event)

        /// Call touches ended in all touched nodes in the current scene
        nodesTouched = currentScene.nodesAtPoint(location)
        for node in nodesTouched {
            node.touchesEnded(touches, withEvent: event)
        }
    }
}

/// Cancelled
override func touchesCancelled(touches: Set<UITouch>?, withEvent event: UIEvent?) {

    for touch in touches! {
        let location = touch.locationInNode(currentScene)

        guard !CustomScrollView.disabledTouches else { return }

        /// Call touches cancelled in current scene
        currentScene.touchesCancelled(touches, withEvent: event)

        /// Call touches cancelled in all touched nodes in the current scene
        nodesTouched = currentScene.nodesAtPoint(location)
        for node in nodesTouched {
            node.touchesCancelled(touches, withEvent: event)
        }
     }
   }
}

// MARK: - Touch Controls
extension CustomScrollView {

     /// Disable
    class func disable() {
        CustomScrollView.scrollView?.userInteractionEnabled = false
        CustomScrollView.disabledTouches = true
    }

    /// Enable
    class func enable() {
        CustomScrollView.scrollView?.userInteractionEnabled = true
        CustomScrollView.disabledTouches = false
    }
}

// MARK: - Delegates
extension CustomScrollView: UIScrollViewDelegate {

    func scrollViewDidScroll(scrollView: UIScrollView) {

        if scrollDirection == .horizontal {
            moveableNode.position.x = scrollView.contentOffset.x
        } else {
            moveableNode.position.y = scrollView.contentOffset.y
        }
    }
}

这创建了 UIScrollView 的子类并设置了它的基本属性。它有自己的 touches 方法，可以传递给相关场景。

第 2 步:在您想要使用它的相关场景中，您创建一个 ScrollView 和可移动节点属性，如下所示

weak var scrollView: CustomScrollView!
let moveableNode = SKNode()

并在 didMoveToView 中将它们添加到场景中

scrollView = CustomScrollView(frame: CGRect(x: 0, y: 0, width: self.frame.size.width, height: self.frame.size.height), scene: self, moveableNode: moveableNode, scrollDirection: .vertical)
scrollView.contentSize = CGSizeMake(self.frame.size.width, self.frame.size.height * 2)
view?.addSubview(scrollView) 


addChild(moveableNode)

您在第 1 行中所做的是使用场景尺寸初始化 ScrollView 助手。您还传递场景以供引用和您在步骤 2 中创建的 moveableNode。 第 2 行是设置 scrollView 内容大小的地方，在本例中它是屏幕高度的两倍。

第 3 步:- 添加标签或节点等并定位它们。

label1.position.y = CGRectGetMidY(self.frame) - self.frame.size.height
moveableNode.addChild(label1)

在此示例中，标签将位于 ScrollView 的第二页上。这是您必须使用标签和定位的地方。

我建议，如果你在 ScrollView 中有很多页面，并且有很多标签，那么做下面的事情。为 ScrollView 中的每个页面创建一个 SKSpriteNode，并使每个页面的大小与屏幕相同。将它们称为 page1Node、page2Node 等。您可以将第二页上的所有标签添加到 page2Node。这里的好处是您基本上可以像往常一样将所有内容放置在 page2Node 中，而不仅仅是将 page2Node 放置在 ScrollView 中。

你也很幸运，因为垂直使用 ScrollView (你说你想要的)你不需要做任何翻转和反向定位。

我做了一些类函数，所以如果你需要禁用你的 ScrollView ，因为你在 ScrollView 上覆盖了另一个菜单。

CustomScrollView.enable()
CustomScrollView.disable()

最后不要忘记在转换到新场景之前从场景中删除 ScrollView 。在 spritekit 中处理 UIKit 时的痛点之一。

scrollView?.removeFromSuperView()

对于水平滚动，只需将 init 方法中的滚动方向更改为 .horizo​​ntal(第 2 步)。

现在最大的痛苦是定位东西时一切都是相反的。所以 ScrollView 从右到左。因此，您需要使用 scrollView 的“contentOffset”方法来重新定位它，基本上以从右到左的相反顺序放置所有标签。一旦您了解发生了什么，再次使用 SkNodes 会让这一切变得容易得多。

希望这对大量帖子有所帮助并感到抱歉，但正如我所说，这在 spritekit 中有点痛苦。如果我遗漏了什么，请告诉我进展情况。

项目在gitHub上

https://github.com/crashoverride777/SwiftySKScrollView

关于swift - 如何在 spritekit 中创建垂直滚动菜单？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/34229839/