こういう本とかこういう本とかこういう本とか、ついつい買ってしまうのですが、なかなか開いて勉強する機会がありません。理由を考えてみると、

1. 仕事でこういう表現が必要になる機会がない
2. 仕事でProcessingを使う機会がない

等々ありますが、1に関してはチキン・エッグの関係で、表現の引き出しさえ自分にあれば、なんとなくそういう引き出しを使う機会もあるんじゃないの、と。

そして2に関しては、じゃあ自分のメイン言語であるSwiftで写経すればいいのでは？と。

というわけで、やってみました。

（今回の成果物。まずは円を描いて動かすシンプルなところから）

写経元: Coding Challenge #7 : Solar System

冒頭に本を挙げて積読を問題提起しておいてなんですが、写経の教材は次の動画で解説されているProcessingのソースコードです。（これを思いついたときが外出先で、本は家にあったので。）

完成図

こんな感じになりました。ロジックほぼ完コピで、パラメータだけ画面サイズに合わせて少し変えています。

SpriteKit

ProcessingのコードをどのようにSwiftで（というかiOSで）実現するかですが、SpriteKitをチョイスしました。理由は、Processingに比較的近い書き方で図形を描いたりアニメーションを描画したりできそうだなと。

たとえばレンダリングループ内で呼ばれるメソッドがあらかじめSKSceneに用意されてるところとか。

override func update(_ currentTime: TimeInterval) {
    // 毎フレーム行う処理
}

実際のところ今回ぐらいの描画負荷であればUIKitでも良かったのですが、SpriteKitはもともと2Dゲーム制作を想定してつくられたフレームワークなので、今後もっと複雑なProcessingのサンプルを移植するとすると、こちらのほうがグラフィックス処理的に優れているかなと。

ProcessingコードをSpriteKitコードに移植する

Processingの関数名そのままではありませんが、以下のようにほとんど単純置き換えでSpriteKitコードに移植できます。

translate

（Processing）

translate(distance, 0);

（Swift）

position = CGPoint(x: distance, y: 0)

fill

（Processing）

fill(255, 100);

（Swift）

fillColor = UIColor(white: 1, alpha: 100/255)

rotate

(Processing)

rotate(angle);

(Swift)

let action = SKAction.rotate(byAngle: angle, duration: 0)
run(action)

（楕）円の描画

（Processing）

ellipse(0, 0, radius*2, radius*2);

（Swift）

// 楕円
SKShapeNode(ellipseIn: CGRect(x: 0, y: 0, width: radius*2, height: radius*2))

// 円
SKShapeNode(circleOfRadius: radius)

etc...

足りないメソッドを補う

とはいえSpriteKitはProcessingとは用途が違うので、用意されてないメソッドもあります。

たとえばProcessingのrandom関数に相当するものがないので、次のように実装しておきます。

func random(min: Float = 0, max: Float) -> Float {
    return (Float(arc4random_uniform(UINT32_MAX)) / Float(UINT32_MAX)) * (max - min) + min
}

ソースコードのダウンロード

Xcode 9.3、iOS 11.3で動作確認しています。なお、基本的にトラブルシューティング等のサポートは行っていません。ご容赦ください。