CurveLib
曲線の公式を使って図形を描いたりするライブラリ 。
各曲線の数学的公式を1つ1つのクラスとして用意し、ごそごそ座標計算をするライブラリです。
ICurveFormulaインタフェースを実装した曲線の公式定義クラスと、その公式定義をいろいろ計算するCurvePointクラスがいらっしゃいます。
それだけでは、見た目に楽しくないので CurveGraphicsクラスというgraphics.lineTo()して曲線を描画するクラスもあったりします。
CurveLibを使ってどんな曲線が描けるのかの確認用、また公式定義クラスの引数確認用にサンプルサイトを作ったので見てみてください。
サンプルサイト
http://violentcoding.com/content/curvelib/
上記サイトと同じものSWF置き場(ローカルFlashPlayerの方が描画が早いのでこちらをおすすめ)
http://www.libspark.org/svn/as3/CurveLib/trunk/doc/fp9/formulaSWF/
CurvePointクラス
- 曲線の公式を使った計算
- 半径を1.0として計算
ICurveFormulaインタフェース
- 曲線公式の定義
- 半径を1.0として定義
今用意している曲線は以下のようなものです。
- Botanic Curve
- Rhodonea(バラ曲線)
- Epitrochoid(外トロコイド)
- Hypotrochoid(内トロコイド)
- Starr Rose
※半径を1.0で計算し、また始点から終点への周回数計算が楽なため公式定義の引数に分母と分子を設定するとか数学的公式とは違ってクセがあります。
クラス図としては以下になります。一応公式クラスを追加しても、まぁ良い感じになるように学習してみました。
CurveLibの主要となるのはCurvePointクラス。
CurvePointクラスのメソッド
- 指定角度でのXY座標を取得:getAnglePoint( angle )
- 曲線上の計算する点の数を取得:getPointCount()
- タイマー計算:startCurvePoint( delay, isClose )
- タイマー計算の制御:startTick()・stopTick()・resetTick()
- タイマー計算時イベント:start・stop・tick・complete・loop イベント
CurvePointクラスのプロパティ
- formulaプロパティ:使用する公式(ICurveFormula)
- 何度ごとに計算するか:stepSizeプロパティ
- 開始角度の指定:startAngleプロパティ
- 時計周りに計算するかどうか:isClockWiseプロパティ
- ループさせるか:isLoopプロパティ
を用意しましたので、それらを駆使して曲線上の座標値でゴソゴソします。
またCurvePointクラスを使用して曲線をgraphics.lineTo()するCurveGraphicsクラスでも数種類の曲線描画ができたりします。
CurveGraphicsクラス
- CurvePointクラスと「曲線の半径」を指定する
- graphics.lineTo()などする
- for文で一気に描画するパターン
- タイマーで描画するパターン
- 曲線の中心点が( x=0, y=0 )
- graphics.endFill()のtrue/falseを指定して連続描画
CurveGraphicsクラスでの描画パターン(1)for文で一気に描くタイプ
- 線・塗りで曲線を描画:lineCurve( isEndFill )
- 曲線上の点を円で描画:chipCurve( chipRadius, isChipFill )
- 曲線上の点Pと指定角度をずらした点Qを結んだ線を描画:lineAngleBetween( angleBetween )
サンプルは以下のSample01.fla・src/Sample01.asが該当です。
http://www.libspark.org/svn/as3/CurveLib/trunk/samples/fp9/samples/
CurveGraphicsクラスでの描画パターン(2)タイマーでチクチク描くタイプ
- 線・塗りで曲線をタイマー描画:tickLineCurve( delay, isEndFill )
- 曲線上の点を円でタイマー描画:tickChipCurve( delay, chipRadius, isChipFill )
- 曲線上の点Pと指定角度をずらした点Qを結んだ線をタイマー描画:tickLineAngleBetween( delay, angleBetween )
サンプルは以下のSample02.fla・src/Sample02.asが該当です。
http://www.libspark.org/svn/as3/CurveLib/trunk/samples/fp9/samples/
また、塗りの設定で以下の違いがでます。
CurveGraphicsクラスでの描画 引数「isEndFill」== trueの場合
- 線の描画の最後でgraphics.endFill()が実行される
- 次の描画ではあらためてbeginFill()にて色を設定する必要がある。
CurveGraphicsクラスでの描画 引数「isEndFill」== falseの場合
- 線の描画の最後でもgraphics.endFill()をしない
- endFill()、beginFill()をしないので、塗りが閉じられずにそのまま次の描画に続く。
サンプルは以下のSample03.fla・src/Sample03.as、Sample04.fla・src/Smaple04.asが該当です。
http://www.libspark.org/svn/as3/CurveLib/trunk/samples/fp9/samples/
また、ASDocコメント記述の学習もしてみたので、その他については以下を参照してください。
CurveLib ASDoc
http://www.libspark.org/svn/as3/CurveLib/trunk/doc/fp9/asdoc-output/
リポジトリブラウザ
http://www.libspark.org/browser/as3/CurveLib
ソースリポジトリ
http://www.libspark.org/svn/as3/CurveLib/
サンプル
http://www.libspark.org/svn/as3/CurveLib/trunk/samples/fp9/
ドキュメント
http://www.libspark.org/svn/as3/CurveLib/trunk/doc/fp9/
勉強会資料
[Flash]Spark project 勉強会 #6 | blog ViolentCoding
http://violentcoding.com/blog/2008/12/20/archives/434
[AS]曲線の公式を描画するライブラリ | blog ViolentCoding
http://violentcoding.com/blog/2009/01/03/archives/467
添付ファイル
- curvelib01.png (84.2 kB) - e_s_jp によって 2009/01/03 21:46:44 に登録されました。
- curveLib.gif (23.0 kB) - e_s_jp によって 2009/01/03 21:47:15 に登録されました。



