MenuItem Clase
Definición
Importante
Parte de la información hace referencia a la versión preliminar del producto, que puede haberse modificado sustancialmente antes de lanzar la versión definitiva. Microsoft no otorga ninguna garantía, explícita o implícita, con respecto a la información proporcionada aquí.
Representa un elemento de menú que se muestra en el control Menu. Esta clase no puede heredarse.
public ref class MenuItem sealed : ICloneable, System::Web::UI::IStateManagerpublic sealed class MenuItem : ICloneable, System.Web.UI.IStateManagertype MenuItem = class
interface IStateManager
interface ICloneablePublic NotInheritable Class MenuItem
Implements ICloneable, IStateManager- Herencia
-
MenuItem
- Implementaciones
Ejemplos
En el ejemplo siguiente se muestra cómo rellenar un Menu control con objetos estáticos MenuItem mediante la sintaxis declarativa.
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>MenuItem Declarative Example</title>
</head>
<body>
<form id="form1" runat="server">
<h3>MenuItem Declarative Example</h3>
<!-- Use declarative syntax to create the -->
<!-- menu structure. Create submenu items -->
<!-- by nesting them within parent menu -->
<!-- items. -->
<asp:menu id="NavigationMenu"
staticdisplaylevels="1"
staticsubmenuindent="10"
orientation="Vertical"
target="_blank"
runat="server">
<items>
<asp:menuitem navigateurl="Home.aspx"
text="Home"
imageurl="Images\Home.gif"
popoutimageurl="Images\Popout.jpg"
tooltip="Home">
<asp:menuitem navigateurl="Music.aspx"
text="Music"
popoutimageurl="Images\Popout.jpg"
tooltip="Music">
<asp:menuitem navigateurl="Classical.aspx"
text="Classical"
separatorimageurl="Images\Separator.jpg"
tooltip="Classical"/>
<asp:menuitem navigateurl="Rock.aspx"
text="Rock"
separatorimageurl="Images\Separator.jpg"
tooltip="Rock"/>
<asp:menuitem navigateurl="Jazz.aspx"
text="Jazz"
separatorimageurl="Images\Separator.jpg"
tooltip="Jazz"/>
</asp:menuitem>
<asp:menuitem navigateurl="Movies.aspx"
text="Movies"
popoutimageurl="Images\Popout.jpg"
tooltip="Movies">
<asp:menuitem navigateurl="Action.aspx"
text="Action"
separatorimageurl="Images\Separator.jpg"
tooltip="Action"/>
<asp:menuitem navigateurl="Drama.aspx"
text="Drama"
separatorimageurl="Images\Separator.jpg"
tooltip="Drama"/>
<asp:menuitem navigateurl="Musical.aspx"
text="Musical"
separatorimageurl="Images\Separator.jpg"
tooltip="Musical"/>
</asp:menuitem>
</asp:menuitem>
</items>
</asp:menu>
</form>
</body>
</html>
<%@ Page Language="VB" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>MenuItem Declarative Example</title>
</head>
<body>
<form id="form1" runat="server">
<h3>MenuItem Declarative Example</h3>
<!-- Use declarative syntax to create the -->
<!-- menu structure. Create submenu items -->
<!-- by nesting them within parent menu -->
<!-- items. -->
<asp:menu id="NavigationMenu"
staticdisplaylevels="1"
staticsubmenuindent="10"
orientation="Vertical"
target="_blank"
runat="server">
<items>
<asp:menuitem navigateurl="Home.aspx"
text="Home"
imageurl="Images\Home.gif"
popoutimageurl="Images\Popout.jpg"
tooltip="Home">
<asp:menuitem navigateurl="Music.aspx"
text="Music"
popoutimageurl="Images\Popout.jpg"
tooltip="Music">
<asp:menuitem navigateurl="Classical.aspx"
text="Classical"
separatorimageurl="Images\Separator.jpg"
tooltip="Classical"/>
<asp:menuitem navigateurl="Rock.aspx"
text="Rock"
separatorimageurl="Images\Separator.jpg"
tooltip="Rock"/>
<asp:menuitem navigateurl="Jazz.aspx"
text="Jazz"
separatorimageurl="Images\Separator.jpg"
tooltip="Jazz"/>
</asp:menuitem>
<asp:menuitem navigateurl="Movies.aspx"
text="Movies"
popoutimageurl="Images\Popout.jpg"
tooltip="Movies">
<asp:menuitem navigateurl="Action.aspx"
text="Action"
separatorimageurl="Images\Separator.jpg"
tooltip="Action"/>
<asp:menuitem navigateurl="Drama.aspx"
text="Drama"
separatorimageurl="Images\Separator.jpg"
tooltip="Drama"/>
<asp:menuitem navigateurl="Musical.aspx"
text="Musical"
separatorimageurl="Images\Separator.jpg"
tooltip="Musical"/>
</asp:menuitem>
</asp:menuitem>
</items>
</asp:menu>
</form>
</body>
</html>
En el ejemplo siguiente se muestra cómo enlazar un Menu control a un SiteMapDataSource control. Cuando se enlaza a un origen de datos, el Menu control crea automáticamente los MenuItem objetos. Para que este ejemplo funcione correctamente, debes copiar los datos del mapa del sitio de ejemplo debajo en un archivo denominado Web.sitemap.
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<!-- For the hover styles of the Menu control to -->
<!-- work correctly, you must include this head -->
<!-- element. -->
<head runat="server">
<title>Menu DataBinding Example</title>
</head>
<body>
<form id="form1" runat="server">
<h3>Menu DataBinding Example</h3>
<!-- Bind the Menu control to a SiteMapDataSource control. -->
<asp:menu id="NavigationMenu"
disappearafter="2000"
staticdisplaylevels="2"
staticsubmenuindent="10"
orientation="Vertical"
font-names="Arial"
target="_blank"
datasourceid="MenuSource"
runat="server">
<staticmenuitemstyle backcolor="LightSteelBlue"
forecolor="Black"/>
<statichoverstyle backcolor="LightSkyBlue"/>
<dynamicmenuitemstyle backcolor="Black"
forecolor="Silver"/>
<dynamichoverstyle backcolor="LightSkyBlue"
forecolor="Black"/>
</asp:menu>
<asp:SiteMapDataSource id="MenuSource"
runat="server"/>
</form>
</body>
</html>
<%@ Page Language="VB" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<!-- For the hover styles of the Menu control to -->
<!-- work correctly, you must include this head -->
<!-- element. -->
<head runat="server">
<title>Menu DataBinding Example</title>
</head>
<body>
<form id="form1" runat="server">
<h3>Menu DataBinding Example</h3>
<!-- Bind the Menu control to a SiteMapDataSource control. -->
<asp:menu id="NavigationMenu"
disappearafter="2000"
staticdisplaylevels="2"
staticsubmenuindent="10"
orientation="Vertical"
font-names="Arial"
target="_blank"
datasourceid="MenuSource"
runat="server">
<staticmenuitemstyle backcolor="LightSteelBlue"
forecolor="Black"/>
<statichoverstyle backcolor="LightSkyBlue"/>
<dynamicmenuitemstyle backcolor="Black"
forecolor="Silver"/>
<dynamichoverstyle backcolor="LightSkyBlue"
forecolor="Black"/>
</asp:menu>
<asp:SiteMapDataSource id="MenuSource"
runat="server"/>
</form>
</body>
</html>
A continuación se incluyen datos de mapa de sitio de ejemplo para el ejemplo anterior.
<siteMap>
<siteMapNode url="~\Home.aspx"
title="Home"
description="Home">
<siteMapNode url="~\Music.aspx"
title="Music"
description="Music">
<siteMapNode url="~\Classical.aspx"
title="Classical"
description="Classical"/>
<siteMapNode url="~\Rock.aspx"
title="Rock"
description="Rock"/>
<siteMapNode url="~\Jazz.aspx"
title="Jazz"
description="Jazz"/>
</siteMapNode>
<siteMapNode url="~\Movies.aspx"
title="Movies"
description="Movies">
<siteMapNode url="~\Action.aspx"
title="Action"
description="Action"/>
<siteMapNode url="~\Drama.aspx"
title="Drama"
description="Drama"/>
<siteMapNode url="~\Musical.aspx"
title="Musical"
description="Musical"/>
</siteMapNode>
</siteMapNode>
</siteMap>
Comentarios
Un Menu control se compone de una jerarquía de elementos de menú representados por MenuItem objetos. Cada elemento de menú tiene una propiedad de solo Depth lectura que especifica el nivel en el que se muestra el elemento de menú en el Menu control. Los elementos de menú del nivel superior (nivel 0) que no tienen un elemento de menú primario se denominan elementos de menú raíz. Un elemento de menú que tiene un elemento de menú primario se denomina elemento de submenú. Todos los elementos de menú raíz se almacenan en la Items colección. Los elementos de submenú se almacenan en la colección de un elemento de ChildItems menú primario. Puede acceder al elemento de menú primario de un elemento de menú mediante la Parent propiedad .
Nota
Las Items colecciones y ChildItems contienen solo los elementos de menú para el siguiente nivel hacia abajo. Para acceder a los elementos de menú más abajo del árbol de menús, use la ChildItems propiedad de un elemento de menú posterior.
Para crear los elementos de menú de un Menu control, use uno de los métodos siguientes:
Use la sintaxis declarativa para crear elementos de menú estáticos.
Use un constructor para crear dinámicamente nuevas instancias de la MenuItem clase . A continuación, estos MenuItem objetos se pueden agregar a la Items colección o ChildItems .
Enlace el Menu control a un origen de datos. Cuando el Menu control está enlazado a un SiteMapDataSource control, MenuItem los objetos se crean automáticamente que corresponden a los elementos del origen de datos. Para otros orígenes de datos, MenuItem los objetos también se crean automáticamente que coinciden con la estructura de jerarquía del origen de datos; sin embargo, también debe usar la DataBindings colección para definir los enlaces de elementos de menú que especifican la relación de enlace entre un elemento de menú y su elemento de datos correspondiente.
Los elementos de menú se muestran en un menú estático o en un menú dinámico, en función de su nivel. El menú estático siempre se muestra en un Menu control . De forma predeterminada, los elementos de menú del nivel superior (nivel 0) se muestran en el menú estático. Puede mostrar niveles de menú adicionales (submenús estáticos) en el menú estático estableciendo la StaticDisplayLevels propiedad . Los elementos de menú (si existen) con un nivel superior al valor especificado por la StaticDisplayLevels propiedad se muestran en un submenú dinámico. Un submenú dinámico solo aparece cuando el usuario coloca el puntero del mouse sobre el elemento de menú primario que contiene un submenú dinámico.
Cuando el usuario hace clic en un elemento de menú, el Menu control puede navegar a una página web vinculada o simplemente volver a publicar en el servidor. Si se establece la NavigateUrl propiedad de un elemento de menú, el Menu control navega a la página vinculada; de lo contrario, devuelve la página al servidor para su procesamiento. De forma predeterminada, se muestra una página vinculada en la misma ventana o marco que el Menu control. Para mostrar el contenido vinculado en otra ventana o marco, utilice la Target propiedad del Menu control .
Nota
La Menu.Target propiedad afecta a todos los elementos de menú del control. Para especificar una ventana o marco para un elemento de menú individual, establezca la Target propiedad del MenuItem objeto directamente.
Cada elemento de menú tiene una Text propiedad y .Value El valor de la Text propiedad se muestra en el Menu control , mientras que la Value propiedad se usa para almacenar datos adicionales sobre el elemento de menú, como los datos pasados al evento de postback asociado al elemento de menú. Si establece la Text propiedad, pero deja la Value propiedad sin establecer, la Value propiedad se establece automáticamente con el mismo valor que la Text propiedad. Lo contrario también es cierto. Si establece la Value propiedad , pero no la Text propiedad , la Text propiedad se establece automáticamente con el mismo valor que la Value propiedad .
Nota
Los elementos de menú del mismo nivel de menú deben tener un valor único para la Value propiedad; el Menu control no puede distinguir entre distintos elementos de menú en el mismo nivel que tienen el mismo valor. En este escenario, si el usuario hace clic en un elemento de menú que tiene un valor duplicado, se selecciona el elemento de menú que aparece primero en el menú.
Para mostrar una información sobre herramientas cuando el usuario coloca el puntero del mouse sobre un elemento de menú, establezca la propiedad del ToolTip elemento.
Un Menu control tiene varios tipos diferentes de elementos de menú. Puede controlar el estilo (como el tamaño de fuente y el color) para los distintos tipos de elementos de menú mediante las propiedades de la tabla siguiente.
| Propiedad de estilo de elemento de menú | Descripción |
|---|---|
| DynamicHoverStyle | La configuración de estilo de un elemento de menú dinámico cuando el puntero del mouse se coloca sobre él. |
| DynamicMenuItemStyle | La configuración de estilo de un elemento de menú dinámico individual. |
| DynamicMenuStyle | La configuración de estilo de un menú dinámico. |
| DynamicSelectedStyle | La configuración de estilo del elemento de menú dinámico seleccionado actualmente. |
| StaticHoverStyle | La configuración de estilo de un elemento de menú estático cuando el puntero del mouse se coloca sobre él. |
| StaticMenuItemStyle | La configuración de estilo de un elemento de menú estático individual. |
| StaticMenuStyle | La configuración de estilo de un menú estático. |
| StaticSelectedStyle | La configuración de estilo del elemento de menú estático seleccionado actualmente. |
En lugar de establecer las propiedades de estilo individuales, puede especificar estilos que se aplican a los elementos de menú en función de su nivel mediante las colecciones de estilos que se muestran en la tabla siguiente.
| Colecciones de estilos de nivel | Descripción |
|---|---|
| LevelMenuItemStyles | Colección de MenuItemStyle objetos que controlan el estilo de los elementos de menú en función de su nivel. |
| LevelSelectedStyles | Colección de MenuItemStyle objetos que controlan el estilo de los elementos de menú seleccionados en función de su nivel. |
| LevelSubMenuStyles | Colección de MenuItemStyle objetos que controlan el estilo de los elementos de submenú en función de su nivel. |
El primer estilo de la colección corresponde al estilo de los elementos de menú en el primer nivel de profundidad del árbol de menús. El segundo estilo de la colección corresponde al estilo de los elementos de menú en el segundo nivel de profundidad del árbol de menús, etc. Esto se usa con más frecuencia para generar menús de navegación de estilo de contenido donde los elementos de menú en una determinada profundidad deben tener la misma apariencia, independientemente de si tienen submenús.
Nota
Si usa cualquiera de las colecciones de estilos de nivel enumeradas en la tabla anterior para definir el estilo del Menu control, esta configuración de estilo invalida las propiedades de estilo de elemento de menú individuales.
Además de personalizar el estilo de un elemento de menú, también puede personalizar su apariencia. Puede especificar imágenes personalizadas para las distintas partes de un elemento de menú estableciendo las propiedades de la tabla siguiente.
| Propiedad Image | Descripción |
|---|---|
| ImageUrl | Imagen opcional que se muestra junto al texto de un elemento de menú. |
| PopOutImageUrl | Imagen opcional que se muestra en un elemento de menú para indicar que el elemento de menú tiene un submenú dinámico. |
| SeparatorImageUrl | Imagen opcional que se muestra en la parte inferior de un elemento de menú para separarla de otros elementos de menú. |
Para determinar si un elemento de menú está seleccionado actualmente en un Menu control, use la Selected propiedad . También puede determinar si un elemento de menú está enlazado a datos mediante la DataBound propiedad . Si un elemento de menú está enlazado a datos, puede usar la DataItem propiedad para tener acceso a los valores del elemento de datos enlazado al elemento de menú.
Para obtener una lista con los valores de propiedad iniciales de una instancia de la clase MenuItem, vea el constructor MenuItem.
Constructores
| MenuItem() |
Inicializa una nueva instancia de la clase MenuItem sin texto de menú o un valor. |
| MenuItem(String) |
Inicializa una nueva instancia de la clase MenuItem con el texto de menú especificado. |
| MenuItem(String, String) |
Inicializa una nueva instancia de la clase MenuItem con el texto y el valor de menú especificados. |
| MenuItem(String, String, String) |
Inicializa una nueva instancia de la clase MenuItem utilizando el texto de menú, el valor y la dirección URL de una imagen especificados. |
| MenuItem(String, String, String, String) |
Inicializa una nueva instancia de la clase MenuItem utilizando los datos de texto de menú, valor, dirección URL de una imagen y dirección URL de navegación especificados. |
| MenuItem(String, String, String, String, String) |
Inicializa una nueva instancia de la clase MenuItem utilizando los datos de texto de menú, valor, dirección URL de una imagen, dirección URL de navegación y destino especificados. |
Propiedades
| ChildItems |
Obtiene un objeto MenuItemCollection que contiene los elementos de submenú del elemento de menú actual. |
| DataBound |
Obtiene un valor que indica si el elemento de menú se creó a través de un enlace de datos. |
| DataItem |
Obtiene el elemento de datos enlazado al elemento de menú. |
| DataPath |
Obtiene la ruta de acceso a los datos enlazados al elemento de menú. |
| Depth |
Obtiene el nivel en el que se muestra un elemento de menú. |
| Enabled |
Obtiene o establece un valor que indica si el objeto MenuItem se encuentra habilitado, lo cual permite al elemento mostrar una imagen desplegable y cualquier elemento de menú secundario. |
| ImageUrl |
Obtiene o establece la dirección URL de la imagen que se muestra al lado del texto en un elemento de menú. |
| NavigateUrl |
Obtiene o establece la dirección URL de destino al hacer clic en el elemento de menú. |
| Parent |
Obtiene el elemento de menú primario del elemento de menú actual. |
| PopOutImageUrl |
Obtiene o establece la dirección URL de una imagen que se muestra en un elemento de menú para indicar que el elemento de menú tiene un submenú dinámico. |
| Selectable |
Obtiene o establece un valor que indica si el objeto MenuItem se puede seleccionar haciendo clic sobre él. |
| Selected |
Obtiene o establece un valor que indica si el elemento de menú actual está seleccionado en un control Menu. |
| SeparatorImageUrl |
Obtiene o establece la dirección URL de una imagen que se muestra en la parte inferior de un elemento de menú para separarlo de otros elementos de menú. |
| Target |
Obtiene o establece la ventana o el marco de destino donde se mostrará el contenido de una página web asociada a un elemento de menú. |
| Text |
Obtiene o establece el texto mostrado para el elemento de menú en un control Menu. |
| ToolTip |
Obtiene o establece el texto de la información sobre herramientas para el elemento de menú. |
| Value |
Obtiene o establece un valor que no se muestra en pantalla y que se utiliza para almacenar datos adicionales sobre el elemento de menú, tales como los datos utilizados para controlar los eventos de postback. |
| ValuePath |
Obtiene la ruta de acceso desde el elemento de menú raíz hasta el elemento de menú actual. |
Métodos
| Equals(Object) |
Determina si el objeto especificado es igual que el objeto actual. (Heredado de Object) |
| GetHashCode() |
Sirve como la función hash predeterminada. (Heredado de Object) |
| GetType() |
Obtiene el Type de la instancia actual. (Heredado de Object) |
| MemberwiseClone() |
Crea una copia superficial del Object actual. (Heredado de Object) |
| ToString() |
Devuelve una cadena que representa el objeto actual. (Heredado de Object) |
Implementaciones de interfaz explícitas
| ICloneable.Clone() |
Crea una copia del objeto MenuItem actual. |
| IStateManager.IsTrackingViewState |
Obtiene un valor que indica si el objeto MenuItem está guardando los cambios en su estado de vista. |
| IStateManager.LoadViewState(Object) |
Carga el estado de vista previamente guardado del elemento de menú. |
| IStateManager.SaveViewState() |
Guarda los cambios del estado de vista en un objeto Object. |
| IStateManager.TrackViewState() |
Indica al objeto MenuItem que efectúe el seguimiento de los cambios de su estado de vista. |