∈鱼杆 ---我的鱼塘

执着,坚定,友爱,勇敢(www.pumaboyd.com)Live Message

导航

ul,li控件的封装(menu,list列表)

Posted on 2008-09-17 11:56  ∈鱼杆  阅读(563)  评论(0编辑  收藏  举报

控件本身没有什么技术含量。只是一个简单的封装。
新项目中前端开发人员专门负责编写html代码。整体看过代码,有很多地方前端人员都使用了ul、li的布局。像Menu、图片列表、商户列表也都是ul、li的形式。所以就写这了个通用的控件。
主要的思路

  1. 尽量减少后端开发人员HTML代码的拼接过程,重点关心数据的读取。
  2. 从HtmlGenericControl继承,这样可以利用很多现有的属性,直接通过base(”ul”)、base(”li”)完成tag的定义,摈弃了原来从webcontrol和control中继承的做法
  3. 从HtmlGenericControl继承,如果有特殊需求的ul、li也肯定能满足需求。我的目的是扩展了几个属性,方便使用和构造相应的数据。
  4. 利用HtmlGenericControl,我不用对CSS,title是否为空进行判断,没有相应了属性控件自然就不输出了。这比手动拼接HTML有强势,少些了很多if-else。
  5. 界定原子类型操作,通过构造函数来保证相关属性的联动修改,所以在licontrol中多了几个构造函数和
    public string Value { get; private set; }类型的属性

总结下来,在今后的代码开发中,尝试通过HtmlGenericControl、HtmlAnchor等去处理html结构。

发现几个问题

  1. 从HtmlGenericControl继承,IDE不能自动发现这个控件。不能像其他控件那样拖放。对我们没什么影响,因为我们开发中就不用拖放的这种操作
  2. 为了在WEB上显示,继承HtmlGenericControl你需要在继承的类中也要有两个相应的构造函数,我暂时不明白原因。

生成一个Menu DEMO:
ULControl1.SelectedValue = “webmy”;
ULControl1.SelectedValueCSS = “red”;
ULControl1.LIItem.Add(new LIItem(”商户1″, “345678″));
ULControl1.LIItem.Add(new LIItem(”商户2″, “22232″));
ULControl1.LIItem.Add(new LIItem(”商户3″, “833443″));
ULControl1.LIItem.Add(new LIItem(”商户4″, “44454″, “blue”));
ULControl1.LIItem.Add(new LIItem(”pumaboyd”, “webmy”,”http://www.pumaboyd.com”,”hi”));

下载控件:ULControl