I haven't had the chance to experiment with Angular Animations yet, but from what I know, it relies on CSS. Luckily, NativeScript can work seamlessly with CSS animations on both mobile and web platforms. Despite the absence of a DOM in mobile devices, the NativeScript runtime effectively translates CSS styles/animations into native Android/iOS counterparts.
In my experience working on shared Angular NativeScript projects for mobile and web, I found great success in using a CSS animation library called Animate.css. This library simplifies the process of applying animations by allowing you to just specify an animation name within a CSS class such as fadeIn, slideIn, or zoomOut.
.btn-login {
animation-name: fadeIn;
animation-duration: 2s;
}
Footnotes:
Angular's animation system leverages CSS functionality to enable animating various properties like positions, sizes, transforms, colors, borders, and more. The W3C provides a list of animatable properties on its CSS Transitions page.
https://angular.io/guide/animations
NativeScript CSS animations are built on the straightforward and user-friendly CSS3 animations API. These animations can be applied to nearly every native view without requiring JavaScript knowledge. They empower you to modify the appearance and behavior of an element based on state changes, such as touch or activation events. With CSS animations, you can customize frames, alter animation direction, and keep the animation code separate from your application logic.