对于电力SCADA和工业控制等领域的人机交互界面常需要预定义一堆的行业标准控件,以便用户能做可视化编辑器里,通过拖拽方式快速搭建具体电力网络或工控环境的场景,并设置好设备对应后台编号等参数信息,将拓扑图形与图元信息一并保存到后台...这一版设计上还是有很大的改进,图形绘制逻辑,交互代码以及界面布局等都进行了较合理的分工设计,那个Java和设计模式很火,人手一本Martin Fowler《Refactoring: Improving...图标也是和矢量描述的效果一样,更惊喜的是树上的icon也是实时显示刀闸的展开角度,这是传统图片作为树的icon图片无法实现的,这也是我们一直强调的HT for Web整体架构已经为矢量打下基础,并非为了拓扑才实现矢量,所有通用组件都享有矢量的功能特性...,这个后续我们会有更多的应用案例让大家体会到这种结合的强大之处,当然可维护性已经不用我多说了,传统的通用组件tree上自定义renderer也能实现一个能动的icon,但你可以想想工作量,我们没有写一行绘制代码...最后几点设计控件的建议: 切换到使用者角度,即站在上层应用者角度提供最简洁符合业务逻辑的API接口,尽量不暴露图形相关参数,图形参数对上层使用着是晦涩的,暴露了你自己也是非常难改动和维护 不要一开始设计就考虑如何操作
上篇我们通过定制了CPU和内存展示界面,体验了HT for Web通过定义矢量实现图形绘制与业务数据的代码解耦及绑定联动,这类案例后续文章还会继续以便大家掌握更多的矢量应用场景,本篇我们先切换个话题,谈谈模型...图形组件设计架构上主要就是在规划Data模型,View视图和Event事件之间的关系,这些年业界逐渐将各种GUI设计模式提炼成理论归类,MVC、MVP和MVVM的主要大类常被统称为MV*,有很多文章进行各种设计模式的定义和比较...,本篇不打算深入展开理论的讨论,不同图形组件设计架构都会有很多差异,持续发展的组件其实每时每刻都在进行着各种设计上的改进,相信有很多不错的组件已经创新出了更多新的更实用的设计模型,只不过还未被提炼到理论高度进行归类让世人知晓...,从这个角度说目前很少有图形框架能让我们满意,相信很多人有类似痛苦的经历,一段时间不用某套框架后,要用时完全忘记如何入手,Swing老手不看老代码不知如何对JTree和JTable添加数据,Flex老手一下子想不起来...Event事件的监听和派发机制来建立起数据绑定,我控制欲比较强不是很喜欢AngularJS那种dirty checking的机制,有事件变化我希望马上被通知到,做我该做的处理,至于有人担心性能问题那是多虑了,图形组件发展这么多年已积累无数成熟技巧来规避事件的性能问题
在《HT图形组件设计之道(二)》我们展示了HT在2D图形矢量的数据绑定功能,这种机制不仅可用于2D图形,HT的通用组件甚至3D引擎都具备这种数据绑定机制,此篇我们将构建一个3D飞机模型,展示如果将数据绑定机制运用于...该例子综合运用了HT for Web的多种技术功能,大家能体会到HT这种数据绑定机制灵活且强大的特点,通过数据绑定机制,我们可以动态修改从2D拓扑图、到通用组件渲染,甚至到3D引擎的数据模型,所有图形元素的颜色
HT for Web简称HT提供了涵盖通用组件、2D拓扑图形组件以及3D引擎的一站式解决方案,正如Hightopo官网所表达的我们希望提供:Everything you need to create cutting-edge...,我不知道这个系列会写多少篇,也许永远也不会结束,也没有系统的提纲规划,想到什么就写什么,只希望文章能启发有兴趣的同学对图形组件设计更深的思考就足够了。...讨论前先设定话题的边界,HT是基于HTML5的图形组件库,因此文章的案例更多会涉及HTML和JavaScript语言,但并不局限于Web前端,设计思想上同样适用于任何GUI语言平台。...完整的前端设计是需要考虑到后台加载并发等因素,但本系列更侧重于纯客户端图形组件,不涉及网络通讯部分的思考,例如最近阿里无线前端招聘让谈谈:讲讲输入完网址按下回车,到看到网页这个过程中发生了什么。...实现的最终效果如上图所示,模型数据就两个数值,一个代表CPU占用率,一个代表内存占用率,左侧通过HT的图形组件GraphView自定义了矢量图形展示,右上角自定义了属性页PropertyView的两单元格的
ASP.NET 实现图形验证码能够增强网站安全性,防止机器人攻击。通过生成随机验证码并将其绘制成图像,用户在输入验证码时增加了人机交互的难度。...本文介绍了如何使用 C# 和 ASP.NET 创建一个简单而有效的图形验证码系统,包括生成随机验证码、绘制验证码图像以及将图像输出到客户端等步骤。...二、编写前端代码 思路已经明确,下面,我们来构建图形验证码的前端代码。 前端代码包含 HTML 和 JavaScript 代码。...1、创建输出图形验证码的接口 创建C#验证码处理器 VerCode.ashx: using CarRental.Common; using System; using System.Drawing; using...string checkCode = CreateCode(); ③ 构建验证码背景 创建一个位图对象,并在其上创建图形对象,然后用白色填充图像背景。
鉴于虚拟主机的性能限制,或者为了更好更快的上线网站或者成本原因,有的时候需要使用asp来开发动态站,并且现在移动端的流量普遍大于PC段,又需要体验自适应的效果。...所以bootstrap开发的asp站是一个很好的选择。原来一直使用自己的自定义的分页组件,在bootstrap下看起来有些奇怪,所以还是打算彻底把分页按照bootstrap的样式重新写一下。...其次,嵌入bootstrap分页组件的ul部分。 bootstrap分页组件中的页码都是li标签,外面还有个nav和ul标签需要处理下(闭合标签就不贴了)。代码: 第三,处理上一页和下一页的页码。
grid方法 为创建的组件使用grid方法,指定行与列就可以控制元素的位置了 from tkinter import * windows = Tk() windows.title("test") windows.configure
如果没有一个外部组件的支持,在ASP中是不能动态创建图形的,不管它是一个图表,一个横幅或仅仅是一个图形计数器。可喜的是,这一点在ASP.NET中改变了。...用命令行程序创建图形 在讨论一大堆ASP.NET代码之前,我们先执行一个简单的命令行程序做一个测试,然后使用这些源代码作为 ASP.NET 脚本的基础。...实际上,两者的区别在于:命令行程序将图形保存在一个文件中,而ASP.NET 脚本将图形直接发送到客户端。 举例的程序做什么呢?...程序 上面的代码作为一个命令行应用程序已经足够了,但是要编写相应的 ASP.NET 脚本,就必须再添加几个功能: ●可选择的文本(如一个计数器) ●可选择的文本颜色 ●可选择的背景颜色... ●可选择的字体 ●可选择的字号 如果你认为这些太难做到了,那么就请先看看相关的ASP.NET 脚本源代码pagecounter.aspx。
在ASP.NET页面中如果要使用到多个CheckBox组件,除了添加多个CheckBox组件在页面中之外,还有一种比较方便的方法,就是使用CheckBoxList组件。...如何在创建一个CheckBoxList组件: <asp:CheckBoxList runat = "server" id = C1 > <asp:ListItem Value = 1 >第一个检查框</...注释:在这里可以加入若干个检查框 </asp:CheckBoxList > 在ASP.NET页面中加入上面的语句,就可以产生一个名称为"C1"的CheckBoxList组件了。 二..../asp:DropDownList > </td > </tr > <tr > <td > 组件中各个条目排列行数: </td > <td > <asp:TextBox...本文介绍了CheckBoxList组件中的一些主要的属性和方法,并且通过一个比较典型的例子说明了在ASP.NET页面中如何进行与CheckBoxList组件相关的编程,其实对于另外一个比较重要的组件--
作者:阿虎 来自:yesky在ASP.NET的WebForm组件中的LinkButton组件也是一JavaScript...强烈推介IDEA2020.2破解激活,IntelliJ IDEA 注册码,2020.2 IDEA 激活码 作者:阿虎 来自:yesky 在ASP.NET的WebForm组件中的LinkButton组件也是一个服务器端的组件...LinkButton组件的重要的组成内容: 我们通过下面这张表来说明一下LinkButton组件的一些常用属性、事件。...在ASP.NET页面中利用CommandName属性和CommandArgument属性: 你也许对LinkButton组件中CommandName属性和CommandArgument属性有点迷惑,他们到底会有什么作用...LinkButton组件的出现使得在ASP.NET页面中传递参数越来越方便了。
关于组件 现在前端几大轮子全面组件化。组件让我们可以对常用的功能进行封装,以便复用。组件这东西对于搞.NET的同学其实并不陌生,以前ASP.NET WebForm的用户控件其实也是一种组件。...现在Blazor Webassembly微软正式把组件带到前端,让我们看看它是怎么玩的。 第一个组件 废话不多说下面开始构建第一个组件。...组件属性 我们定义组件总是免不了跟外部进行交互,比如从父组件接受参数,或者把自身的数据对外暴露。我们可以使用[Parameter]来定义一个组件的属性。...@ref 因为我们的组件使用是在html内,当你在@code内想要直接通过代码操作子组件的时候可以给子组件设置@ref属性来直接获取到子组件的对象。...相关内容: ASP.NET Core Blazor 初探之 Blazor WebAssembly ASP.NET Core Blazor 初探之 Blazor Server
目录 关于组件 组件类 静态资产 路由与路由参数 组件参数 请勿创建会写入其自己的组参数属性的组件 子内容 属性展开 任意参数 捕获对组件的引用 在外部调用组件方法以更新状态 使用 @ 键控制是否保留元素和组件...组件:项目 Blazor 中,使用 .razor 结尾的文件,称为组件;而 Blazor 中的组件,正式名称是 razor 组件; Blazor 组件是 razor 过渡而来的,使用 razor 的基本语法特性...关于组件 .razor 文件分为页面(带@page)和组件(不带@page,或者说页面组件和非页面组件。...例如: 这个路径是要放到前端才能,由前端访问时 ASP.NET Core 框架自动处理,相当于前端访问...被多个组件使用,不同组件要呈现不一样的内容; 要根据父组件的配置,显示子组件; 组件 A 要求使用到的组件 B,显示其传递的内容; 简单来说,就是将页面内容作为复杂类型传递给另一个组件,要求这个组件显示出来
在开发电子邮件发送程序的时候,我们经常需要使用到相应的组件,其实不需要第三方的组件(例如:Jmail网络 在开发电子邮件发送程序的时候,我们经常需要使用到相应的组件...,其实不需要第三方的组件(例如:Jmail)照常可以做到发送Email的功能。 ...在系统目录(如c:/winnt或c:/windows)的system32子目录中可以找到一个名称为cdosys.dll的文件,我们可以通过ASP.NET调用此COM组件来实现Email的发送。...cdosys构建在SMTP协议和NNTP协议之上,并且作为Windows2000 Server的组件被安装,当然我们也可以使用Exchange2000中cdoex.dll来实现发送邮件的机制。
因此HT for Web不仅定义矢量格式、实现了矢量绘制,还提供了矢量编辑工具设计器,用户拖拖拽拽就能绘制出矢量图形,然后导出JSON,注册到HT之后即可使用到所有的HT组件上,注意哦:是所有组件,不仅仅是拓扑...、不仅仅是3D、还有所有通用组件: ?...当然HT作为程序员的开发工具,仅仅走到这一步还是远远不够的,这仅仅解决了绘制矢量的工作,对于SCADA等监控领域往往还需要根据后台实时数据上报的硬件信息,需要图形上的矢量同步变化,因此矢量图形的颜色、大小...按传统的做法,程序员不仅要绘制矢量,并且在绘制图形代码中还要掺杂业务参数逻辑,因此代码的可读性和可维护性是很难想象的。...DOM组件与Cavnas的2D孰优孰劣争论,SVG的确也有highcharts这样不错应用的案例,HT成功实现所有组件采用Canvas设计,而Sencha和Kendoui等流行的通用组件都采用DOM方式堆积也发展的不错
说起来比较丢脸。我们有个手机的验证码发送逻辑需要使用验证码,这块本来项目里面就有验证码绘制逻辑,.Net Framework的,使用的包是System.Draw...
HT for Web(http://www.hightopo.com/guide/readme.html)提供了涵盖通用组件、2D拓扑图形组件以及3D引擎的一站式解决方案,正如Hightopo官网所表达的我们希望提供...,我不知道这个系列会写多少篇,也许永远也不会结束,也没有系统的提纲规划,想到什么就写什么,只希望文章能启发有兴趣的同学对图形组件设计更深的思考就足够了。...讨论前先设定话题的边界,HT是基于HTML5的图形组件库,因此文章的案例更多会涉及HTML和JavaScript语言,但并不局限于Web前端,设计思想上同样适用于任何GUI语言平台。...完整的前端设计是需要考虑到后台加载并发等因素,但本系列更侧重于纯客户端图形组件,不涉及网络通讯部分的思考,例如最近阿里无线前端招聘让谈谈:讲讲输入完网址按下回车,到看到网页这个过程中发生了什么。...实现的最终效果如上图所示,模型数据就两个数值,一个代表CPU占用率,一个代表内存占用率,左侧通过HT的图形组件GraphView自定义了矢量图形展示,右上角自定义了属性页PropertyView的两单元格的
领取专属 10元无门槛券
手把手带您无忧上云