前端零代码-技术原理：对话框嵌套和自定义按钮| uiotos致敬amis、appsmith、codewave、goview、dataroom、iotrouter、FUXA、乐吾乐、dooring等

合集 - UIOTOS(18)

1.UIOTOS前端零代码 第5节：（实践）嵌套+连线0开发扩展组件，实现切换开关控制扇叶转动2024-04-092.UIOTOS零代码开发一个仿Window简单计算器2024-04-103.UIOTOS前端零代码 第7节：（实践）利用嵌套+收发器组件，零代码实现简单计算器功能2024-04-104.回顾发展史，WEB组态终于可以搭建业务系统了！2024-04-225.2024了还在用Qt、PyQt做图形界面？致敬Qt Designer，这款前端无代码拖拽工具值得一用！2024-04-226.NodeRed节点编辑用于边缘计算和规则引擎，能做带UI界面和业务逻辑的上位机或前端应用吗？2024-04-227.刚交付了智慧园区统一管理平台，前端零代码+后端零代码+物联网平台，完美搭配！（一）2024-04-228.最新零代码，套娃一样开发IoT应用！2024-08-299.一觉醒来，Qt、C#界面开发的天塌了？2024-09-1010.NodeRed+UIOTOS绝配！流程连线搭建上位机 一2024-09-2311.大萧条，大裁员，一款技术人员的创收利器！2024-09-2312.前端零代码5：新能源汽车HMI中控屏2024-09-2313.后台管理前端设计器，个人商用1999！源码学习2024-09-2414.UIOTOS前端组态跟中控等SCADA、HMI有什么区别？2024-09-29

15.前端零代码-技术原理：对话框嵌套和自定义按钮| uiotos致敬amis、appsmith、codewave、goview、dataroom、iotrouter、FUXA、乐吾乐、dooring等2024-10-02

16.前端零代码-原理：与嵌套页面内的组件通信| uiotos致敬amis、appsmith、codewave、goview、dataroom、iotrouter、FUXA、乐吾乐、dooring等2024-10-0217.前端无代码-表单页面的查看和编辑| uiotos致敬amis、appsmith、codewave、goview、dataroom、iotrouter、FUXA、乐吾乐、dooring等2024-10-0218.GUI图形界面 无代码开发 原理 2 - 属性继承的重写| uiotos致敬amis、appsmith、codewave、goview、dataroom、iotrouter、FUXA、乐吾乐、dooring等2024-10-10

收起

对话框有默认标题头和脚，带有默认的取消、确定、关闭等按钮：

 

    对话框编辑状态和运行状态

UIOTOS中对话框属常见容器，内容由任意其他页面嵌套而来。如下所示：

                                                                                                        UIOTOS中对话框嵌套内容页

 

那么问题来了，既然对话框内容可任意设计，样式风格自带的头脚不匹配时，如何完全自定义？

UIOTOS支持隐藏默认头脚，完全交由内嵌页自定义外观，支持内嵌页按钮设置指定标识，对应对话框的取消、确定、关闭等。如下所示：

                                                                                                           UIOTOS自定义对话框外观

这就完美了吗？

不够！如果对话框内容是长页面，比如表单问卷，显然还需要加一层滚动页容器嵌套。

因此，UIOTOS中，除了直接内嵌页按钮能配置外，经滚动页嵌套的更下层页面按钮，也同样支持配置。如下所示：

 

对话框→滚动页→长页面

任意层按钮都支持？

不行！也就是说，直接内嵌页的按钮，或者经过一层滚动页再嵌套的，才被允许配置成弹窗按钮。

因为要支持多级弹窗，否则二级弹窗关闭时，就会导致初始弹窗也关闭。如下所示：

                                                                                                                     UIOTOS二级弹窗

 

一定要用多层嵌套内的按钮呢？

可以用UIOTOS中的继承和连线来实现。在最上层对话框中，继承目前内嵌页按钮的点击事件，连线指向自身，操作关闭等事件即可，如下所示：

                                                                                       内嵌按钮连线操作，让上层对话框关闭

 

关于

UIOTOS是一款前端零代码工具，首创页面嵌套技术，可搭建业务系统、大屏组态、上位机HMI等复杂交互界面，实现与原型1:1的效果。

与NodeRed、APIJSON、IoT平台，或其他低代码平台等，形成前后端一体方案（有后端API接口即可），快速交付工业、IoT等项目。

                                                                    示例：组态HMI

                                                                                     示例：业务系统


                联系

 

 

 

 

上一篇前端零代码-原理：与嵌套页面内的组件通信