HarmonyOS 鸿蒙Next NodeRender 问题

import { RenderNode, FrameNode, NodeController } from "@ohos.arkui.node";

const renderNode = new RenderNode();
renderNode.frame = {
  x: 0,
  y: 0,
  width: 100,
  height: 100
};
renderNode.backgroundColor = 0xffff0000;

class MyNodeController extends NodeController {
  private rootNode: FrameNode | null = null;

  makeNode(uiContext: UIContext): FrameNode | null {
    this.rootNode = new FrameNode(uiContext);
    const rootRenderNode = this.rootNode.getRenderNode();
    if (rootRenderNode !== null) {
      rootRenderNode.appendChild(renderNode);
    }
    return this.rootNode;
  }
}

@Entry
@Component
struct Index {
  private myNodeController: MyNodeController = new MyNodeController();

  build() {
    Row() {
      NodeContainer(this.myNodeController)
    }
  }
}

想要这个render占满父组件的宽、
高要怎么做

更多关于HarmonyOS 鸿蒙Next NodeRender 问题的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html

sinazl 1楼•5 个月前

试试看行不行

 
 import { UIContext } from '[@ohos](/user/ohos).arkui.UIContext';
import { NodeController, BuilderNode, FrameNode } from "[@ohos](/user/ohos).arkui.node"

class Params {
  text: string = ""
  constructor(text: string) {
    this.text = text;
  }
}

[@Builder](/user/Builder)
function buildText(params: Params) {
  Column() {
    Text(params.text)
      .fontSize(50)
      .fontWeight(FontWeight.Bold)
      .margin({ bottom: 36 })
      .width('100%')
      .height('100%')
      .backgroundColor(Color.Green)
  }
}

class TextNodeController extends NodeController {
  private rootNode: FrameNode | null = null;
  private textNode: BuilderNode<[Params]> | null = null;
  private message: string = "";

  constructor(message: string) {
    super()
    this.message = message
  }

  makeNode(context: UIContext): FrameNode | null {
    this.textNode = new BuilderNode(context);
    this.textNode.build(wrapBuilder<[Params]>(buildText), new Params(this.message))
    return this.textNode.getFrameNode();
  }
}

[@Entry](/user/Entry)
[@Component](/user/Component)
struct Index {
  [@State](/user/State) message: string = "hello"
  private textNodeController: TextNodeController = new TextNodeController(this.message);
  build() {
    Row() {
      Column() {
        NodeContainer(this.textNodeController)
          .width('60%')
          .height('30%')
          .backgroundColor('#ffe54949')
      }
      .width('100%')
      .height('100%')
    }
    .height('100%')
  }
}

更多关于HarmonyOS 鸿蒙Next NodeRender 问题的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html

nodeper 2楼•5 个月前

针对HarmonyOS 鸿蒙Next NodeRender的问题，以下是一些专业的解答：

RenderNode是HarmonyOS NEXT中一个轻量级的渲染节点，它专注于提供渲染相关的能力，并允许开发者自定义绘制内容。RenderNode支持设置多种渲染属性，如backgroundColor、size、position等，并提供了节点的增、删、查、改功能。

若要在HarmonyOS NEXT中使用RenderNode，首先需要创建RenderNode实例，并通过其提供的接口设置渲染属性和子节点。RenderNode可以与FrameNode结合使用，通过将RenderNode挂载到FrameNode上实现与原生组件的结合显示。

此外，RenderNode还支持自定义绘制，开发者可以通过重写RenderNode的draw方法来实现自定义绘制逻辑。同时，RenderNode提供了invalidate接口，可以主动触发节点的重新绘制。

如果在使用RenderNode过程中遇到问题，建议检查以下几点：

确保RenderNode的属性设置正确。
检查RenderNode与FrameNode的结合方式是否正确。
验证自定义绘制逻辑是否正确实现。

如果问题依旧没法解决请联系官网客服，官网地址是：https://www.itying.com/category-93-b0.html 。