美文网首页iOS-swiftiOS Developer
SpriteKit之使用精灵SKSpriteNode

SpriteKit之使用精灵SKSpriteNode

作者: 狂奔的胖蜗牛 | 来源:发表于2017-02-05 13:31 被阅读1296次

精灵是创建场景内容的基石,用SKSpriteNode表示。美工创建好图像,游戏内加载图像作为纹理,然后使用纹理创建精灵并添加到场景中。

本文使用的是Xcode8.0,语言是Swift3.0。

1 创建精灵

最简单的利用图片创建精灵方式:

let ship = SKSpriteNode(imageNamed: "Spaceship")
ship.position = view!.center
addChild(ship)

如下:

屏幕快照 2017-02-05 上午11.26.27.png

这种方式创建的精灵,有很多默认的行为:

  • 精灵的尺寸和图片的size相同
  • 精灵以图片的中心位置来渲染
  • 精灵在帧缓冲区中是半透明的
  • 一个SKTexture对象被创建并附加到了精灵上。

2 定制精灵

精灵从创建到呈现到界面,会经过四个阶段:定位、调整尺寸、着色、混合,这四个阶段我们都是可以通过修改精灵的属性来进行控制的。

2.1 使用锚点移动精灵的frame

精灵的anchorPoint属性决定frame的哪一点定位在精灵的位置上,锚点在单位坐标系中指定,单位坐标系如下:

屏幕快照 2017-02-05 上午11.18.50.png

设置锚点:

//使用锚点,移动ship,锚点范围0--1,默认为(0.5, 0.5)
ship.anchorPoint = CGPoint(x: 0.5, y: 1)
屏幕快照 2017-02-05 上午11.27.25.png

指定锚点后,如果对精灵进行旋转,则会围绕着锚点旋转,如下:

//旋转90度
ship.zRotation = CGFloat(M_PI_2)
屏幕快照 2017-02-05 上午11.31.09.png

2.2 调整尺寸

精灵的尺寸有它的三个属性决定的:

  • size属性是精灵的基准尺寸,该值和纹理的尺寸相等。
  • xScale与yScale属性,对基准尺寸进行缩放。
        //使用Scale属性对精灵进行缩放
        ship.xScale = 0.3
        ship.yScale = 0.3

如下:

屏幕快照 2017-02-05 上午11.39.22.png

2.3 着色

纹理应用到精灵之前,可以使用color和colorBlendFactor进行着色,color决定颜色,colorBlendFactor属性是混合因子,默认为0。如下,我们给飞船添加一个红色色调:

        //使用color和colorBlendFactor属性对精灵进行着色,默认混合因子colorBlendFactor为0
        ship.color = SKColor.red
        ship.colorBlendFactor = 0.5

如图:

屏幕快照 2017-02-05 上午11.43.08.png

添加一个颜色变化的动画:

        //颜色动画
        let pulseRed = SKAction.sequence([SKAction.colorize(with: SKColor.red, colorBlendFactor: 0.5, duration: 0.2),
                                          SKAction.wait(forDuration: 0.1),
                                          SKAction.colorize(withColorBlendFactor: 0, duration: 0.1)])
        ship.run(SKAction.repeatForever(pulseRed))
2017-02-05 12_00_53.gif

2.4 混合精灵到帧缓冲区

渲染的最终阶段是把精灵的纹理混合到目标帧缓冲区,默认是使用纹理的alpha值混合纹理与目标像素,但是,当想添加其它特效到场景时,可以使用其它混合模式。可以使用BlendMode属性来控制精灵的混合行为:

        //使用BlendMode属性控制精灵混合行为
        ship.blendMode = .add

3 使用纹理对象

虽然我们可以用上面的方法一个一个的创建精灵,但是,假如有很多精灵共用一个图像时,使用使用图像创建出纹理,然后通过纹理创建精灵是更好的方式,使用纹理创建的好处是不用每次都去bundle加载图像,只需要加载一次到纹理中即可。

我们给场景添加一个功能,当点击某一点时,在该点生成一架飞船,再次点击时,上一次生成的飞船往下掉,知道飞出屏幕,代码如下:

    override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {
        let touch = touches.first
        addTextureShip(touch!)
    }
    
    func addTextureShip(_ touch: UITouch) {
        //使用小部分纹理,我们可以在原纹理的基础上,只使用其中的某一部分
        let texture = SKTexture(rect: CGRect(x: 0, y: 0.5, width: 1.0, height: 0.5), in: shipTexture)
        
        let ship = SKSpriteNode(texture: texture, size: CGSize(width: 40, height: 40))
        ship.position = touch.location(in: self)
        ship.name = "Ship"
        ship.zRotation = CGFloat(M_PI)
        
        enumerateChildNodes(withName: "Ship") { (node, _) in
            let current = node as! SKSpriteNode
            if current.physicsBody == nil {
                current.physicsBody = SKPhysicsBody(rectangleOf: current.size)
            }
        }
        
        addChild(ship)
    }
    
    override func didSimulatePhysics() {
        enumerateChildNodes(withName: "Ship") { (node, _) in
            if node.position.y < 0 {
                node.removeFromParent()
            }
        }
    }

最终效果:

2017-02-05 12_01_33.gif

结语

本文学习了精灵的创建,修改等操作,精灵是游戏的基石。

本文代码(game02):https://github.com/flywo/SwiftGame

相关文章

网友评论

    本文标题:SpriteKit之使用精灵SKSpriteNode

    本文链接:https://www.haomeiwen.com/subject/nmzsittx.html