Websharp提供一项代码生成的功能。利用这项功能,可以根据模板生成代码框架,节省不少的开发时间。首先是设计好模板,然后生成代码框架,最后在代码框架里面填写数据即可。
示例
以“调色板”为例说明。页面显示结果如下图所示,左边是颜色名称,右边是实际的颜色。
1)创建模板文件colors.htm。定义了一个loop循环和一个Color变量。
<html> <head> <title>Colors</title> </head> <body > <b>{%HeadText%}</b> <table style="background-color:Blue" cellspacing="1" cellpadding="3"> <!-- BEGIN LOOP : Colors --> <tr> <td style="width:80px;background-color:White"> {%Color%}</td> <td style="width:60px;background-color:White"> <span style="background-color:{%Color%}; width=40px"></span> </td> </tr> <!-- END LOOP : Colors --> </table> <br /> </body> </html> |
模板最终效果如图所示:
2)启动websharp应用,在浏览器上打开链接ws/CodeFramework.jsp,例如http://localhost:8080/ws/CodeFramework.jsp,然后在第一个文本框输入模板文件的绝对路径。模板文件和web服务器必须在同一台机器。在第二个文本框里面填入模板文件的编码,例如UTF-8,最后点击提交按钮。
3)提交后,将出现一个大文本框,里面显示了生成的代码,如下所示,整个代码框架都生成了,但你发现setValue函数里面并没有赋值,需要我们自己进一步整理。
Websharp websharp = new Websharp("D:/workspace/WebSharp/Web Content/demo/colors.htm", "UTF-8", request, response); websharp.setValue("HeadText",); //{{<!-- begin loop: Colors --> for (int i = 0; i < BWT_NUMBER; i++) { ValueNode vnColors = websharp.addLoop("Colors"); vnColors.setValue("Color",); } //<!-- end loop: Colors -->}} websharp.render(null); |
4)最后一步,在colors.htm所在的目录下新建文件colors.jsp,把上面的代码拷贝进去,整理代码,加上动态的数据,结果如下面所示:
<%@ page import="websharp.core.*,websharp.web.*,websharp.util.*"%> <% Websharp websharp = new Websharp("colors.htm", "UTF-8", request, response); websharp.setValue("HeadText", "Color Palette"); String[] colors = { "Red", "Blue", "Yellow", "Green", "Black" }; for (int i = 0; i < 5; i++) { ValueNode vnColors = websharp.addLoop("Colors"); vnColors.setValue("Color", colors[i]); } websharp.render(null); %> |
5)在浏览器上浏览color.jsp,就能看到五种不同颜色的调色板,是不是觉得很神奇!