パスで自由な線を描く
今回は、「パス」というものを使って、いろいろな種類の図形を描いていく方法を紹介したいと思います。
はじめに、パスとは英語で「小道」や「軌道」のことを指します。その言葉のとおり、パスはさまざまな線をつなぎ合わせることで、思いどおりの道を描くことができます。作った道に沿って線を描くこともできますし、道に囲まれた庭園を思いどおりの色で塗り潰すことも可能なわけです。
スウィフトには、もっとも基本的な図形を描くための関数が初めから用意されていて、四角形、丸角の四角形、円、楕円が簡単に作成できるようになっています。また、点と点をつなぎながら線を描いていくという方法でも、簡単にパスを作ることができます。もちろん直線だけでなく、曲線だって描けます。
ゲームを作るときには、パスで描いたのとおりにキャラクターを歩かせるといったことまでできるので、パスの使い方を覚えれば、スウィフトでできることが何十倍にも増えたように感じられることでしょう。
【STEP 1】形を確認しながらパスを作る
Xcodeの［File］メニューから［New］→［Playground］を選択すると、プレイグラウンドが作れるんでしたね（2015年8月号を参照）。もう慣れましたか? プレイグラウンドが表示されたら、上図5行目のコードを打ち込みます。するとコードの右側に「＋」ボタンが表示されますので、そのボタンを押すと、上図のようにパスの中身がプレビューできます。パスを表すUIBezierPathクラスにrect：引数でCGRectMakeを指定すると、そのサイズの四角形を表すパスができます。
UIBezierPathクラスのovalInRect：引数にCGRectMakeを指定すると、その四角の中に収まる楕円を表すパスができます。四角形を正方形にするとキレイな円になります。
引数なしでUIBezierPathを作成すると、空のパスができます。空のパスには、図のように、moveToPointでペンを移動させ、addLineToPointで線を追加することで、線をつないでいくことができます。最後にclosePath()を呼び出すことで、図のように、始点と終点がつながったパスができ上がります。
【STEP 2】線と塗り潰し
2015年9月号で取り上げたお絵描きプログラミングと組み合わせてみましょう。UIColorで表される色にsetStroke()メソッドを呼び出すと線の色がセットされますので、パスにstroke()メソッドを呼び出すことで、その色で境界線が描画されます。
UIColorで表される色にsetFill()メソッドを呼び出すと塗り潰しの色がセットされるので、パスにfill()メソッドを呼び出せば、その色でパスが塗り潰されます。fillで塗り潰してからstrokeで別の色で線を描けば、境界線付きで図形が描画できます。
【STEP 3】いろんなパスを作ってみよう
UIBezierPath作成時の引数にroundedRect:とcornerRadius:を使うことで、最初の引数で指定したサイズの四角形の4つの角を、2つ目の引数で指定した半径で丸くしたパスを作ることができます。
直線を引くaddLineToPoint()メソッドの代わりに、addQuadCuveToPoint()メソッドを使うことで、2次ベジェ曲線と呼ばれる曲線を描くことができます。
2次ベジェ曲線は、この図のように、開始点と終了点のほかに制御点という第3の点をもう1つ指定することで、途中の線を制御点のほうに曲げて描くことのできる曲線です。少しクセがありますが、慣れればとても便利です。
2次ベジェ曲線を使うことで、さまざまな曲線を表現して、自由自在にパスを作ることができます。プレイグラウンドを使うことで、線を追加するごとに変わる形を一つ一つ確認しながら、簡単にパスを作り上げていくことができます。お絵描きプログラミングでは、いくつものパスを組み合わせることで、いろんな絵を描くことができます。
【まとめ】
今回はパスを使って、いろんな図形を描く方法を紹介しました。ぜひ皆さんも、動物や国旗など、自分が描いてみたいお題を決めて、パスでそれを作るのにチャレンジしてみてください。
次回のテーマ
スウィフトでアプリ制作にチャレンジ（前編）
【冒険記】
スウィフトが登場したときに注目を集めたのが、「変数名に絵文字が使える」という特徴でした。実験してみたところ、一部の絵文字が使えないのに加えて、肌の色が異なる人物アイコンの絵文字が別々の変数になってしまいます。なかなか使いこなすのは難しそうです…。
【冒険記】
スウィフトでは、ひらがな、カタカナ、漢字といった日本語の文字も変数名に使えます。小学生や中学生に向けたプログラミング教室などでは重宝するかもしれませんね。プロは英語で書くのが仕事ですが、入門者のハードルはできるだけ下げるべきだと思うのです。
Dr.さざめき（aka.沼田哲史）
1978年1月生まれ。某大学でプログラミングを教えつつ、ふらっとヨーロッパ旅行に出かけて美味しいものを食べ歩いたり、時折、iOSプログラミングの本を出したり。Mac歴16年。いつかアメリカ西海岸でお昼から美味しいIPAビールを飲みながらプログラミングするのが夢です。Twitter @sazameki
