やりたいこと / 結果
- ボールが遠くに飛んでいるアニメーションを表現したい。
- ちょっと試したが結構難しいことが分かった
コードを書く前にやったこと
- 実際に紙を丸めて投げてみて、観察してみる
- あまり 横幅が変わらないことが分かった
- デザイナの @d-mikita に相談して以下のアドバイスを貰った
- 「例えばゆらしてみるとかブレるアニメがいいのでは?」 とか
- 「ボールを投げる距離によって自ずと変わってくるのでは?」 とか
Gifアニメ
コード
ローラ.swift
import SpriteKit
import XCPlayground
let sceneWidth = 500
let sceneHeight = 500
func shootRola(scene: SKScene) -> Void {
let roLa = SKSpriteNode(imageNamed: "OK")
let throwAnim = SKAction.moveBy(CGVector(dx: 0.0, dy: 400), duration: 0.5)
let scaleDownAnim = SKAction.scaleTo(0.75, duration: 0.5)
let roLathrowGroup = SKAction.group([throwAnim, scaleDownAnim])
roLa.position = CGPoint(x: 280, y: 0)
roLa.runAction(roLathrowGroup)
scene.addChild(roLa)
}
let skView = SKView(frame: CGRect(x: 0, y: 0, width: sceneWidth, height: sceneHeight))
let skScene = SKScene(size: CGSize(width: sceneWidth, height: sceneHeight))
shootRola(skScene)
skView.presentScene(skScene)
XCPShowView("Live SKView : Rola", view: skView)
ポイント
-
X幅を小さくしつつ、Y軸を変化させる
という2つのアニメーションアニメーションを使うには、SKAction.group
の API を用いる - 上記コードで言うと、以下がポイントになる
ローラ.swift
// y 座標を400移動しつつ、0.5ずつつ、変更してみる
let throwAnim = SKAction.moveBy(CGVector(dx: 0.0, dy: 400), duration: 0.5)
// 0.75 倍の大きさに0.5秒で作る
let scaleDownAnim = SKAction.scaleTo(0.75, duration: 0.5)
// 上記2つの処理を並列で実行する
let roLathrowGroup = SKAction.group([throwAnim, scaleDownAnim])
Improvement
- もうちょっと複雑なアニメーションを表現する必要がある
- ブレるアニメーションをいかにして表現するか