サイドメニューとモーダルのアニメーションが独自のアニメーションよりも速い

Question

アウトとインライディングのサイドメニューのアニメーションまたはボトム（Ionic2モーダル）からのモーダルボックスの移動は非常に速く滑らかです。

浮動アクションボタンのために私自身のアニメーションを定義しました。このアニメーションは、イオンアニメーションよりもかなり遅いです。違いはなんですか？

なぜ私のアニメーションは少し鈍いですか？

animations: [ 
    trigger('heroState', [ 
     state('false', style({ 
     right: '-500px', 
     })), 
     state('true', style({ 
     right: '0px', 
     })), 
     transition('false => true', animate('500ms ease-in')), 
     transition('true => false', animate('500ms ease-out')) 
    ]) 
    ], 

Answer 1

@rakete：モーダルアニメーションよりも速度を制御するために、イオンキューブのベジェをイオンで使用すると思います。これらを次のように試すことができますか？

transition('false => true', animate('500ms cubic-bezier(0.65, 0.05, 0.36, 1)') 

そして

transition('false => true', animate('500ms cubic-bezier(0.36, 0.66, 0.04, 1)') 

続きを読む：Cubic Bezier
Codepen：cubic-bezier(0.36, 0.66, 0.04, 1)