LiteGraph实现添加节点内Widget文本数值布尔选择框效果代码-html代码-BFW代码库

LiteGraph实现添加节点内Widget文本数值布尔选择框效果代码

代码语言：html

所属分类：其他

代码描述：LiteGraph实现添加节点内Widget文本数值布尔选择框效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">
  
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/litegraph.1.0.css">
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/litegraph.1.0.js"></script>
  
  
  
<style>
body {
  font-family: sans-serif;
  width: 100%;
  height: 100%;
}

#mycanvas {
  border: 1px solid;
}
</style>


  
  
</head>



<body>

  <canvas id='graphcanvas' width='1024' height='720'></canvas>

  
      <script >
// 自定义节点类
function CustomNode() {
    this.addInput("input", "number");
    this.addOutput("output", "number");
    this.properties = {
        text: "Default text",
        number: 0,
        boolean: false,
        combo: "option1",
       
    };

    // 添加文本输入框小部件
    this.addWidget("text", "Text", this.properties.text, (value) => {
        this.properties.text = value;
    });

    // 添加滑块小部件
    this.addWidget("slider", "Number", this.properties.number, (value) => {
        this.properties.number = value;
    }, { min: 0, max: 100 });

    // 添加复选框小部件
    this.addWidget("toggle&qu.........完整代码请登录后点击上方下载按钮下载查看