前ページ で色々な図形を描きました。ここでは円を横に並べてみましょう。

  1. 繰り返し文(for文)を使って円を複数並べます。繰り返し回数を7にします。 for文の中にPGCircle()を入れることで複数の円を描きます。

  2. .position(cx: で繰り返しのカウンタxに70を掛けて加算します。

1
2
3
4
5
6
7
8

func design( screen:PGScreen ) {
   for x in 0 ..< 7 {
       PGCircle()
       .color( .blue )
       .scale( width:50, height:50 )
       .position( cx:-210 + x * 70, cy:0 )
   }
}
  1. 「コードを実行」を押します。

目標

  • 横に並んだ円が表示されたら成功です。
  • (+1) 繰り返し回数、また.positionでの掛け算の値を変えてみましょう。
  • (+2) 円をぼやけた円(PGBlurryCircle)などに変えてみましょう。

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

  • Note: for x in 0 ..< 7 {
    　※ この中のコードを7回繰り返します。
    　※ xの値が 0,1,2,3,…,6 と変化します。
    }
  • Note: for x in … のxをカウンタと呼びます。

実行例

result-1-2-2.png