为ASP.NET控件加入快捷菜单(2)
发表于:2007-06-30来源:作者:点击数:
标签:
编程接口 我们的ContextMenu控件从WebControl继承并执行INamingContainer接口 public class ContextMenu : WebControl, INamingContainer 图一控件的成员细节,如下: 属性 描述 AutoHide 标志当用户鼠标移出控件区域时,是否自动隐藏快捷菜单 BoundControls
编程接口
我们的ContextMenu控件从WebControl继承并执行INamingContainer接口
public class ContextMenu : WebControl, INamingContainer
图一控件的成员细节,如下:
属性 描述
AutoHide 标志当用户鼠标移出控件区域时,是否自动隐藏快捷菜单
BoundControls 返回使用快捷菜单的控件集合
CellPadding 返回或设置每个菜单项周围的空间的象素数
ContextMenuItems 返回菜单项的集合
RolloverColor 返回或设置当鼠标划过菜单项时突显的颜色
方法 描述
GetEscReference 返回当用户按下Esc键时用于隐藏页面中的快捷菜单的
JavaScrip代码
GetMenuReference 返回一段JavaScript代码,这段代码将关联到快捷菜单所对应的HTML元素上.
GetOnClickReference 返回当用户在菜单区域外点击时隐藏快捷菜单的代码.
事件 描述
ItemCommand 当用户点击一个快捷菜单项进激发.
关键属性是ContextMenuItmes集合属性,它包含了ContextMenuItem类型的对象集合,每一个对象表示一个菜单项。ContextMenuItem类的源码如下:
[TypeConverter(typeof(ExpandableObjectConverter))]
public class ContextMenuItem
{
public ContextMenuItem() {}
public ContextMenuItem(string text, string commandName)
{
_text = text;
_commandName = commandName;
}
private string _text;
private string _commandName;
private string _tooltip;
public string Text
{
get {return _text;}
set {_text = value;}
}
public string CommandName
{
get {return _commandName;}
set {_commandName = value;}
}
public String Tooltip
{
get {return _tooltip;}
set {_tooltip = value;}
}
}
每个菜单项具有显示文本,命令名(command name),提示文本(tooltip)。你可以通过各方法扩展这个类,例如添加一个图片URL,一个不可用状态,或一个目标URL等。显示文本被显示于菜单项上;命令名是一个唯一标识字符串,用于指定或确定与菜单项关联的命令。tooltip获取或设置当鼠标指针停留在菜单项上时显示的工具提示文本
当用户点击菜单项时,页面回传并激发一个
服务器端的ItemCommand事件。控制页通过操作这一事件来执行一些代码来响应用户对菜单项的点击。图3是一个使用快捷菜单的示例工程的截图:
要使用快捷菜单,你需要使用menu item对象填充ContextMenuItems集合,调整一些可视化样式,至少添加一个控件到BoundControls集合中。然后在浏览器中打开示例页,在任意绑定快捷菜单的控件上右击。效果如图:
每个菜单项包含一个LinkButton控件,这个LinkButton控件有一个内部绑定的点击事件处理程序。当检测到点击时,页面回传并激发这个点击事件。接着,预定义的处理程序将事件冒泡到上一级,并改名为ItemCommand。
控件还定义了一些可视化的属性,象CellPadding,RolloverColor和AutoHide。重申一下,在
Windows中快捷菜单可以在按下Esc键或在菜单区域外点击时取消。对于基于Web的快捷菜单来说,AutoHide属性为快捷菜单的根标签添加OnMouseLeave脚本,所以当用户的鼠标离开菜单区域时,这个根标签的子树将隐藏。把AutoHide作为一个可设置的属性,用户可以在需要的时候设置是否在鼠标离开时自动隐藏快捷菜单。
要使菜单能够在点击或按Esc键时隐藏,需要添加如下处理程序:< br><bodyonkeypress="..."onclick="...">
处理程序脚本可以被程序化的添加到每一个页面元素,只要这个元素被标记为runat=server。这样实际上就是在ContextMenu快捷菜单控件和页面之间创建了一个逻辑信赖。另外,你必须在页面上定义一个额外的服务器控件。当然,在运行时实例化一个额外的控件并不会严重的影响执行效果,但是为什么仅仅因为想容易的consume其它的控件而实例化一个无用的控件呢。作为选择下面这个方法也可以达到同样的效果:用body获取按Esc键和鼠标点击,并且你节省了服务器控件的开支
<body onkeypress="<% = ContextMenu1.GetEscReference() %>" onclick="<% = ContextMenu1.GetOnClickReference() %>">
让我们更详细的说一下控件的实现
原文转自:http://www.ltesting.net