宝玉

专注于web开发技术
随笔 - 114, 评论 - 1503 , 引用 - 581

xml+xsl+htc,web控件开发的理想组合

最近,尝试着写web下的listview控件,listview一般有四种显示模式——平铺、图标、列表和详细信息。这些显示模式唯一的共同点就是数据是相同的,显示效果完全不一样。这时候xml的优势就完全体现出来了。

第一步,就是建立一个自定义格式的xml,用来保存listview数据

第二步,xsl可以解析xml生成html,所以就针对listview的每一种显示效果设计了一个对应的xsl。这样前面定义的xml数据和不同的xsl一起就可以显示出不同的效果。

第三步,htc在开发web控件时,非常灵活和功能强大,可以采用客户端脚本如js,可以对控件进行封装,使之有自己的属性、方法和事件等。利用htc封装的listview控件中对外有两个属性CfgXMLSrc(配置文件,设置listview的每一种显示模式对应的xsl文件路径等信息)和View(listview的显示模式),在htc中根据listview的View属性来选择不同的xsl文件和xml数据文件生成html,并输出。

这样就可以通过改变listview控件的view属性来切换listview的不同显示效果。

在线演示  打包下载

以前写换皮肤的控件,都是通过更换css和图片路径来做的(可以看看http://www.stedy.com),局限性很大,例如toolbar,在winxp和win2000下差别很大,只靠通过换css和图片路径无法应付这种情况。通过开发listview的经验,从中悟到了一种更好的开发换皮肤的web控件的模式:

首先将控件的相关数据用xml描述出来,对于每一种Theme(皮肤/主题样式),有一个相关的配置文件,配置文件中记载了该控件所用到的xsl、css、图片路径、htc等信息。在控件相关的htc中,根据Theme属性组合这些。从而可以灵活的应付各种情况。

例如刚才说的toolbar,假如入我们有三种风格:winxp蓝色、winxp银色和windows经典,前面两种基本差不多,只是样式和图片不一样,而后面一种和前面的两种差别比较大。那么我们需要写两个xsl,三个css文件,三个图片文件夹,组合一下就可以生成这三种风格的toolbar了。

这种控件开发模式会慢慢流行起来并在asp.net控件中发挥重要作用的,我相信:)

发表于 2004年6月29日 19:10

评论

# re: xml+xsl+htc,web控件开发的理想组合

不错太酷了。
2004-12-27 20:37 | 历害啊

# re: xml+xsl+htc,web控件开发的理想组合

好像右键菜单弹出位置有点问题。hehe
2004-12-27 22:18 | Jula

# re: xml+xsl+htc,web控件开发的理想组合

太厉害啦。我也在尝试写listview控件,没有成功。想不到你早就有啦,多谢多谢。

右键菜单弹出位置的确有点问题
2005-1-6 13:31 | fanchuangen@126.com

# re: xml+xsl+htc,web控件开发的理想组合

非常感谢~
google上能搜到唯一相关中文内容的就是这里了
2005-4-13 4:18 | zakkzhang

# re: xml+xsl+htc,web控件开发的理想组合

强!!楼主真的豪强
2005-5-18 8:01 | rrongcheng

# re: xml+xsl+htc,web控件开发的理想组合

感激啊 拿来做基于WEB的管理木马平台。
2005-5-31 4:51 | gds117

# re: xml+xsl+htc,web控件开发的理想组合

还不错.好像是从MSDN中搬过来的.
2005-6-8 2:51 | a

# re: xml+xsl+htc,web控件开发的理想组合

这是正宗的MVC的设计模式的WEB应用. 呵呵.
M ---- XML
V ---- XSL
C ---- HTC
2006-1-5 3:38 | Marksim

# re: xml+xsl+htc,web控件开发的理想组合

MVC 是软件设计中的一个非常用的, 并且也非常好用的设计模式. 不过, 没想到在WEB开发也能如此完美体现.

楼主真是强啊. 建议楼主看看设计模式相关的书, 看看还能不能应用其他的模式. 如果能的话, 那就太强了. WEB前端的开发将会更加有序, 更好管理, 更好维护, 更好扩展

厉害厉害. 抽空我也学习学习.
2006-1-5 3:46 | Marksim

# re: xml+xsl+htc,web控件开发的理想组合

搂主:你用过STEDY中的技术作过开发吗?
我们可以一起讨论:
QQ:376661716
2006-3-14 21:54 | lingh

# re: xml+xsl+htc,web控件开发的理想组合

楼主,详细列表时右键菜单弹出位置应该怎么改啊?
2006-5-8 3:09 | 123

# 无限菜单之 xml popup 版

zt无限菜单之xml popup版(IE5.5 ) 无限菜单之xml popup版(IE5.5 ) 终于成功实现了用IE5.5 中的Popup结合xml来制作无限级菜单,这个菜单将...
2008-8-6 10:53 | 鱻鯹鯹oоО

Post Comment

主题  
姓名  
主页
校验码  
内容   
京ICP备 05050892号