根據屏幕大小更改節點位置Swift / Sprite Kit

Question

我想根據屏幕尺寸更改節點的位置。 例如，當我在iPhone 4s上運行我的應用程序時，並非所有節點都適合屏幕，因為我在開發應用程序時就考慮了iPhone 6尺寸。 如何使節點根據運行的設備重新定位？ 我知道我通常可以通過約束來實現，但是我不知道如何在Sprite Kit中做到這一點。 我包括下面的屏幕快照。

    lblRocketCount.position = CGPoint(x: 100, y: 150)
    lblRocketCount.text = "Bullets: 30"
    self.addChild(lblRocketCount)

    lblMissileCount.position = CGPoint(x: -100, y: 150)
    lblMissileCount.text = "Missiles: 5"
    self.addChild(lblMissileCount)


    leftBorder.position = CGPoint(x: -333, y: 0)
    self.addChild(leftBorder)

    rightBorder.position = CGPoint(x: 333, y: 0)
    self.addChild(rightBorder)

    topBorder.position = CGPoint(x: 0, y: 187)
    self.addChild(topBorder)

    bottomBorder.position = CGPoint(x: 0, y: -187)
    self.addChild(bottomBorder)

    buttonDirUp.position = CGPoint(x: -200, y: -50)
    buttonDirUp.setScale(2.0)
    self.addChild(buttonDirUp)

    ship.setScale(0.33)
    shootButton.setScale(0.7)
    missileButton.setScale(0.5)


    buttonDirLeft.position = CGPoint(x: -250, y: -100)
    buttonDirLeft.setScale(2.0)
    self.addChild(buttonDirLeft)

    buttonDirDown.position = CGPoint(x: -200, y: -150)
    buttonDirDown.setScale(2.0)
    self.addChild(buttonDirDown)

    buttonDirRight.position = CGPoint(x: -150, y: -100)
    buttonDirRight.setScale(2.0)
    self.addChild(buttonDirRight)

    self.view?.multipleTouchEnabled = true

    self.backgroundColor = SKColor.blackColor()

    self.anchorPoint = CGPointMake(0.5, 0.5)

    self.addChild(base)
    base.position = CGPointMake(200, -100)

    self.addChild(ball)
    ball.position = base.position

    self.addChild(ship)
    ship.position = CGPoint(x: self.frame.midX, y: self.frame.midY)

    self.addChild(shootButton)
    shootButton.position = CGPoint(x: self.frame.midX, y: -100)

    self.addChild(missileButton)
    missileButton.position = CGPoint(x: -200, y: 50)

屏幕截圖

Answer 1

我發現這項技術可以有效應對多種分辨率。 您需要在GameViewController中創建兩個全局變量，以反映當前視圖的大小：

import SpriteKit


// global variables
var SKViewSize: CGSize?
var SKViewSizeRect: CGRect?


class GameViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()

        let skView = self.view as! SKView
        SKViewSize = skView.bounds.size
        let scene = GameScene(size: SKViewSize!)

        scene.scaleMode = .AspectFill
        skView.presentScene(scene)
        SKViewSizeRect = getViewSizeRect()
    }

    override func viewDidLayoutSubviews() {
        super.viewDidLayoutSubviews()
        SKViewSize = self.view.bounds.size
        SKViewSizeRect = getViewSizeRect()

        let skView = self.view as! SKView
        if let scene = skView.scene {
            if scene.size != self.view.bounds.size {
                scene.size = self.view.bounds.size
            }
        }
    }

    func getViewSizeRect() -> CGRect {
        return CGRect(x: ((SKViewSize!.width  * 0.5) * -1.0), y: ((SKViewSize!.height * 0.5) * -1.0), width: SKViewSize!.width, height: SKViewSize!.height)
    }
}

然后為所有SKNode類型創建一個擴展名，該擴展名允許您使用當前屏幕尺寸的百分比來定位它們：

public extension SKNode {

    public func posByScreen(x: CGFloat, y: CGFloat) {
        self.position = CGPoint(x: CGFloat((SKViewSizeRect!.width * x) + SKViewSizeRect!.origin.x), y: CGFloat((SKViewSizeRect!.height * y) + SKViewSizeRect!.origin.y))
    }
}

例如，要創建一個精靈節點並將其居中放置在任何屏幕尺寸上，可以在GameScene使用它：

let sprite = SKSpriteNode(color: SKColor.whiteColor(), size: CGSizeMake(32, 32))
addChild(sprite)
sprite.posByScreen(0.5, y: 0.5)

Answer 2

對於要尋找的內容沒有簡單的答案，您首先需要確定游戲在不同寬高比下的外觀，然后進行規划。 在很多情況下，您只想給16：9手機更多的FOV（他們可以看到更多游戲世界）。 為此，將游戲設計為2個層：一個游戲層和一個hud疊加層。

游戲層將利用.AspectFill來使您的游戲在各種設備上保持相同的“大小”，而iPhone 4s的人們將失去在其上和下查看某些屏幕的能力（您可以通過移動來調整他們丟失某些屏幕的位置游戲層節點位置）

HUD覆蓋層將處理需要保持在屏幕上固定位置的事物，例如按鈕和救生圈。 現在，您可以像某些人提到的那樣使用基於％的坐標，或者您可以保留絕對坐標，並且如果您的游戲檢測到3：2（或者如果您願意，則為4：3），只需從疊加節點中減去像素差即可。 iPad）比例

基本原理：（請勿復制verbatum）

假設我們創建了一個160x284點的游戲場景

這意味着在iPhone 4s上，我們的分辨率為320x480，縱橫比填充將采用頂部/底部或左側/右側之間最小的距離進行縮放。 在我們的案例中，160將縮放到320，284將縮放到568。呃，iphone只有480，所以您損失了88像素，這意味着在游戲世界中我們損失了44點。

//這意味着頂部和底部將分別輸掉22點，所以讓我們的iphone4s填充

class GameScene
{
  let gameNode = SKNode();
  let overlayNode = SKNode();
  let iPhone4sPadding = 22;
  func init()
  {
     //add all of the games nodes that you would add to the scene to gameNode instead
      self.addChild(gameNode);

     //add all of your overlay nodes (buttons, lifebars, etc) to the overlayNode

     //do a check on uiscreen to see if the height is 480, if it is
     //  all nodes on the bottom add iphone4spadding to the y
     //  all nodes on the top subtract iphone4spadding from the y
     self.addChild(overlayNode);

  }
}