как и когда установить animationConfig в бумажном диалоге

У меня есть paper-dialog внутри другого элемента, который выглядит так:

<paper-dialog id="modal" modal>
  <h2>Login</h2>
  <p>Lorem......</p>

  <div class="buttons">
    <paper-button dialog-confirm autofocus>Login</paper-button>
  </div>
</paper-dialog>

Я мог бы декларативно добавить entry-animation и exit-animation, но на самом деле я пытаюсь сделать два эффекта одновременно как это показано в документах

Я попытался использовать что-то вроде:

this.$.modal.animationConfig = {....}; //like the docs

и я установил node в this.$.modal, но я почти уверен, что он вообще не читает эту переменную, потому что, когда я проверяю this.$.modal.getAnimationConfig('exit') (или entry), я ничего не получаю.

Итак, где в жизненном цикле я могу сделать что-то подобное.

Конечная цель для меня — применить переплетенные (одна из них с небольшой задержкой) анимации к моему paper-dialog на entry и exit, как в (как он любит, когда его называют :p ) Поликаст "Боба Дода"

Если вы не знаете ответа, вам также поможет указание мне другого направления ;)


person vvMINOvv    schedule 12.01.2016    source источник
comment
Вы в этом уверены? Я попытался установить анимациюConfig как this.$.modal.animationConfig = { ... } в этой скрипке, и все сработало просто отлично...   -  person Alan Dávalos    schedule 12.01.2016
comment
@Alan Алан, я переписал это, и это сработало, как вы сказали, я попытаюсь выяснить проблему с git diff или чем-то позже, чтобы сообщить вам. Большое спасибо за проверку работоспособности :)   -  person vvMINOvv    schedule 20.01.2016
comment
@ Алан, честно говоря, я не мог понять, почему изначально это не работало. Хотите опубликовать свой ответ и положить этому конец?   -  person vvMINOvv    schedule 25.02.2016


Ответы (2)


Поскольку кажется, что мой комментарий был полезен, вот он как ответ:

«Вы уверены в этом? Я попытался установить для параметра animationConfig значение this.$.modal.animationConfig = { ... } в этой скрипке, и все сработало просто отлично. ."

person Alan Dávalos    schedule 25.02.2016

Я использую полимер с angular 2, и вот как я пытаюсь добавить анимацию:

if (dialog) {
        dialog.animationConfig = {
            'entry': {
                name: 'transform-animation',
                node: dialog,
                transformFrom: 'translateY(100%)',
                transformTo: 'translateY(0)'
            },
            'exit': {
                name: 'transform-animation',
                node: dialog,
                transformFrom: 'translateY(0)',
                transformTo: 'translateY(100%)'
            }
        };
        dialog.open();
    }
person Khoa    schedule 13.01.2016
comment
Это не похоже на ответ. - person Günter Zöchbauer; 14.01.2016