How to Add Animations To Your Ionic App (2 Different Ways!)

[@carlesalbertnavedapallares1272]

Thanks for the video!!! :)) Amazing work for the community!!

[@galaxies_dev]

Carles Albert Naveda Pallares thank you so much :)

[@jhaxpebel]

hi, I have a problem : ERROR TypeError: Cannot read property 'nativeElement' of undefined , I don't understand why

[@adir191]

Hey simon , thank you for awesome tutorial! can you please explain how to make transition when navigate to other page?

[@atheerahassan5052]

i am getting a StaticInjectError [AnimationService]; NullInjectorError: No provider for AnimationService how to solve this, sir? :(

[@abirhasanzoha1291]

great tutorial. I have a question in my mind. Can I use angular router animation in ionic? specificly how can I change ionic page animation(animation when a page pushed)

[@DarwinMedinaJoxieMedina]

Which way is more compatible with ios ? and android phones 4.4 ?

[@bryanrodriguezsiatama1511]

Hi Simon, great video. About a third way, using only css transitrions for example to simple animations, is need polifyll to correctly function in ios browsers as well?

[@gabrielsdsdsd]

Hi, thanks for the video! 😀 I'm implementing the 2º method... If I use the animation in an item inside a grid, the rows below the animated items go up and hide the items while the animation. Do you have any idea of how to resolve this issue? Thanks

[@aomo5293]

Thank you Morocco

[@AjoykarmakarReal]

You are great, thanksssssss for this tutorial!

[@bobthebuilder6715]

Hi Simon and Everyone, Great content! I'm an ionic developer but I get stuck on creating a solid Ionic 2/3 workflow for quality product development especially when working in teams and we creating an Ionic app. Do you have any workflow suggestions? For example, at the movement, my workflow is Jtest for unit testing, Airbnb ESLint style, and on our repo we have a Docker container that runs test and builds before we can merge to the production branch but I'm still not sure if this is rock solid because we don't sign the apk file on that is build on the cloud, anyway I just wanna hear your suggestions on a solid workflow for production app for ionic applications

[@rebarius]

Love your Videos!!! Thanks :))))

[@DnsMenjivar]

This is the new command to install Angular Animations: npm i @angular/animations@latest

[@TheSILVERVEVO]

hi Simon , please can you make a tutorial about how to send photos from ionic to MySQL php server ? I found an tutorial in your website but it needs update , thanks

[@CrackDeltaMX]

itsSilver you Need to develope an API REST service...

[@shashankb4835]

Lots of thanks! I was looking for some out of the box animation that I could use native with ionic. Dose it works with angular 2 too lol

[@galaxies_dev]

It's for Ionic 2/3 so it should work with Angular 2 I think!

[@MrMu2sS]

Thanks

[@marwansalem76]

it doesnt work with ionic3 [INFO] Running app-scripts build: --platform android --target cordova [21:29:37] build dev started ... [21:29:37] clean started ... [21:29:37] clean finished in 3 ms [21:29:37] copy started ... [21:29:37] transpile started ... [21:29:43] typescript: D:/EDUMASR/mobile apps/HSC/mobile3/src/pages/posts-page/posts-page.ts, line: 26 Cannot find name 'AnimationBuilder'. L25: adultpost:boolean; L26: private animator: AnimationBuilder; L27: @ViewChild('myElement') myElem; [21:29:43] typescript: D:/EDUMASR/mobile apps/HSC/mobile3/src/pages/posts-page/posts-page.ts, line: 29 Cannot find name 'AnimationService'. L29: ing: LoadingController, public actionSheetCtrl: ActionSheetController, animationService: AnimationService) { Error: Failed to transpile program at BuildError.Error (native) at new BuildError (D:\EDUMASR\mobile apps\HSC\mobile3 ode_modules\@ionic\app-scripts\dist\util\errors.js:16:28) at D:\EDUMASR\mobile apps\HSC\mobile3 ode_modules\@ionic\app-scripts\dist\transpile.js:137:20 at transpileWorker (D:\EDUMASR\mobile apps\HSC\mobile3 ode_modules\@ionic\app-scripts\dist\transpile.js:103:12) at Object.transpile (D:\EDUMASR\mobile apps\HSC\mobile3 ode_modules\@ionic\app-scripts\dist\transpile.js:61:12) at buildProject (D:\EDUMASR\mobile apps\HSC\mobile3 ode_modules\@ionic\app-scripts\dist\build.js:97:78) at D:\EDUMASR\mobile apps\HSC\mobile3 ode_modules\@ionic\app-scripts\dist\build.js:47:16 any suggestion!

[@MrMu2sS]

It works just fine with ionic 3 ! (ng4) If you can't make it work, that doen't mean that it doesn't wok with ionic3.

[@typingcat]

Voice volume too low.