たこぜりー研究室

大腸菌DNAは4.64Mbp。酵母は13Mbpで、ヒトは3Gbp

スポンサーサイト

#
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

3 次ベジェ曲線を XAML で

#460
3 次ベジェ曲線のパラメータ表示は、

p(t) = (1 - t)^3 * p0 + 3t (1 - t)^2 * p1 + 3t^2 (1 - t) * p2 + t^3 * p3

ですが、これを 0 ≦ t ≦ 1 で動かす様子を XAML で!
と思ったのだが、どうやら Loose XAML では厳しそうとの結論。

10 個の Point を用意。各 Point 間を結ぶ直線を表現するのに、LineSegment.Point などに各 Point をバインディングするところまでは OK 。

最初の 1 次のところは PointAnimation の線形補間で実現できるので、ここもコード不要。
だがこのさき、2 次、3 次は線形補間ではだめで、PointAnimationUsingPath がうまくいかない。
2 次はうまくいっているように見えるが、実際には速度が間違っていて、3 次になったときにずれていることが判明する。
(当然と言えばそうかもしれんが気づくのに時間がかかった)


で結局、コードを書くことに。
2 次・3 次は Storyboard.CurrentTimeInvalidated イベントにひっかけて動かし、パラメータ t の値は Storyboard を Clock にキャストし、Clock.CurrentProgress から取得。

完成品 :

3 次ベジェ曲線
ちゃんと青線が赤線の接線になっている、はず。

なお、比較 → Wikipedia

コメント


コメントの投稿


管理者にだけ表示を許可する

トラックバック

トラックバックURL:  http://takojelly.blog2.fc2.com/tb.php/460-c4fb9e4b
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。