NativeScript Vue Directive Part 1: Animation | NativeScript Tutorial

In this NativeScript-Vue tutorial, I'll show you how to create a reusable directive that we'll apply to a card UI. Here we'll create an animation directive using NativeScript animation APIs.

(Take 15% off any premium NativeScript course by using the coupon code YT2020)

— — — — — — — — —

❤️ SUBSCRIBE TO MY YOUTUBE CHANNEL 📺

— — — — — — — — —

🔧GEAR I USE

Below is a list of gear I use to film my YouTube videos and courses.
(Some links below are affiliate links.)

🎥 CAMERAS

👓 LENSES

🎤 AUDIO

- Aphex 107 Tube Mic Preamp (no link)
- Focusrite Compounder (no link)

💡 LIGHTING

OTHER STUFF
— — — — — — — — —

🏫 FREE COURSES

— — — — — — — — —

📱LET'S CONNECT ON SOCIAL MEDIA

[adetayoadeyemi]

This is why I love vue, everything in one place

[AchrafBardan]

thank you sooo much your videos are just soo amazing.

[alexandermarkov]

Alex, big thanks for NS Vue tutorials!!!

[wadday]

I love the background music .. it really rocks my night on nativescripting. :)

[yuvoria.official]

The best part i was waiting... So good

[ndrwum]

Thank you for using vue... and without typescript.

[feyokorenhof]

Do you have any tips on fixing the little differences between platforms. Like the 'up' touch gesture not firing correctly on android when swiping away from the element. I am currently trying to create a little cleanup method that just resets the animation back to the original state after a few seconds (or ideally after a new 'up' touch gesture). I do enjoy figuring stuff out on my own but it would help me a lot if I knew where to find relative docs. I know there are vue docs, nativescript docs and nativescript-vue docs but I always struggle to find what I am looking for. I hope you understand my question, I would be happy to clear up my question a bit more :)

[corneliussimon]

Hey Alex...thanks for the tutorial. Great content. I noticed you were able to see your progress on both an iOS and Android emulator. How are you able to do this on a Mac? I develop on Windows and would love to have both emulators running. Is this possible on Windows?

[pazfelipe]

Could you show us how to animate elements inside a listview? I've tried to make a slideIn/Out effect but no success

[carloshincapiefernandez]

Hi Alex, thanks for your excellent videos. I've noticed that using this directive over various elements of the same type (in lists or tabs), the vue's logs shows me this warning "You may have an infinite update loop in a component render function".
Do you know why this happens and how I could fix it?.
PD: Touching the element that has the v-touchScale directive I can see the double animation and the UI puts slow.
Thanks in advance Alex :)

[robertino.m]

I can't believe it! No xml/angular/typescript just vue and vanilla js, my favourites... what's up with you Alex? Whatever it might be I hope it lasts :-)

[yuvoria.official]

How to faster new page with complex Component

[pazfelipe]

Thank you so much, Alex. Could you recreate nubank or uber app using vue?

[SaiyanJin]

Thanks Alex although I prefer angular lol. I have a question not related to this video, have you noticed any performance differences between n-vue and n-angular? For example in navigation or the speed tap events . Maybe you could a video on that . Thanks again

[alyradwan]

I am using Nox as an android emulator
what is the best emulator for ios ?