1-11. 毎フレームの処理

前ページで終了時の操作を学びました。ここでは、毎フレームの処理を自分で書いてみましょう。

PGCircle() を書きます。
.position(cx:cy:), deltaPosition(dx:dy:), .life(), deltaLife() を指定します。はじめの初期化です。
.completion{ } で再利用を行います。 .position(cx:cy:)、deltaPosition(dx:dy:), .life() をそれぞれ元の値に戻します。 .color()　は前回と同じくランダムにします。
続けて .iterate{ } を書きます。そのブロック内で $0.deltaPosition(dx:dy:) を書きます。deltaPosition.yの値を1.08倍します。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20


func design( screen:PGScreen ) {
   PGCircle()
   .position( cx:0.0, cy:200.0 )
   .deltaPosition( dx:0.0, dy:-1.0 )
   .life( 1.0 )
   .deltaLife( -0.01 )
   .completion {
       $0
       .position( cx:0.0, cy:200.0 )
       .deltaPosition( dx:0.0, dy:-1.0 )
       .life( 1.0 )
       .color( .random )
   }
   .iterate {
       $0
       .deltaPosition( 
           dx: 0.0,
           dy: $0.deltaPosition.y * 1.08 )
   }
}

「コードを実行」を押します。

目標

円が少しずつ加速して落ちるアニメーションが繰り返されれば成功です。

終わったら次のページへ進みます。

Note: .iterate{ } のブロックは、毎フレーム(1秒間に60回)呼ばれます。今回は deltaPosition.y を毎回1.08倍しているので、1フレームごとに速度が速くなります。

目標#

目標