ArkTS cards open up the ability to use animation effects, and support explicit animation, property animation, and transition capabilities within components. It should be noted that ArkTS cards have the following limitations when using animation effects:
The following sample code implements the animation effect of button rotation:
@Entry
@Component
struct AttrAnimationExample {
@State rotateAngle: number = 0;
build() {
Column() {
Button('change rotate angle')
.onClick(() => {
this.rotateAngle = 90;
})
.margin(50)
.rotate({ angle: this.rotateAngle })
.animation({
curve: Curve.EaseOut,
playMode: PlayMode.AlternateReverse
})
}.width('100%').margin({ top: 20 })
}
}