2017-05-26 9 views
1

DOMから要素が追加または削除されたときに、JQuery UIのようなものを使ってアニメーションを書きたいとしましょう。私はthis articleアニメーターインターフェイスを使用してを使用して自分のアニメーションを書くことができることがわかりますを入力しての機能を残してください。この記事では、view-slot.jsの例を使用して、このインターフェイスの利用方法を示します。Aureliaで自分のアニメーションライブラリを実装するにはどうすればいいですか?

import {Animator} from './animator'; 
... 
constructor(anchor: Node, anchorIsContainer: boolean, animator?: Animator = Animator.instance) { 

私はここにどのようにしてAnimatorインターフェースを実装できますか?私はGreensock aurelia pluginを別のjavascriptアニメーションライブラリとして使用しましたが、これはどのようにしてanimator.jsのGreensockアニメーションが書き込まれた独自のバージョンを使用しているかを調べるための例です。ビューア・スロット・コンストラクタへのアニメータ・インタフェースのカスタム実装を提供するが、空になったものを見つけることを期待していました。

何か助けていただければ幸いです。

答えて

1

見つけました。 AureliaのDIコンテナの中にあるテンプレートエンジンでconfigureAnimatorを実行する必要があります。以下の例は、アニメータインタフェースの実装であるanimator-cssから抜粋したものです。このコードは、起動プロセス中にプラグインとして実行されます。

export function configure(config: Object, callback?:(animator:CssAnimator) => void): void { 
    let animator = config.container.get(CssAnimator); 
    config.container.get(TemplatingEngine).configureAnimator(animator); 
    if (typeof callback === 'function') { callback(animator); } 
} 

https://github.com/aurelia/animator-css/blob/master/src/index.js

関連する問題