Are you looking for creating nice animation within an Angular application? Have you heard about TweenJs from CreateJs? If not then take a moment to visit below website.
A suite of modular libraries and tools which work together or independently to enable rich interactive content on open…
In this story, we will try to integrate TweenJs with Angular (v6).
- Create a new Angular project using ng cli
index.htmlfile and add TweenJs reference in head section
app.component.html file and add below code
<button (click)="start()">Start</button><button (click)="stop()">Stop</button><canvas id="demoCanvas" width="500" height="200"></canvas>
app.component.ts file and below code in
ng serve --open command and observe the browser.
6. Click on
start button and observe a circle moving inside browser. Click on
stop button and circle will stop moving.
You can go through TweenJs documentations to check other animations and features.
GitHub code is here:
ng-tweenjs-demo - Integrating Tweenjs animation with Angular 6