Imitando el menu de SharePoint

Hola a todos.

En esta ocasion le mostrare como añadir controles al Menu de ASP.NET, asi como estilos y codigo html para transformarlo completamente a como nuestro diseño lo demande. Para esto trataremos de imitar un menu de SharePoint.

Lo primero, es agregar un control al proyecto, una vez insertado, colocamos el cursor sobre el control, del lado derecho aparecera un boton, desplegamos el menu “Tasks”, y nos vamos a “Edit Templates” luego en “Displays” seleecionamos “DynamicItemTemplate”.

En el espacion en blanco colocamos dos controles “Label”, el primero sera el Titulo de la opcion del menu y el segundo sera la Descripcion de la opcion. A cada control “Label” le asignamos el tipo de letra,color,tamaño,etc. una vez hecho esto, nos vamos al codigo aspx de la pagina, y editamos dentro de la etiqueta “<DynamicItemTemplate>”.

Dentro de esta etiqueta, insertamos una tabla “<table>” y agregamos dos “<tr>” uno donde ira el Label del titulo y otro donde ira el Label Descripcion, y cada renglon contendra tres columnas “<td>” una sera la columna color gris de la izquierda, la segunda sera la separacion entre la primera columna y el texto, y la tercera sera el contenido, es decir los controles Label.

Luego de esto, en el control “Menu” agregamos los items que necesitemos.

Por ultimo, nos vamos al codigo .cs y aqui en el metodo “OnLoad()”, buscamos el control con el metodo Page.FindControl(), y a partir de aqui, buscamos los ID’s de los controles Label’s y cambiamos su propiedad “Text” con el valor que necesitemos.

Teniendo como resultado:

Y el nuestro:

No es 100% igual pero con un poco de paciencia y bastante lado femenino podremos darle un diseño muy profesional a nuestros controles.

Descargar ejemplo

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Límite de tiempo se agote. Por favor, recargar el CAPTCHA por favor.