HMDT - Special Issue / Sketch BP / ポリゴンツールの仕様

■ ポリゴンツールの仕様を考える

次は、ポリゴンツールだ！まず、その仕様を考えないとな。

ポリゴンツールは、自由な多角形を描くためのツールだ。マウスで、ぽん、ぽん、と点を置いていって、描くことができるようにしよう。点と点の間は、直線で結ばれる。曲線はなし。

もっと具体的に考えてみよう。オブジェクトを作るときと、編集するときの仕様を考えてみた。

◆ 作成時の仕様

まず、ドローオブジェクトを作るときの仕様を考えよう。

1. ポリゴンツールを選択して、画面の何もないところをクリックしたら、作成モード開始。クリックした点を、ポリゴンの開始点（および現時点の最終点）にする

2. 作成モード中は、ポリゴンの各点にハンドルを描く

3. 作成モード中は、ポリゴンの最終点からマウスの位置まで、グレーの線を引く

4. 作成モード中に、画面をクリックしたら、ポリゴンにその点を追加する。その点を新しい最終点とする

5. クリックした点がポリゴンの開始点だったら、ポリゴンを閉じて、作成モードを終わりにする。新しいドローオブジェクトの出来上がり

6. ダブルクリックしたら、その点を追加して、作成モードを終わりにする。パスは閉じない。新しいドローオブジェクトの出来上がり

こんなとこかな。

◆ 編集時の仕様

続いて、編集するときの仕様だ。ポリゴンツールは、編集モードを持つよ。

1. 選択ツール（矢印ツール）の状態で、ポリゴンオブジェクトをダブルクリックすると、編集モードに入る

2. 編集モード中は、ポリゴンの各点にハンドルを描く

3. 編集モード中は、ハンドルをクリックすると選択できる

4. ハンドルをドラッグしたら、そのポリゴンの点を変更する

5. ハンドルを選択中に delete キーを押すと、その点を削除する

とりあえず、こんなとこ。え？ポイントを追加する方法がないって？ふふふ、そのとおり。線の上をクリックしたら、点を追加する、っていう仕様も入れたかったんだけど、NSBezierPath には線の上のクリックを検出する方法がないようなので、とりあえずパス。簡単なものから順々に、ということで。

■ ポリゴンツールに必要となるもの

上みたいな感じの仕様で、実装に必要なものを考えよう。

まず、ポリゴンの点の配列がいるよな。ポリゴンを作るときに、追加された点をどんどん保持しておく配列。あと、ポリゴンのパスが閉じているかどうかも知っておかないといけない。これは bool 値のフラグで持っておこう。

さらに、サイズを変更することも考えないといけない。ポリゴンツールの場合は、サイズを拡大、縮小するときに、点をすべて変更しないといけないんだ。そのために NSAffineTransform を使おう。サイズの変更をアフィン変換として持っておいて、それをポリゴンの各点に適用することで、ポリゴンのサイズを変えるんだ。

後は、SKTGraphic がもともと持っているやつで間に合うかな。

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

HMDT - Download / Sketch BP