传统软件项目开发时,针对每个业务单据页面需要每控件一个一个的来设计,同时需要在页面功能中对每个控件的属性进行判定处理,尤其是页面风格布局样式需要花去一大半的时间,并且后续要想修改是非常麻烦繁琐,这样就导 致设计完成一个功能页面需要很长时间。问题是正常情况下很多功能是非常通用的,这就造成了重复劳作;如何快速设计页面风格,如何快速的将常用功能集成起来,供后续直接调用使用,并且后续只要修改一个地方,凡是调用的地方就自动变更了,如何让设计人员能通过可视化的简单配置或简单的JS编写就能达到各种类型表单页面设计要求如何提高开发效率,如何合理分配任务,如何快速维护响应...... 在这样的思路基础上,结合软件项目开发经验,开发设计了可视化页面设计工具。通过页面设计能快速达到以上效果,下面就来看看吧!
层 Panel
层Panel在网页中就是DIV, 在设计器中我们习惯称呼于Panel层;其控件属性包含三部分:基本属性、控件样式、控件事件;
一、基本属性
控件中文:控件ID,唯一标记控件的编码,可以在右边的部件属性中修改;在一个页面中,控件名称不允许重复;
中文标题:填写此控件的中文描述名称
外文标题:填写此控件其他语种描述;
二、控件样式
定位模式:表示控件在网页端的定位方式,一般使用绝对定位模式,但是系统也支持相对定位和静态模式;但是
是否隐藏:设置控件是否在网页上面显示;
宽度模式:设置控件的宽度是采用百分比还是绝对大小的方式;如果采用百分比时;控件的宽度计算方式为:当
高度模式:设置控件的高度模式,定义含义跟宽度模式一样,只不过比较对象是页面的高度;
控件样式:为了简化输出HTML网页文件的大小,所以针对控件都有一个默认的控件样式,此样式是直接采用整体
背景颜色:设置控件的背景颜色;
边框线型:设置控件的边框线型,虚线、实线、点线;
边框颜色:设置控件的边框线的颜色;
边框宽度:设置层的外边框的宽度;
三、控件事件
针对层控件,我们也定义支持了层的单击事件,一般情况下很少用到;
四、功能示范
通过实例示范层的定义及显示;定义设置层的样式:
网页预览效果:
非绝对定位模式下,网页控件的布局就会显得比较凌乱;所以一般建议使用绝对定位模式;
前控件的起点坐标与当前页面的宽度大小相减再乘以百分比来设置控件的宽度;
的CSS里面通用的;自定义样式,是直接写在控件的Style样式中;如选择自定义样式,则可以定义设置
控件的外观字体等;