在菜单按钮之前和之间留出相等宽度的间隙间距

时间:2017-05-06 07:11:14

标签: swift swift3 sprite-kit

我使用下面的代码创建了一个滚动菜单。我试图在每个菜单精灵按钮之间创建相等的行间隙(宽度间距)。目前,我已经能够在左右两端留下相等的宽度间距,但不能在精灵按钮之间。请参阅以下相关代码:

class LevelScene: SKScene {

let levelButtonSize = SKSpriteNode(imageNamed: "b1").size
let levelButton1: SKSpriteNode = SKSpriteNode(imageNamed: "b1")

let levelButton2: SKSpriteNode = SKSpriteNode(imageNamed: "b2")
let levelButton3: SKSpriteNode = SKSpriteNode(imageNamed: "b3")
let levelButton4: SKSpriteNode = SKSpriteNode(imageNamed: "b4")
let levelButton5: SKSpriteNode = SKSpriteNode(imageNamed: "b5")
let levelButton6: SKSpriteNode = SKSpriteNode(imageNamed: "b6")
let levelButton7: SKSpriteNode = SKSpriteNode(imageNamed: "b7")
let levelButton8: SKSpriteNode = SKSpriteNode(imageNamed: "b8")

let levelButton9: SKSpriteNode = SKSpriteNode(imageNamed: "b9")
let levelButton10: SKSpriteNode = SKSpriteNode(imageNamed: "b10")
let levelButton11: SKSpriteNode = SKSpriteNode(imageNamed: "b11")
let levelButton12: SKSpriteNode = SKSpriteNode(imageNamed: "b12")

let levelButton13: SKSpriteNode = SKSpriteNode(imageNamed: "b13")
let levelButton14: SKSpriteNode = SKSpriteNode(imageNamed: "b14")
let levelButton15: SKSpriteNode = SKSpriteNode(imageNamed: "b15")
let levelButton16: SKSpriteNode = SKSpriteNode(imageNamed: "b16")
let levelButton17: SKSpriteNode = SKSpriteNode(imageNamed: "b17")
let levelButton18: SKSpriteNode = SKSpriteNode(imageNamed: "b18")


private var scrollCell = SKSpriteNode()

private var moveAmtX: CGFloat = 0
private var moveAmtY: CGFloat = 0
private let minimum_detect_distance: CGFloat = 30
private var initialPosition: CGPoint = CGPoint.zero
private var initialTouch: CGPoint = CGPoint.zero
private var resettingSlider = false

override init(size: CGSize){
  super.init(size: size)

     createMenu()
}

func createMenu() {

    let buttons = [levelButton1, levelButton2, levelButton3, levelButton4, levelButton5, levelButton6, levelButton7, levelButton8, levelButton9, levelButton10, levelButton11, levelButton12, levelButton13, levelButton14, levelButton15, levelButton16, levelButton17, levelButton18]

    for i in 1..<buttons.count  {
        buttons[i-1].name = "level\(i)"
    }

    let padding: CGFloat = 50
    let numberOfRows = CGFloat(buttons.count / 3)

    scrollCell = SKSpriteNode(color: .blue, size: CGSize(width: self.size.width, height: levelButtonSize.height * numberOfRows + padding * numberOfRows))
    scrollCell.position = CGPoint(x: 0 - self.size.width / 2, y: 0 - (scrollCell.size.height - self.size.height / 2))
    scrollCell.anchorPoint = CGPoint.zero
    scrollCell.zPosition = 0
    self.addChild(scrollCell)

    //        let backgroundImage = SKSpriteNode(imageNamed: "bg")
    //        backgroundImage.position = CGPoint(x: self.frame.midX, y: self.frame.midY)
    //        self.addChild(backgroundImage)

    let totalMarginX = self.frame.width - 3*levelButtonSize.width
    let marginX = totalMarginX/4

    let column1PosX = marginX + levelButtonSize.width/2
    let column2PosX = 2*marginX + 3*levelButtonSize.width/2
    let column3PosX = 3*marginX + 5*levelButtonSize.width/2

    print("levelButtonSize.width is \(levelButtonSize.width)")
    print("self.frame.width is \(self.frame.width)")
    print("marginX is \(marginX)")
    print("column1PosX is \(column1PosX)")
    print("column2PosX is \(column2PosX)")
    print("column3PosX is \(column3PosX)")

    var colCount = 0
    var rowCount = 0

    for button in buttons {

        var posX: CGFloat = column2PosX
        if colCount == 0 {
            posX =  column1PosX
        }
        if colCount == 1 {
            posX =  column2PosX
        }

        else if colCount == 2 {
            posX =  column3PosX
            colCount = -1
        }


        let indexOffset = CGFloat(rowCount) * (levelButtonSize.height + padding)
        let posY = scrollCell.size.height - levelButtonSize.height / 2 - (indexOffset + padding / 2)
        button.position = CGPoint(x: posX, y: posY)
        //button.setScale(0.5)
        button.zPosition = 10
        scrollCell.addChild(button)

        if colCount == -1 {
            rowCount += 1
        }
        colCount += 1
    }
}


override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {

    if let touch = touches.first as UITouch! {

        self.scrollCell.removeAllActions()
        initialTouch = touch.location(in: self.scene!.view)
        moveAmtY = 0
        initialPosition = self.scrollCell.position
    }
}


override func touchesMoved(_ touches: Set<UITouch>, with event: UIEvent?) {

    if let touch = touches.first as UITouch! {

        let movingPoint: CGPoint = touch.location(in: self.scene!.view)

        moveAmtX = movingPoint.x - initialTouch.x

        let topPos: CGFloat = scrollCell.size.height - self.size.height / 2
        let bottomPos = 0 - (self.size.height / 2)

        if (initialPosition.y - (movingPoint.y - initialTouch.y)) < -topPos {
            print("stop on top")
            moveAmtY = 0
            scrollCell.position.y = -topPos
        }
        else if (initialPosition.y - (movingPoint.y - initialTouch.y)) > bottomPos {
            print("stop on bottom")
            moveAmtY = 0
            scrollCell.position.y = bottomPos

        }
        else {
            moveAmtY = movingPoint.y - initialTouch.y
            scrollCell.position = CGPoint(x: initialPosition.x, y: initialPosition.y - moveAmtY)
        }
    }
}

override func touchesEnded(_ touches: Set<UITouch>, with event: UIEvent?) {
}

func checkForResettingSlider() {

    let topPos: CGFloat = scrollCell.size.height - self.size.height / 2
    let bottomPos = 0 - (self.size.height / 2)

    if scrollCell.position.y > bottomPos {

        let move = SKAction.moveTo(y: bottomPos, duration: 0.3)
        move.timingMode = .easeOut
        scrollCell.run(move)
    }

    if scrollCell.position.y < -topPos {

        let move = SKAction.moveTo(y: -topPos, duration: 0.3)
        move.timingMode = .easeOut
        scrollCell.run(move)
    }
}

func yMoveActions(moveTo: CGFloat) {

    let move = SKAction.moveBy(x: 0, y: (moveTo * 1.5), duration: 0.3)
    move.timingMode = .easeOut

    self.scrollCell.run(move, completion: { self.checkForResettingSlider() })
}

请注意我按以下方式设置场景:

 let levelScene = LevelScene(size: CGSize(width:480, height:640))
 levelScene.anchorPoint = CGPoint(x: 0.5, y: 0.5)
 levelScene.scaleMode = .aspectFill
 skView?.presentScene(levelScene)

修改

下图显示了我的关卡菜单的一部分,与侧边相比,关卡按钮之间的空间更大。我想在按钮之间以及两侧获得相同的宽度间隙。

enter image description here

1 个答案:

答案 0 :(得分:0)

我建议:

let scaledWidth = levelButtonSize.width/2;
let totalMarginX = self.frame.width - 3*scaledWidth 
let marginX = totalMarginX/4 

let column1PosX = marginX + scaledWidth/2 
let column2PosX = 2*marginX + 3*scaledWidth/2 
let column3PosX = 3*marginX + 5*scaledWidth/2