keyTimes属性とkeySplines属性(動作テスト付き)
ベジェ曲線を使って動きを制御する。
keyTimes属性、keySplines属性、values属性が必要。
あと、主な注意点は次のとおり。
(1)keyTimesとkeySplinesは同時に指定する。
(2)keyTimesとvaluesは値のセット数が同じであること。
(例)keyTimes="0;1" values="0,0;250,50"
(3)calcModeはsplineであること(pacedの場合、keyTimesの設定は無視される)。
(4)<t:animatemotion>タグにkeyTimesを指定する場合は、calcModeをpacedにしてはならない。
(5)1本のベジェ曲線は4つのコントロールポイントから成る。
ベジェ曲線が分かってないと、分かりづらい(よー分からん)。
下のフォームでいろいろ値を変えて試してみること。
動作テスト
<t:animateMotion begin="1" dur="3" calcMode="spline" keySplines="0 .9 .5 1" keyTimes="0;1" values="0,0;250,0" fill="hold" />
<t:animateMotion begin="1" dur="1" calcMode="spline" keySplines="0 .1 .9 1" keyTimes="0;1" values="0,0;200,-200" fill="hold" autoreverse="true" />
<t:animateMotion begin="1" dur="3" calcMode="spline" keySplines="0 .1 .9 1;0 .5 .8 1" keyTimes="0;.3;1" values="0,0;200,-50;400,0" fill="hold" />