太さの変わるBezier曲線の生成 - その1

突然だけどタブレットを使って太さの変わるBezier曲線を描くソフトを作りたくなった。PhotoshopやIllustratorを作りたいわけではない。Bezier曲線の生成に集中したい。他にそういったアプリはないと思っているだけど、Windowsにはあるのかなあ。よく知らない。まあ、いい。続けよう。

大まかな方針と解決すべき問題点

Bezier曲線で囲まれた閉領域として太さの変化する曲線を生成するためには、

1. タブレットを追跡できるNSViewのサブクラスを作る
2. ペンをドラッグする間、位置と筆圧をトラックする
3. 連続的に位置をつないで滑らかな曲線を得る
4. その曲線に対して筆圧に比例する線幅を与える
5. 外形を囲むBezier pathを生成する
6. その内部を指定された色で塗りつぶす

とすることが考えられる。タブレットのサポートはMacOS X10.0からあるけど、10.4からはさらに細かい情報がNSEventから得られるようになった。だからタブレットそのものの心配はあまりする必要がない。

しかし、いくつか解決する必要のある問題がある。

1. 外形線のスムージング処理
2. カリグラフィのサポート
3. 線の引きはじめと引き終わりの処理
4. 曲率半径の小さな線の特異性の処理
5. ユーザに対するレスポンスの方法

など。 問題をひとつずつ整理すると、

i.スムージング処理

一つ目の問題は太さの変化しないBezier pathの場合でも発生する。つまり、ペンをドラッグする間に得られる位置情報はとびとびであり、それをそのままつなぐと折れ線になってしまう。どのくらいの頻度で位置情報が得られるかはOSに依存していて制御できない。そのなかで自然に滑らかな曲線に変換できなければいけない。

ii.カリグラフィ

二つ目の問題は丸くないブラシで線を引いたときに線の向きによって太さが変わる図-2のような効果のことで、

太さの制御をするならこれをサポートしないとだめだろうなあ。

iii.端点の処理

三つ目もやはりBezier pathでも起こる問題で、CocoaのBezier pathの場合はline cap styleというパラメータで３種類用意されている。

とりあえずこの３種類はサポートする必要があるが、先のカリグラフィのサポートするなら影響を受ける。

iv.曲率半径の小さな線の特異性

四つ目は一番難しそうな問題で、ようするに図-3のような

内側の外形線が交錯する場合どうするか、という問題である。

v.ユーザに対するレスポンス

最後の問題は、ユーザがドラッグする間、どういう表示をするかという問題で、Bezier pathは線を引き終わった後に生成したい。しかしそれではペンをドラッグしている間NSViewから何の反応ももらえないことになってしまう。何らかの方法で最終結果に近い表示をする必要がある。これはPhotoshop型のビットマップに頼ることになると思うけど、具体的にどうするか。

こういった問題を解決できれば、具体的にアプリとしてまとめたい。ドキュメントスタイルのアプリとしてまとめることはMacOS Xでは簡単にできる。ちゃんとやろうとするとすごい面倒だけど。

さて、これから一個ずつ順番にかたづけてみよう。