/*************************************************************************************/
//
//Direction follow
//Developing web application using the web ADF
//Web Controls
//ContextMenu controls
/*************************************************************************************/
The ContextMenu control is designed to enhance user interactivity with Web ADF components in an application. In general, the control is displayed by a user event in a browser at runtime. In most cases, the event is a right-click on an existing control, element, or item already displayed in the page. A ContextMenu can contain one or more context menu items. Each item is associated with an action to execute client or server-side code. In addition, each context menu item may be displayed with an icon and\or text. Both the Toc and TaskResults controls include preconfigured ContextMenus to interact with their node content.
ContextMenu控件被设计为在应用程序中增加用户和web ADF组件之间的用户交互。一般来说ContextMenu 控件是在运行状态下由一个的事件在浏览器里面展现。 在多数请款下，这个事件是，在一个已经存在的控件上、元素或者一个已经展示的项上单击鼠标右键触发的。ContextMenu 控件可以包含一个或者多个菜单项。每一个项和一个动作想关联，这个可动作可以是执行客户端的代码还可以是执行服务器端的代码。 另外，每一个项可以和一个icon或者一个文本字一起展现。 Toc 控件和taksresults控件都包含一个菜单用来和他们的节点之间进行交互。
The ContextMenu control is not included with the out-of-the-box Web ADF controls integrated with Visual Studio. So, to use the control you can either add a declarative reference in your page or add the ContextMenu control to the Visual Studio toolbox then drag-and-drop it on the page (see Step
ContextMenu控件不和一个和VS集成的工具箱外边的web adf 控件想关联。 所以，为来使用ContextMenu控件你必须在你的页面中添加一个声明的引用或者将ContextMenu控件添加到VS的工具箱里面，然后将它拖动到页面。 另外，它的菜单项只能使用代码来配置。下面提供来非设计视图下的配置。
Assembly: ESRI.ArcGIS.ADF.Web.UI.WebControls.dll
Class: ESRI.ArcGIS.ADF.Web.UI.WebControls.ContextMenu
Using the ContextMenu control
Add the ContextMenu control to the Visual Studio toolbox
Since the ContextMenu control is not added to the Visual Studio toolbox during the Web ADF installation, you need to manually add it. If you have already added the ContextMenu control, skip to the next step.
因为在web ADF安装的时候ContextMenu控件没有被添加到Visual studio 工具箱里面，因此你需要手动的添加他们。 如果你已经将ContextMenu控件添加到工具箱里面，那么请跳过下面的部分。
In Visual Studio, expand the ArcGIS Web Controls tab in the toolbox. Right-click on the tab and select "Choose Items...".
Navigate to the ContextMenu control in the namespace ESRI.ArcGIS.ADF.UI.WebControls and check the box next to the listing. Click OK. The ContextMenu control should now be available in the toolbox.
在vs里面，展开工具箱中的ArcGIS Web 控件标签，在标签上右击鼠标，然后选择“Chose Items….”
导航到ESRI.ArcGIS.ADF.UI.WebControls命名空间下的ContextMenu控件，然后选中列表坐标的复选框。 单击“OK”， 从工具箱里面就应该能够获取ContextMenu控件了。
Add supporting controls to the page
Add a MapResourceManager and Map to the page. Add a valid resource item to the MapResourceManager. In this example a ContextMenu control will be constructed for use on a Map control. Keep in mind that a ContextMenu can be associated with any element in the page, thus the patterns presented here will apply in other situations.
向页面中添加一个MapResourceManager控件和一个地图控件。 为MapResourceManager控件添加一个可以获取的资源项。在这个例子中一个ContextMenu控件将被创建，并应用到一个地图控件。你要在大脑里面保持这个概念，ContextMenu控件可以和页面中的任何元素相关联。因此我们在这里使用的模型也可以应用到其他的情况里面。
Add the ContextMenu control to the page
在页面中添加ContextMenu 控件
Drag a ContextMenu control on the page. Note that the location of the ContextMenu control at design-time does not determine the location of the context menu at runtime. Your page should resemble the following:
向页面中拖拽一个ContextMenu 控件。需要注意的是，在设计的时候的ContextMenu的位置不是运行的时候的ContextMenu控件的位置。你的页面应该类似于下面的所示
Set properties for the ContextMenu control
设置ContextMenu控件的属性
In design mode, click on the ContextMenu control to select it. The Properties window will display the properties for the control. While no properties are must be manually changed, one is recommended. Set the BackColor property to a solid color, for example, white or gray. By default the BackColor property is not set, thus the context menu appears transparent at runtime.
Add context menu items
在设计视图下在ContextMenu上单击并选中它。 属性窗口将会展示ContextMenu控件的属性，没有一个属性是必修设置的，但是有一个需要提醒一下。
设置BackColor属性为一个solid颜色，比如：white或者灰色。默认情况下，BackColor属性是没有设置的，因此环境菜单在程序运行的状态下看起来是透明的。
Adding items and configuring the behavior of a ContextMenu will require a writing some code. New context menu items can be created using the ContextMenuItem class and added to the ContextMenu control. Properties of a ContextMenuItem include the url to an image, the menu item text, and a string representing some custom JavaScript code to execute when the item is clicked. An appropriate time to add new context menu items during the page lifecycle is during the initial page load event. Add the following code to the code behind for your page:
添加菜单项，并配置每一个菜单的动作，这个将会需要写一些代码。使用ContextMenuItem 类可以创建一个新的菜单项，并添加到ContextMenu控件中。ContextMenuItem 的属性包含一个图像的URL，菜单的文本，和一个当菜单项被单击的时候代表自定义JavaScript代码的字符串。在页面的生命周期内，添加一个菜单项是在页面初始化加载的时候进行的。
[C#]
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
ESRI.ArcGIS.ADF.Web.UI.WebControls.ContextMenuItem contextMenuItem =
new ESRI.ArcGIS.ADF.Web.UI.WebControls.ContextMenuItem();
contextMenuItem.Text = "Zoom In";
ContextMenu1.Items.Add(contextMenuItem);
}
}
Add event to show context menu at runtime
The browser event to display the context menu at the appropriate time must to added to the appropriate control/element/item in the page. In this case, we want the ContextMenu to be displayed during a right-click on a map. At runtime, the Map control generates a div for display of map data in a browser. A set of attributes events can be configured on the div. One attribute is "oncontextmenu" which enables the browser to listen for right-click events on an element. When this event is triggered, JavaScript code will be used to show the ContextMenu control and its items. The Web ADF provides a set of JavaScript functions to show and hide context menus. In this case, when the oncontextmenu event is triggered on the map the esriShowContextMenu() JavaScript function will be called and our ContextMenu will be displayed. As in the previous step, an appropriate time to add new attribute information to controls and elements is during the initial page load event. Add the following code (blue) to the existing code added in the previous step (gray):
要在一个合适的时间在浏览器事件里面展现一个菜单内容，比如在页面中添加到一个合适的控件/元素/项。 在这种情况下，当在一个地图上单击右键的时候，我们想展现一个ContextMenu控件。 在运行状态下，map控件在浏览器里面生成来一个div，用她来显示地图的数据。 一系列的属性事件可以在这个div上进行配置。 一个属性是oncontextmenu，这个属性能够侦听一个元素的右键单击事件。当触发这个事件，JavaScript代码将会被调用，用来显示ContextMenu控件和他的项。 Web adf 框架提供了一系列的JavaScript函数来显示或者隐藏环境菜单。 在这种情况下，当地图的oncontextmen事件被触发，esriShowContextMenu（）JavaScript函数将被调用，我们的ContextMenu就会被展示。就像上一步介绍的那样，添加一个属性信息是在页面的初始化加载事件里面。 将后面的代码（蓝色的）添加到这些已经攒在的代码里面，这些已经存在的代码是我们在上一步添加的(灰色)。
[C#]
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
ESRI.ArcGIS.ADF.Web.UI.WebControls.ContextMenuItem contextMenuItem =
new ESRI.ArcGIS.ADF.Web.UI.WebControls.ContextMenuItem();
contextMenuItem.Text = "Zoom In";
ContextMenu1.Items.Add(contextMenuItem);
string showContextMenu = string.Format("esriShowContextMenu(event,'{0}','{1}','{2}');return false;", ContextMenu1.ClientID, Map1.UniqueID, "");
Map1.Attributes.Add("oncontextmenu", showContextMenu);
}
}
Handle click event on context menu item
Once the ContextMenu is displayed at runtime, a user can click on a context menu item to initiate an action. To work with the click event on the server, handle the ItemClicked event on the ContextMenu. When the menu item is clicked, a callback request is sent to the page which contains the context menu. The context menu item can be identified by its text and made available via the ContextMenuItemEventArgs passed to the ItemClicked event. The ContextMenu control is explicitly designed to work with the ASP.NET callback architecture. Implementation code on the server can now interact with server-side content based on the context menu item clicked. Note, the ContextMenu control generates the callback response designed to be processed by the Web ADF JavaScript. As a result, changes to other controls in the page must be packaged as CallbackResults and added to the ContextMenu.CallbackResults property (a collection of CallbackResult objects). More information on Web ADF implementation of the ASP.NET callback framework is available in the topic Working with AJAX capabilities of the Web ADF.
To handle the ItemClicked event on the ContextMenu in the page, open the ContextMenu property page and view the events (click the lightning bolt button).
一点一个快捷菜单在运行的时候出现，用户就可以单击一个子菜单来引起一个动作。 为了在服务器端处理单击事件，处理在ContextMenu单击项的事件。 当菜单项被单击后，一个回调请求就会被发送到包含快捷菜单的页面。 快捷菜单项可以被她的文本鉴定，并且通过发送到itemClick事件的的ContextMenuItemEventArgs参数使他可以获取。ContextMenu 控件被明确的设计为同ASP.NET callback architecture.一起工作。服务器端的实施代码现在可以和服务器端基于快捷菜单项单击内容进行交互。注意： ContextMenu控件生成的回调请求被设计为由web adf 的JavaScript来处理。 结果 ，页面中其他控件的变化必须被封装为CallbackResults并添加到ContextMenu 控件的CallbackResults属性里面。 更多的关于web adf 的ASP.NET回调框架的实施可以参考Working with AJAX capabilities of the Web ADF话题。
Double-click on the ItemClicked event in the dialog. The code-behind page will display with the implementation method created for you.
Add the following code to the event handler method. In this case, the Map.Zoom() convenience method will cause the map to zoom in, thus changing the map extent. Since the Map has changed, but the ContextMenu is generating the callback response
但对话框里面双击itemClicked事件。 在页面的后台将会出现为你创建的方法实施的代码。
将下面的代码添加到事件处理方法里面。 在这个情况下,map.Zoom() 方法将会引起地图的放大，因此，改变地图控件现实的范围。因为地图已经改变，但是快捷菜单生成了那个回调请求。
[C#]
protected void ContextMenu1_ItemClicked(object sender, ESRI.ArcGIS.ADF.Web.UI.WebControls.ContextMenuItemEventArgs contextMenuItemEventArgs)
{
switch (contextMenuItemEventArgs.Item.Text)
{
case "Zoom In":
{
Map1.Zoom(2);
ContextMenu1.CallbackResults.CopyFrom(Map1.CallbackResults);
break;
}
}
}
Using the ContextMenu at runtime
When the Web application starts, the ContextMenu is not visible. Right-click on the control which will show the ContextMenu, in this example it's the Map control. The ContextMenu will be displayed along with it's context menu items. In this case, click on the item "Zoom In" to zoom in on the map.
当程序运行的时候，ContextMenu 是不可见的，在控件上单击鼠标右键将会出现ContextMenu，在这里例子里面，他是地图控件。ContextMenu控件将会出现，和他一起出现的还有快捷菜单项。 在这种情况下，单击“Zoom In”项来放大地图。
Members
The following tables provide a list of properties and events of interest. For complete reference information, see the ContextMenu control in the library reference section.
下面的表格提供了属性的列表和相关的事件。 更全面的引用信息，在类库引用部分查看ContextMenu 控件
Properties
|
Property Name |
Type |
Description |
|
HoverBorderColor |
Color |
The color of the border around a context menu item when the mouse cursor hovers over it at runtime. 在运行的状态下，当鼠标悬停在菜单项的上面的时候，菜单项周围边框的颜色 |
|
HoverColor |
Color |
The background color of the context menu item when the mouse cursor hovers over it at runtime.（在运行的时候，当鼠标悬停在快捷菜单项的上面的时候，菜单项的北京颜色） |
Events
|
Event Type |
Description |
|
ItemClicked |
Occurs when a context menu item is clicked. |