私は、cascaded-animationととhero-animationを一緒に使用する小さなアプリケーションを持っていますhere。ポリマーネオンアニメーション：カスケードアニメーションとヒーローアニメーションを一緒に使う方法は？
問題がWebComponentsReadyイベントにin the official documentation
<style>
:host {
display: block;
visibility: hidden;
}
</style>
index.htmlリッスン私library-elementにshow機能を呼び出すためのloadデモのように、私の主な要素は、視認性に隠さに設定されていることである。
<script>
document.addEventListener('WebComponentsReady', function() {
document.querySelector('library-element').show();
});
</script>
showメソッドは、ライブラリ要素visibleを作成し、アニメーションを呼び出します。
show: function() {
this.style.visibility = 'visible';
this.playAnimation('entry');
}
私が今持っている問題は、showメソッドがプレイしたいと、私は entryアニメーションを持っている子要素をアニメーション化という点です。 A cascaded-animationおよびhero-animationである。
animationConfig: {
type: Object,
value: function() {
return {
'entry': [{
name: 'cascaded-animation',
animation: 'scale-up-animation',
}, {
name: 'hero-animation',
id: 'hero',
toPage: this
}],
'exit': [{
name: 'hero-animation',
id: 'hero',
fromPage: this
}, {
name: 'fade-out-animation',
node: this
}]
}
}
}
これはhero-animation休憩のでhero-animationが必要ですfromPageが定義されていないので、プレイしていないcascaded-animationになります。
これは私が取得警告です：結果はcascaded-animationを起動時に実行されないということである
polymer-mini.html:2061 Uncaught TypeError: CreateListFromArrayLike called on non-object
：
hero-animation: fromPage is undefined!
これは私が取得エラーメッセージです。
推奨ソリューション：
ONE：のみ最初のアニメーションを再生するには、私のindex.htmlにshow方法を変更する方法を見つけます。たぶん、このような何か：
show: function() {
this.style.visibility = 'visible';
this.playAnimation(['entry'][0]);
}
TWO：このからライン40でneon-shared-element-animation-behavior.htmlを変更します。それはマイナー前にしたものに
if (!fromPage || !toPage) {
console.warn(this.is + ':', !fromPage ? 'fromPage' : 'toPage', 'is undefined!');
return null;
};
：これに
if (!fromPage || !toPage) {
Polymer.Base._warn(this.is + ':', !fromPage ? 'fromPage' : 'toPage', 'is undefined!');
return null;
};
neon-animation要素の1.2.2に修正してください。そうすれば、少なくともアニメーションを破る代わりに警告を発するだけで、アニメーションを再生することができます。ここで
は、できるだけ頻繁にあなたが望むよう任意の紙カード上DEMO
クリックでヒーローをトリガーとアニメーションをカスケード接続して観察するために、あなたは、カスケード接続のアニメーションが起動されていないウィンドウを更新するたびに。
にはどうすればhero-animationとの組み合わせでcascaded-animationプレーを作るのですか？