HarmonyOS 基于FrameNode 有办法操作动画吗，现在需要在构建 frameNode 的过程中就完成动画的绑定？

Question

如题：HarmonyOS 基于FrameNode 有办法操作动画吗，现在需要在构建 frameNode 的过程中就完成动画的绑定？

Answer 1

参考代码：

import { FrameNode, NodeController, typeNode } from '@kit.ArkUI';

class TestNodeController extends NodeController {
  public rootNode: FrameNode | null = null;
  public columnNode: typeNode.Column | null = null;
  public columnWH: string | number = 100

  makeNode(uiContext: UIContext): FrameNode | null {
    if (this.rootNode == null) {
      this.rootNode = new FrameNode(uiContext);
      this.rootNode.commonAttribute
        .width('100%')
        .layoutWeight(1)
    }
    if (this.columnNode == null) {
      this.columnNode = typeNode.createNode(uiContext, 'Column')
      this.columnNode.initialize()
        .width(100)
        .height(100)
        .backgroundColor(Color.Pink)
    }

    this.rootNode.appendChild(this.columnNode)
    return this.rootNode
  }

  play(finishWidth: number) {
    animateTo({ duration: 300 }, () => {
      this.columnNode?.attribute.width(finishWidth)
      this.columnNode?.attribute.height(finishWidth)
    })
  }
}


@Entry
@Component
struct Page240828171321112 {
  private testNodeController: TestNodeController = new TestNodeController()

  build() {
    Column() {
      NodeContainer(this.testNodeController)
      Button('play').onClick(() => {
        this.testNodeController.play(200)
      })
    }
    .height('100%')
    .width('100%')
  }
}