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