UIOTOS 初体验:指定沿轨迹运动 | 页面嵌套 零代码 低代码 0代码 无代码 iframe 数据大屏 web组态 前端框架 | 致敬amis codewave 乐吾乐 goview dataRoom等

注意:本文为自动抓取供AI学习!!格式未经调整,点击[查看原文档](https://www.yuque.com/liuhuo-nc809/uiotos/dezlgo89i8epihg5?singleDoc# 《初体验:指定沿轨迹运动》)!

效果

随意画一条曲线(或管道),任意图标能沿着轨迹运动,如下所示:
20240819163435_rec_.gif

步骤

新建

参见1新建。命名为"初体验-沿轨迹运动"

拖入组件

拖入按钮定时器、工具函数(透明传递)组件以及叉车图标,并绘制管道
各组件位置 image.png image.png image.png image.png image.png
按钮设置(可忽略)外观-文字设置开始
image.png
工具函数设置

其他属性保持默认值即可。

image.png
定时器设置间隔周期设置为10
image.png
管道绘制绘制如下(轨道),参见管道
image.png

连线操作

步骤1:按钮点击,开启定时器不关联属性(按钮)→开启定时器)。
20240819105405_rec_.gif
步骤2:定时器周期执行函数不关联属性(定时器)→ 执行定时自增)。
20240819163023_rec_.gif
步骤3:设置图标的拓扑连线右键菜单,选择连线-拓扑连线,从叉车图标指向管道。如下所示:
20240819152004_rec_.gif
步骤4:动态设置图标的轨迹属性输出定时自增)→ 轨迹进度值(叉车)。

注意:前面有勾选输出合并非覆盖。这步很关键。

20240819163201_rec_.gif
步骤如下:

图标与任意曲线拓扑连线后,图标就会新增一个轨迹属性,该属性可以填入0~100,对应轨迹百分比位置。

20240819163307_rec_.gif


搭建完毕!

注意:测试运行时,会发现轨迹走完时,图标会跑偏。此时可以加上复位设置,参见下面附加内容。

附加(可忽略)

加上下面设置,实现轨迹跑完后,回到原点继续移动,避免结束后跑偏。
image.png
步骤如下:

拖入组件

拖入透明传递基本数学计算条件逻辑判断函数,并属性设置
image.png
“输出值”函数设置image.png

image.png
“复位为0”函数设置image.png

image.png
“与100比较”函数设置image.png

image.png
“相比大于时”函数设置image.png

image.png

连线操作

前面步骤2定时自增,超过100就出界了。现在增加判断,值大于100就复位,依次往复。以下就从步骤3起。

步骤3:对值定时自增输出定时自增)→ 输入(组)输出值)。

注意:前面有勾选输出合并非覆盖。这步很关键。

20240819164620_rec_.gif
步骤4:值与100比较输出输出值)→ 输入(组)与100比较)。
20240819164843_rec_.gif
步骤5:判断比较结果输出与100比较)→ 输入(组)相比大于时
20240819165057_rec_.gif
步骤6:大于100就复位输出相比大于时)→ 输入(组)复位为0
20240819165710_rec_.gif
步骤7:复位为初始0输出(复位为0)→输入(组)(输出值
20240819170710_rec_.gif
步骤8:图标拓扑连线略。与之前的步骤3一样。
步骤9:输出轨迹位置。输出透明传递2)→ 轨迹进度值(叉车)
20240819171114_rec_.gif
步骤如下:
20240819171347_rec_.gif
最终效果:
20240819171612_rec_.gif

posted @   一路火花带闪电Plus  阅读(14)  评论(0编辑  收藏  举报
编辑推荐:
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
阅读排行:
· 震惊!C++程序真的从main开始吗?99%的程序员都答错了
· 【硬核科普】Trae如何「偷看」你的代码?零基础破解AI编程运行原理
· 单元测试从入门到精通
· 上周热点回顾(3.3-3.9)
· winform 绘制太阳,地球,月球 运作规律
点击右上角即可分享
微信分享提示