FabricJSを使用してアニメーションで画像をまっすぐにする方法は?

このチュートリアルでは、アニメーションを使用して画像をまっすぐにする方法を学びます FabricJS。 fabric.Image のインスタンスを作成することで、Image オブジェクトを作成できます。以来 これは FabricJS の基本要素の 1 つであり、アプリケーションを通じて簡単にカスタマイズすることもできます。 角度、不透明度、その他のプロパティ。アニメーションを使用して画像をまっすぐにするために使用します fxStraighten メソッド。

＃＃＃文法＃＃＃ リーリー

パラメータ

• callbacks - このパラメータは、使用できるコールバック関数を持つオブジェクトです。 アニメーションに関連する特定のプロパティを変更します。

使用

矯正

方法 ＃＃＃例＃＃＃ コード例を見て、

straighten

メソッドを使用したときに Image オブジェクトがどのように表示されるかを見てみましょう。

fx

straighten の代わりに使用されます。これは、それらの違いを理解するのに役立ちます。 straighten メソッド straighten は、オブジェクトを現在の角度から回転させます。 どれが近いかによって、0、90、180、270 などになります。ただし、fxstraighten は次の場合に適用されます。 同じ方法ですが、アニメーションを使用します。 リーリー 使用fxstraightenメソッド

＃＃＃例＃＃＃

この例では、fxstraighten メソッドを使用して画像オブジェクトを

straighten

しました 簡単なアニメーションを表示します。画像オブジェクトの角度は 45 度です。

0 度に回転して戻して

をまっすぐにします。それとは別に、onChange 関数は これはアニメーションの各ステップで呼び出されますが、onComplete 関数は次のステップでのみ呼び出されます。 アニメーションが完了したため、画像オブジェクトが拡大縮小されることになります。 水平方向に 1.5 倍、左方向に 130 の値で移動します。 ああああ

以上がFabricJSを使用してアニメーションで画像をまっすぐにする方法は?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。