当前位置: 首页 > news >正文

KingSCADA实现按钮点击效果

哈喽,你好啊,我是雷工!

在做SCADA项目的时候,按钮是不可缺少的功能,但软件自带的按钮太丑,已经无法满足现如今客户对界面美观度的要求。
这时候就需要UI小姐姐设计美观大气的SCADA界面,但UI设计的按钮切图放到程序中只是图片素材,当添加了按钮功能时,虽然能实现按钮功能,但没有任何点击效果;
当遇到有需要连锁条件才能点击的按钮时,操作员无法区分是有连锁点击了没反应,还是系统界面卡死了导致的没点击成功,这时候有点击效果就能很好的区分这种问题。
本篇介绍一种实现按钮点击效果的方法,以下为操作过程。

一、效果演示:

1、当无点击效果时:
样例功能点击按钮时弹出对应弹窗,点击时无任何效果

在这里插入图片描述

2、当有点击效果时:
当点击按钮时,按钮有个缩小的点击效果。

在这里插入图片描述

二、实现步骤:

1、在KingSCADA的画面编辑器界面添加图像控件;

在这里插入图片描述

2、将UI设计好的按钮素材导入资源管理,并添加到界面。

在这里插入图片描述

3、将按钮素材拷贝成两个,设置成一大一小中心对齐:

在这里插入图片描述

4、将按钮图片的【MemberAccess】属性设置为【true】,需要在脚本内对该对象进行操作时需设置成true;

在这里插入图片描述

5、编辑按钮按下弹起脚本:

左键按下脚本:

Image185.Visible=false;
Image186.Visible=true;

左键弹起脚本:

Image185.Visible=true;
Image186.Visible=false;

6、编辑完效果脚本在接着编辑功能脚本

在这里插入图片描述

7、然后具有点击效果的按钮功能就做好了,特别简单。

三、后记

其实实现思路很简单,就是在点击时有个缩小的变化,实现该变化通过两个图片叠加,控制两个图片的显隐实现缩小放大的点击效果。
同样的思路还可以实现点击时颜色变化效果,点击时跑马灯效果,点击时波纹效果等等。
当然SCADA更讲究的是美观大气实用,太花里胡哨的效果也用不上。
这虽然是一个小功能介绍,但一个项目整体的好坏,除了漂亮美观,还要考虑到操作工实用性,细节决定品质。

廊坊·高楼
2023-12-24

相关文章:

  • HCIA-HarmonyOS设备开发认证V2.0-轻量系统内核内存管理-动态内存
  • 在PyTorch中,如何查看深度学习模型的每一层结构?
  • [高并发] - 1.高并发综述
  • 代码随想录算法训练营第三十四天|860.柠檬水找零 406.根据身高重建队列 452. 用最少数量的箭引爆气球
  • 有了NULL,为什么C++还需要nullptr?
  • Educational Codeforces Round 135 (Rated for Div. 2)C. Digital Logarithm(思维)
  • 书生浦语-模型微调
  • 用HTML和CSS打造跨年烟花秀视觉盛宴
  • 新的风口:继ChatGPT热潮后,OpenAI又推出视频生成新浪潮
  • 【AIGC】Stable Diffusion介绍
  • nginx upstream server主动健康监测模块添加https检测功能
  • 拿捏c语言指针(上)
  • 【微服安全】API密钥和令牌与微服务安全的关系
  • Windows 环境下 Redis 的安装和基本使用
  • Arduino ESP8266/ESP32 TCP/UDP通讯例程
  • 《深入 React 技术栈》
  • 【技术性】Search知识
  • 2017届校招提前批面试回顾
  • 2017前端实习生面试总结
  • Cumulo 的 ClojureScript 模块已经成型
  • Date型的使用
  • Docker下部署自己的LNMP工作环境
  • Druid 在有赞的实践
  • JavaScript设计模式系列一:工厂模式
  • Java多线程(4):使用线程池执行定时任务
  • React的组件模式
  • Sublime text 3 3103 注册码
  • swift基础之_对象 实例方法 对象方法。
  • - 概述 - 《设计模式(极简c++版)》
  • 深度解析利用ES6进行Promise封装总结
  • 深入浅出Node.js
  • 思考 CSS 架构
  • 硬币翻转问题,区间操作
  • 用jQuery怎么做到前后端分离
  • “十年磨一剑”--有赞的HBase平台实践和应用之路 ...
  • 如何在 Intellij IDEA 更高效地将应用部署到容器服务 Kubernetes ...
  • ​LeetCode解法汇总1276. 不浪费原料的汉堡制作方案
  • ​LeetCode解法汇总518. 零钱兑换 II
  • ​ssh-keyscan命令--Linux命令应用大词典729个命令解读
  • ​一帧图像的Android之旅 :应用的首个绘制请求
  • # centos7下FFmpeg环境部署记录
  • (003)SlickEdit Unity的补全
  • (1)(1.13) SiK无线电高级配置(五)
  • (Bean工厂的后处理器入门)学习Spring的第七天
  • (二十一)devops持续集成开发——使用jenkins的Docker Pipeline插件完成docker项目的pipeline流水线发布
  • (附源码)spring boot儿童教育管理系统 毕业设计 281442
  • (附源码)基于SSM多源异构数据关联技术构建智能校园-计算机毕设 64366
  • (学习日记)2024.01.09
  • (原创) cocos2dx使用Curl连接网络(客户端)
  • .NET 6 在已知拓扑路径的情况下使用 Dijkstra,A*算法搜索最短路径
  • .NET DevOps 接入指南 | 1. GitLab 安装
  • .NET LINQ 通常分 Syntax Query 和Syntax Method
  • .net 打包工具_pyinstaller打包的exe太大?你需要站在巨人的肩膀上-VC++才是王道
  • .NET4.0并行计算技术基础(1)
  • .Net6支持的操作系统版本(.net8已来,你还在用.netframework4.5吗)