Ionic 5 checkbox spin animation

Hi folks,

I’m playing around Ionic 5 animations and here is some interesting aproach for checkbox

for .html file:

<ion-checkbox slot="start" class="ion-checkbox" (click)="playCheckboxAnimation($event)"></ion-checkbox>

For .ts file:

playCheckboxAnimation(event): void{
    console.log(event);
    const animation: Animation = createAnimation('')
      .addElement(event.srcElement)
      .easing('cubic-bezier(0, 0.55, 0.45, 1)')
      .duration(500)
      .fromTo('transform', 'rotate(0)', 'rotate(360deg)');
    animation.play();
  }

1 post - 1 participant

Read full topic