© 2010 DUOC Sede Antonio Varas. Todos los Derechos Reservados.

© 2010 DUOC Sede Antonio Varas. Todos los Derechos Reservados.

Lenguaje de Programación .Net

LDP3501: Visual Studio .Net 2008

Controles Avanzados: Menú (repaso), MasterPage, FileUpload e Image.


Controles AvanzadosControles de Navegación:

• Facilitar la navegabilidad de los sitios Web.

• Interfaces funcionales autónomas.

• Controles comúnes: SiteMapPath Menú TreeView


Controles AvanzadosSiteMapPath

• Muestra la ruta de desplazamiento a la página actual.

• Provee vínculos a las páginas anteriores.

• Se enlaza de forma nativa a un Mapa de Sitio (SiteMap)

• Provee rutas de la forma: Página Inicio > Página Anterior > Página Actual


Controles AvanzadosArchivo SiteMap

• Es un manifiesto Xml.

• Define la navegabilidad del sitio.

• Cada elemento puede representar o no una página.

• No requiere que todas las páginas estén definidas en él.

• Las páginas allí definidas deberían existir.


Controles AvanzadosArchivo SiteMap

• Elementos siteMapNode anidados (title, description y url).

<siteMap> <siteMapNode title="Inicio" description="Página Principal" url="~/Inicio.aspx" > <siteMapNode title="Servicios" description="Servicios ofrecidos" url="~/Servicios.aspx"> <siteMapNode title="Entrenamiento" description="Clases que se dictan" url="~/Entrenamiento.aspx" /> <siteMapNode title="Consultoría" description="Servicio de Consultoría" url="~/Consultoria.aspx" /> </siteMapNode> </siteMapNode></siteMap>


Controles AvanzadosControl Menú

• Define un menú de exploración de la aplicación.

• Se despliega de forma estática o dinámica.

• Se puede cargar de forma manual (programación) o automática.

• Se enlaza a un Mapa de Sitio mediante un control SiteMapaDataSource.


Controles AvanzadosControl Menú

<asp:Menu ID="Menu1" runat="server" StaticDisplayLevels="3"> <Items> <asp:MenuItem Text="Archivo" Value="Archivo"> <asp:MenuItem Text="Nuevo" Value="Nuevo"></asp:MenuItem> <asp:MenuItem Text="Abrir" Value="Abrir"></asp:MenuItem> </asp:MenuItem> <asp:MenuItem Text="Editar" Value="Editar"> <asp:MenuItem Text="Copiar" Value="Copiar"></asp:MenuItem> <asp:MenuItem Text="Pegar" Value="Pegar"></asp:MenuItem> </asp:MenuItem> </Items></asp:Menu>


Controles Avanzados

Actividad 1:

Creación de un menú en ASP.Net


Controles AvanzadosMasterPage

• Definir un aspecto común a un grupo de páginas de la aplicación.

• Puede haber más de una en la aplicación.

• Página Principal y Página de Contenido.

• La página de contenido debe ser creada haciendo referencia.



• Combinación de Contenidos

<%@ Master %>

<asp:ContentPlaceHolderID="Main"

RunAt="server" />

<%@ Page MasterPage-File="Site.master" %>

<asp:ContentContentPlaceHolderID=

"Main" RunAt="server" />

</asp:Content>

MasterPage.master Inicio.aspx http://.../Inicio.aspx



• Página principal de extensión .master

• Directiva @ Master por @ Page.

• Definición de áreas de contenido.<%@ Master Language="C#" CodeFile="MasterPage.master.cs"

Inherits="MasterPage" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server"></asp:Content>


Controles AvanzadosMasterPage – Ventajas:

• Permiten centralizar las funciones comunes.

• Creación de un conjunto de controles y código, y aplican los resultados en un conjunto de páginas (Ej.: Menú).

• Control más preciso sobre el diseño de la página final (PlaceHolder).

• Modelo de objetos para personalizar la página principal a partir de páginas de contenido (Page.Master).


Controles AvanzadosMasterPage – Ejecución:

1. Los usuarios solicitan una página (URL página de contenido).

2. Lee la directiva @ Page. Si hace referencia a una página principal, también se lee la página principal.

3. La página principal con el contenido actualizado se combina en el árbol de control de la página de contenido.

4. El contenido de los controles Content individuales se combina en el control ContentPlaceHolder.

5. La página combinada resultante se representa en el explorador.


Colecciones y Listas

Actividad 2:

Creación de un sitio utilizando MasterPage


Controles AvanzadosControl FileUpload

• Permite subir archivos al servidor.

• Se presenta como un control integral.

• No realiza la carga del archivo al ser seleccionado.

• El método SaveAs() guarda el archivo en la ubicación indicada.

• Requiere una ruta física no URL.



String ruta = @"c:\temp\archivos\"; // Verificar que hay archivo seleccionado para proceder if (FileUpload1.HasFile) { // Obtener el nombre del archivo y lo pone en la ruta. ruta += FileUpload1.FileName; // Llamar al método SaveAs para cargar el archivo en el servidor FileUpload1.SaveAs(ruta); }



• HttpServerUtility.ServerMapPath()

• Propiedad Server del contexto de la página.

String rutaSitio;rutaSitio = Server.MapPath("/WebSite1");

/* Cargamos el archivo al servidor dentro del directorio Archivos */file1.SaveAs(string.Format("{0}{1}",MapPath("~/Archivos/"),ruta));


Controles AvanzadosControl Image

• Permite mostrar archivos gráficos.

• Propiedad ImageURL indica la ruta del archivo.

• Se debe proveer una ruta de recurso.

• ToolTip, AlternateText permiten proveer información al usuario.


Colecciones y Listas

Actividad 3:

Uso de los controles FileUpload e Image

© 2010 DUOC Sede Antonio Varas. Todos los Derechos Reservados.

Documents

Transcript of © 2010 DUOC Sede Antonio Varas. Todos los Derechos Reservados.