1# 显式动画立即下发 (animateToImmediately)(系统接口) 2 3animateToImmediately接口用来提供[显式动画](ts-explicit-animation.md)立即下发功能。同时加载多个属性动画的情况下，使用该接口可以立即执行闭包代码中状态变化导致的过渡动效。 4 5> **说明：** 6> 7> 从API Version 11开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。 8> 9> 本模块为系统接口 10 11animateToImmediately(value: [AnimateParam](ts-explicit-animation.md#animateparam对象说明) , event: () => void): void 12 13| 参数 | 类型 | 是否必填 | 描述 | 14| ----- | --------------------------------- | ---- | ------------------------------------- | 15| value | [AnimateParam](ts-explicit-animation.md#animateparam对象说明) | 是 | 设置动画效果相关参数。 | 16| event | () => void | 是 | 指定显示动效的闭包函数，在闭包函数中导致的状态变化系统会自动插入过渡动画。 | 17 18## 示例 19 20```ts 21// xxx.ets 22@Entry 23@Component 24struct AnimateToImmediatelyExample { 25 @State widthSize: number = 250 26 @State heightSize: number = 100 27 @State opacitySize: number = 0 28 private flag: boolean = true 29 30 build() { 31 Column() { 32 Column() 33 .width(this.widthSize) 34 .height(this.heightSize) 35 .backgroundColor(Color.Green) 36 .opacity(this.opacitySize) 37 Button('change size') 38 .margin(30) 39 .onClick(() => { 40 if (this.flag) { 41 animateToImmediately({ 42 delay: 0, 43 duration: 1000 44 }, () => { 45 this.opacitySize = 1 46 }) 47 animateTo({ 48 delay: 1000, 49 duration: 1000 50 }, () => { 51 this.widthSize = 150 52 this.heightSize = 60 53 }) 54 } else { 55 animateToImmediately({ 56 delay: 0, 57 duration: 1000 58 }, () => { 59 this.widthSize = 250 60 this.heightSize = 100 61 }) 62 animateTo({ 63 delay: 1000, 64 duration: 1000 65 }, () => { 66 this.opacitySize = 0 67 }) 68 } 69 this.flag = !this.flag 70 }) 71 }.width('100%').margin({ top: 5 }) 72 } 73} 74``` 75 76 77
