Data-Shape制作UI节点简介

很多小伙伴对于Data-Shape制作简单的UI都是似懂非懂,群里很多小伙伴也总是询问相关的问题,那么,今天我就简单举几个例子,专门介绍下Data-Shape创建简单UI的教程。

首先,本次教程,使用的是Data-Shape 2021.2.91版本的节点包,和低版本稍微有些出入,小伙伴们可以自行更新,也可以到公众号里回复“节点包”获取。
 

新版的节点包UI分组进行了重新排列,如下图:

由分组就可以看出,MultipleInputForm ++节点是创建UI的关键所在。

我们先来做个简单的UI,给大家演示一下:
 

如图,我们这里做了一个下拉列表的UI,可以选择族类别,我们来看看这个UI是怎么做的:

放大一下:

如上图,我把每个输入端,前面都做了注释,大家可以对照着看下,有的有默认值,我这里只是为了便于说明,都给连上了。
 

这里面有几个关键输入,是必须有的,分别是:

(1)Inputs,这里是我们UI要做的东西,也是主要的数据输入,而且这里还不能随便连,必须是Data-Shape预设好的节点,就是UI分组下的,子分组的内容,例如我们上面做的是下拉菜单,就需要一个DropDown Date节点,意思是下拉列表数据输入;

(2)Toggle,这个输入是告诉程序是否运行,默认是false,需要运行的时候,需要给他一个true值;

其他的默认空,程序也是可以运行的哦~但是就会变成下面这幅模样:
 

接下来,就是如何使用UI得到的数据,MultipleInputForm ++后面有个User Inputs,就是最终用户输入的数据,如果是单数据,我们直接使用即可,如果是多个输入端,我们就要用Code Block节点,来拆分一下输入的数据,分别使用:

好了,到这里,一个基本的流程就完事了,之所以需要按照Date-Shape里的节点作为输入才行,是因为MultipleInputForm ++的代码里,对Inputs这里的输入的数据,进行了判断,哪个节点,对应输出什么结果,都是固定的,有兴趣的小伙伴,可以编辑下节点看看代码,可以直接对某些输入端进行汉化处理。

提示:
 

这里提示一下,当需要在一个UI里有多个输入的时候,需要将多个输入端,合并为一个列表,并用Flatten节点,将输入列表拍平,不然无法创建UI。

简单举个例子,同时给三个输入端,分别是列表,布尔值和点选模型:

运行后弹出如下UI界面,点击选择模型后,会弹出提示,选择墙后按Esc退出:

效果就是这样了基本上。

接下来简单给大家理一理,都有哪些UI节点:

(1)图表类,包括饼图、折线图、点图等:


 

效果如图:

(2)UI.Color.ByArgbUI,这个本身就是做好的UI界面,直接选择颜色即可:

(3)Input,这里就是我们常用的UI输入端,如下图:

基本都是字面意思,感觉没啥可讲的了

(4)Selection,都是一些选择节点,需要点击按钮或者直接UI选择:
 

按照上面案例里,简单连一个就行。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/408126.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

队列基础练习(C语言实现)

目录 队列基础练习 用队列实现栈 用栈实现队列 设计循环队列 队列基础练习 用队列实现栈 题目链接:225. 用队列实现栈 - 力扣(LeetCode) 请你仅使用两个队列实现一个后入先出(LIFO)的栈,并支持普通栈的全部…

政安晨【示例演绎虚拟世界开发】(一):Cocos Creator 的 Hello World

政安晨的个人主页:政安晨 欢迎 👍点赞✍评论⭐收藏 收录专栏: AI虚拟世界大讲堂 希望政安晨的博客能够对您有所裨益,如有不足之处,欢迎在评论区提出指正。 前言 Cocos Creator是一款非常强大的游戏开发引擎,它有着优秀…

基于springboot+vue的安康旅游网站(前后端分离)

博主主页:猫头鹰源码 博主简介:Java领域优质创作者、CSDN博客专家、阿里云专家博主、公司架构师、全网粉丝5万、专注Java技术领域和毕业设计项目实战,欢迎高校老师\讲师\同行交流合作 ​主要内容:毕业设计(Javaweb项目|小程序|Pyt…

洛谷P5723 质数口袋 题解

#题外话&#xff08;第39篇题解&#xff09;&#xff08;本题为普及-难度&#xff09; #先看题目 题目链接https://www.luogu.com.cn/problem/P5723 #思路&#xff08;看代码吧&#xff09; #代码 #include <bits/stdc.h> using namespace std; bool p(int p_i){for(i…

啊丢的刷题记录手册

1.洛谷题P1923 求第k小的数 题目描述 输入 n&#xff08;1≤n<5000000 且 n 为奇数&#xff09;个数字ai​&#xff08;1≤ai​<109&#xff09;&#xff0c;输出这些数字的第 k 小的数。最小的数是第 0 小。 请尽量不要使用 nth_element 来写本题&#xff0c;因为本题…

《优化接口设计的思路》系列:第八篇—分页接口的设计和优化

系列文章导航 第一篇—接口参数的一些弯弯绕绕 第二篇—接口用户上下文的设计与实现 第三篇—留下用户调用接口的痕迹 第四篇—接口的权限控制 第五篇—接口发生异常如何统一处理 第六篇—接口防抖(防重复提交)的一些方式 第七篇—接口限流策略 第八篇—分页接口的设计和优化 …

C语言实现简单选择排序

简单选择排序 简单选择排序的平均复杂度为 O(n2),但效率通常比相同平均复杂度的直接插入排序还要差。但由于选择排序是 内部排序&#xff0c;因此在内存严格受限的情况下还是可以用的。选择排序的原理很简单&#xff0c;如下图所示&#xff1a;持续从未处理元素中找到最小值并加…

虚拟机的四种网络模式对比

nat网络地址转换 nat网络 桥接 内网模式 仅主机

【数据结构(顺序表)】

一、什么是数据结构? 数据结构是由“数据”和“结构”两词组合而来。 什么是数据&#xff1f;常见的数值1、2、3、4.....、教务系统里保存的用户信息&#xff08;姓名、性别、年龄、学历等等&#xff09;、网页里肉眼可以看到的信息&#xff08;文字、图片、视频等等&#xff…

Google炸场!最强轻量级、开放模型Gemma发布,个人PC就能用,内部员工:强是强,但名字取得让我混乱

想参与根多多学术讨论&#xff0c;请加qq群 链接直达&#xff1a;00后编程交流qq群 如果想要聊天交友&#xff0c;可以加qq群 链接直达&#xff1a;00后聊天交友处cp 欢迎大家加入 不同于OpenAI的闭源大模型&#xff0c;科技巨头如Google和Meta正积极投入开放模型的开发&a…

Qt的QFileSystemModel与QTreeView、QTableView、QListView的组合使用

1.相关描述 QFileSystemModel与QTreeView、QTableView、QListView的组合&#xff0c;当QTreeView点击发生改变&#xff0c;QTableView和QListView也会发生变化 2.相关界面 3.相关代码 mainwindow.cpp #include "mainwindow.h" #include "ui_mainwindow.h"…

Flutter开发进阶之Package

Flutter开发进阶之Package 通常我们在Flutter开发中需要将部分功能与整体项目隔离&#xff0c;一般有两种方案Plugin和Package&#xff0c;Application是作为主体项目&#xff0c;Module是作为原生项目接入Flutter模块。 当独立模块不需要与原生项目通讯只需要Plugin就可以&a…

990-05产品经理:为什么商业价值是 IT 成功的关键

In today’s digital era, CIOs must shift(转移) their priorities from cost cutting to driving revenue(收入), and from process engineering to exploiting data if they want to achieve a set of broader business outcomes. Furthermore, understanding how to measur…

讯度云网络云服务器商

讯度云网络云服务器商 讯度云服务商能够为客户提供安全、稳定、高性能的云计算服务确保数据的安全性和可靠性而且有良好的用户反馈与评价靠着良好的 高防国内云/十堰/海外/美国/G口/香港/日本/物理机/挂机宝/大量有货香港4-4 20元起 亚太scdn节点50 0.01起&#xff01;&#x…

计网 - 深入理解HTTPS:加密技术的背后

文章目录 Pre发展历史Http VS HttpsHTTPS 解决了 HTTP 的哪些问题HTTPS是如何解决上述三个风险的混合加密摘要算法 数字签名数字证书 Pre PKI - 数字签名与数字证书 PKI - 借助Nginx 实现Https 服务端单向认证、服务端客户端双向认证 发展历史 HTTP&#xff08;超文本传输协…

Yolo v9 “Silence”模块结构及作用!

论文链接&#xff1a;&#x1f47f; YOLOv9: Learning What You Want to Learn Using Programmable Gradient Information 代码链接&#xff1a;&#x1f47f; https://github.com/WongKinYiu/yolov9/tree/main Silence代码 class Silence(nn.Module):def __init__(self):supe…

win10开机黑屏,只有鼠标,解决方案

问题描述 win10进不去桌面&#xff0c;可以进去锁屏&#xff0c;只有鼠标&#xff0c;也能进去任务管理器&#xff08;ctrlwindelete&#xff09;, 问题分析 进入任务管理器->文件->运行新任务 然后输入 explorer.exe 发现找不到了 原因&#xff1a;误删explorer.exe …

AI时代显卡如何选择,B100、H200、L40S、A100、H100、V100 含架构技术和性能对比

AI时代显卡如何选择&#xff0c;B100、H200、L40S、A100、H100、V100 含架构技术和性能对比。 英伟达系列显卡大解析B100、H200、L40S、A100、A800、H100、H800、V100如何选择&#xff0c;含架构技术和性能对比带你解决疑惑。 近期&#xff0c;AIGC领域呈现出一片繁荣景象&a…

SpringMVC 学习(三)之 @RequestMapping 注解

目录 1 RequestMapping 注解介绍 2 RequestMapping 注解的位置 3 RequestMapping 注解的 value 属性 4 RequestMapping 注解的 method 属性 5 RequestMapping 注解的 params 属性&#xff08;了解&#xff09; 6 RequestMapping 注解的 headers 属性&#xff08;了解&…

检索增强生成(RAG) — 高级提示工程方法

Thread of Thought&#xff0c;ThoT Thread of Thought Unraveling Chaotic Contexts 大型语言模型&#xff08;LLMs&#xff09;在自然语言处理领域开启了一个变革的时代&#xff0c;在文本理解和生成任务上表现出色。然而&#xff0c;当面对混乱的上下文环境&#xff08;例…