• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1# FrameNode
2
3FrameNode表示组件树的实体节点。[NodeController](./js-apis-arkui-nodeController.md#nodecontroller)可通过[BuilderNode](./js-apis-arkui-builderNode.md#buildernode)持有的FrameNode将其挂载到[NodeContainer](arkui-ts/ts-basic-components-nodecontainer.md#nodecontainer)上,也可通过FrameNode获取[RenderNode](./js-apis-arkui-renderNode.md#rendernode),挂载到其他FrameNode上。
4
5> **说明:**
6>
7> 本模块首批接口从API version 11开始支持。后续版本的新增接口,采用上角标单独标记接口的起始版本。
8>
9> 当前不支持在预览器中使用FrameNode节点。
10
11## 导入模块
12
13```ts
14import { FrameNode } from "@ohos.arkui.node";
15```
16
17## FrameNode
18
19### constructor
20
21constructor(uiContext: UIContext)
22
23FrameNode的构造函数。
24
25**系统能力:** SystemCapability.ArkUI.ArkUI.Full
26
27**参数:**
28
29| 参数名    | 类型                                      | 必填 | 说明                               |
30| --------- | ----------------------------------------- | ---- | ---------------------------------- |
31| uiContext | [UIContext](./js-apis-arkui-UIContext.md) | 是   | 创建对应节点时候所需要的UI上下文。 |
32
33### getRenderNode
34
35getRenderNode(): RenderNode | null
36
37获取FrameNode中持有的RenderNode。
38
39**系统能力:** SystemCapability.ArkUI.ArkUI.Full
40
41**返回值:**
42
43| 类型                                                           | 说明                                                                  |
44| -------------------------------------------------------------- | --------------------------------------------------------------------- |
45| [RenderNode](./js-apis-arkui-renderNode.md#rendernode) \| null | 一个RenderNode对象。若该FrameNode不包含RenderNode,则返回空对象null。 |
46
47### 示例
48
49```ts
50import { NodeController, FrameNode } from '@ohos.arkui.node';
51
52class MyNodeController extends NodeController {
53  private rootNode: FrameNode | null = null;
54
55  makeNode(uiContext: UIContext): FrameNode | null {
56    this.rootNode = new FrameNode(uiContext);
57
58    const renderNode = this.rootNode.getRenderNode();
59    if (renderNode !== null) {
60      renderNode.size = { width: 100, height: 100 };
61      renderNode.backgroundColor = 0XFFFF0000;
62    }
63
64    return this.rootNode;
65  }
66}
67
68@Entry
69@Component
70struct Index {
71  private myNodeController: MyNodeController = new MyNodeController();
72
73  build() {
74    Row() {
75      NodeContainer(this.myNodeController)
76    }
77  }
78}
79```