問題タブ [easing-functions]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
2 に答える
3920 参照

javascript - 三次イージング方程式の作成を支援する

次のコードがあります

その出力は、この { 0, 0.1, 0.2, ..., 0.9, 1.0 } のように数値を線形に配置します


アップデート

私の実装が正しいかどうかはわかりませんが、期待どおりの曲線が得られています

0 投票する
3 に答える
2655 参照

math - イージング機能の実装

見つけたイージング関数を移植して実装しようとしています

編集

:間違ったイージング機能を貼り付けました、ごめんなさい!正しいものは次のとおりです。


私が使用している言語はFlashまたはActionscriptではありません。これが私のコードです:

私はループで関数を呼び出しています:

EDIT2-呼び出し元の関数。

m.moveは、移動する方向の場合は1または-1に設定され、移動する方向の場合は-5+5に設定されます。setspritemovesは可能な限り頻繁に呼び出されます。現在、システムが呼び出すことができる速度と同じですが、ミリ秒のタイマーで呼び出しをトリガーできます。

m.moveto [i]は宛先x座標、m.timeは整数I増分、m.durationは変更が完了するまでにかかる時間と想定される時間、m.spriteposxは現在の位置です私が動かしているオブジェクトの。[i]は現在のスプライトです。

1/2秒で345ピクセルを移動したい場合、時間の増分値はどのくらいにする必要がありますか?

すべての実験で、私は大きな要因でオーバーシュートするか、数ピクセルしか移動しません。

現在、m.timeは反復ごとに1ずつ増加し、m.durationは100です。私はすべての種類の値を試しましたが、一貫して機能するものはないようです。

0 投票する
2 に答える
6149 参照

jquery - jQuery easeOutElastic 関数をカスタマイズする

jQuery の制御下に横スクロール Web サイトがあり、水平方向に数千ピクセル離れたページがいくつかあります。私は easeOutElastic 関数を使用していますが、アニメーションが高速になり、弾性バウンスを弱める必要があります。デュレーション パラメータを大きくすると、アニメーションが遅くなりますが、バウンスも遅くなります。デュレーションがアニメーション全体を制御しているようです。

私がする必要があるのは、移動の速度と弾性のきつさを別々に制御することです. 私はプラグインでそのeasyOutElastic関数の独自のコピーをいじっていましたが、すべてのパラメーターが何であるかがわからないため、正しく理解できないようです:

パラメータ x、t、b、c、d が何を表しているか教えてもらえますか?

私は仮定します(関数をトレースします):

t == 0 のときにイージング関数が終了したように見えますが、実際に必要なのは、時間が経過するのを待つのではなく、モーションの速度があるしきい値を下回ったときに関数が戻ることです。しかし、速度はどこで計算されるのでしょうか? (?)

これを解読するためにあなたが与えることができるどんな助けも素晴らしいでしょう!

0 投票する
1 に答える
197 参照

silverlight - イージング関数の制御点一覧

現在のイージング関数x1, x2, y1, y2の(KeySpline同等の) 値を取得するためのリストまたはメソッドを探しています(例: with mode )。CircleEaseEaseInOut

どうすれば入手できますか?

0 投票する
5 に答える
35203 参照

jquery - イージング機能とは何ですか?

アニメーションのコンテキストで機能を緩和することの意味。dojo、jquery、silverlight、flexなどのUIシステムにはイージング機能の概念があるようです。イージング機能の良い説明が見つかりませんでしたか?誰かがイージング機能の概念を説明したり、それらの良い説明を指摘したりできますか?私はフレームワークの特定の詳細ではなく、概念に興味がありますか?

イージングは​​場所に厳密に使用されていますか、それとも一般的であり、オブジェクトの任意のプロパティに適用できますか?

0 投票する
2 に答える
1930 参照

ios - カスタム イージング カーブを使用して UIView ブロック ベースのアニメーション メソッドを再実装する

UIView のブロック ベースのアニメーション メソッドにカスタムのイージング カーブがないため、より高度なカーブが必要な場合は Core Animation になります。

カテゴリをオンにしてこれを行う方法については、Core Animation を使用してカスタム イージング関数を作成する方法CAKeyframeAnimationで説明しています。.

UIViewコードをクリーンで保守しやすい状態に保つために、さらに一歩進んでのブロック ベースのメソッドを再実装し、イージング カーブ関数を記述するブロックを含めたいと思います。結果のカテゴリ onUIViewは次のようになります。

Apple がブロック ベースのアニメーション メソッドをどのように実装しているかを知っている人はいますか?

0 投票する
1 に答える
94 参照

math - ペナーイージングで範囲外の値を防ぐ

次のイージング関数を使用して画面上のオブジェクトを移動するプロジェクトに取り組んでいます。

値が急速に範囲外になり、オブジェクトが目まぐるしい速度で画面外に移動する状況に遭遇し続けます。最初の状況は、関数の結果を整数値に切り捨てることによって引き起こされたようですが、これを修正しました。まったく同じ動作を引き起こした次のことは、オブジェクトが静止し、新しいイージング距離が入力された後、時間値がリセットされなかったときであるように見えました。宛先値を変更した後にリセットを追加すると(change = destination-start)、これで問題が完全に修正されたようです。

これで、画像をダウンロードして交換するループにコードを追加しました。ループに実行時間が追加されると、値が範囲外になり、画面から飛び出す画像の同じぼやけが生じることがあるようです。

コードを簡単に説明するには:

イメージのダウンロード/スワップ(実際のスワップはポインターを変更するだけです)コードを追加する前は、プリロードされたイメージと一時的なイメージの両方ですべてがうまく機能していました。最初に一時画像を読み込んでスワッピングしているので、ループが1/30秒以上で実行されることがあり、これがタイマー値の異常を引き起こしている可能性があります。

したがって、基本的に、イージング関数が急速に制御不能になるクレイジーな値を生成しないようにする値を設定できる、ある種の「ガバナー」クランプがあるかどうか疑問に思っています。たとえば、移動した合計距離は、1回の反復で250ピクセルを超えてはなりません。実際、移動先の値に対して常に数ピクセルである必要があります。

0 投票する
1 に答える
979 参照

delphi - Delphi での EaseIn、EaseOut 関数の実装

TChromeTabsでタブの流動的な動きを実装しようとしています。イージング式はこちらで確認できますが、私は数学者ではないので、これをコードに変換する方法がわかりません。これまでの私の試みはどこにも行きませんでした。

利用可能なイージング関数の Delphi 実装はありますか?

0 投票する
2 に答える
784 参照

wpf - Windows 8のチャーム設定で使用しているEasingFunctionは何ですか?

WPF 4.0(C#)を使用してアプリケーションを作成します

Windows8のチャーム設定で使用しているEasingFunctionが登場したことを知りたい。

Windows8設定チャーム

CubicEase、QuarticEase、PowerEase、ExponentialEaseを使用していますが、Windows8のようなアニメーションを作成できません。

デフォルトベースのEasingFunctionを使用してWindows8のようなアニメーションを作成するにはどうすればよいですか?

0 投票する
0 に答える
124 参照

animation - Microsoft office 2013 アニメーションのイージング機能

アニメーションを利用することで、ほぼすべてのプラットフォームの GUI を簡単かつ簡単に設計できるようになりました。しかし、イージング機能の選択はユーザー エクスペリエンスに劇的な影響を与えます。MS Office 2013 (そしておそらく Windows 8 全般) で使用されているイージング機能は本当にクールだと思います! 誰がそれが何であるか知っていますか?