SDAUI(Standard development architecture User Interface) SDAUI框架介绍 讲解人:张洪超 1
sdaUI讲解流程 一、对sdaUI进行介绍 二、对sdaUI的配置进行介绍 三、简单介绍sdaUI的支撑文件 六、示例展示及演示 2018/11/27
SDAUI(Standard development architecture User Interface) sdaUI是公司开发实现的java自定义标签,通过java自定义标签将项目中的常用标签进行封装,形成统一的前台展现层标签,并且使展现层的代码统一化,使用便捷化,加快展现层代码开发。 sdaUI标签自带常用的事件处理机制,通过相应的属性设置,可以自定义触发响应事件时的回调函数,对当前的操作进行判定,快速制定后续操作。 sdaUI不但对相应的事件处理,代码编写提供了简单的操作,而且提供了统一的样式控制,以达到各标签之间的样式协调性,使编程人员不需过多关注页面的样式控制,缩短调节页面样式时间,提高工作效率。 2018/11/27 3
SDAUI(Standard development architecture User Interface) sdaUI的使用需要相关的jar包和必须的工具文件,同时在使用页面做相关配置,具体使用如下: 1.首先引入sdaUI的自定义标签jar包; 2.导入相应的配置文件:sdaui-taglib.tld; 3.在前台页面引用sdaUI标签: <%@ taglib uri="com.mds.sda.ui" prefix="sdaui"%>; 基于标签的使用规范,将页面属性更改为:<!DOCTYPE HTML>; 4.引入标签必须的JS和CSS文件,提供统一的引用页面:inc.jsp,可以在页面直接引入inc.jsp即可。 这样就可以在页面中使用sdaUI标签了。 2018/11/27 4
SDAUI(Standard development architecture User Interface) 实现的标签 DataGrid(表格) DataBox(日期) Window(提示窗口) Layout(页面布局框架) Form(提交表单) Combobox(下拉列表) Validatebox(可验证文本框、文本域) Accordion(选项卡面板) Tree(树) Tabs(标签页) 5
SDAUI(Standard development architecture User Interface) 实现的标签 DataGrid(表格) Menu(树状菜单) PropertyGrid(表格编辑器) MenuButton(树状菜单) Tree(树) SplitButton(滑动菜单) Layout(页面布局框架) DataBox(日期) Form(提交表单) DataTimeBox(日期时间) fusionChars(图表) TimeSpinner(时间调节文本框) Dialog(提示窗口) TextField(文本域) Window(提示窗口) uploadify(文件上传) Messager(提示窗口) Slider(数字滑动条) Combobox(下拉列表) Progressbar(进度条) Calendar(日历组件) NumberSpinner(数值调节文本框) LinkButton(简单按钮) SearchBox(搜索框) Validatebox(文本框) ComboTree(下拉树) Numberbox(数字文本框) Tabs(标签页) Accordion(选项卡面板) Panel(面板) 6
SDAUI(Standard development architecture User Interface) <sdaui:datagrid url="json/cysl_1_data.json" id="demoId" title="示例表格" height="500" width="500" fitColumns="true"> <sdaui:datagridThead> <sdaui:datagridColumn title="示例列" field="lczl" width="50"/> <sdaui:datagridColumn title="示例列" field="bzlc" width="50"/> </sdaui:datagridThead> </sdaui:datagrid> 7
SDAUI(Standard development architecture User Interface) 8
SDAUI(Standard development architecture User Interface) 9
SDAUI(Standard development architecture User Interface) 谢谢! 10