Marcos de Desarrollo
Diseño e implementación de aplicaciones Web con .NET
Objetivos
Conocer la solución de ASP.NET para crear "plantillas"
de páginas Web
Master Pages
ASP.NET 1.x carecía de sistema de plantillas
Solución: controles de usuario, que permiten agrupar varios
controles
ASP.NET 2.0:
Master Pages
Las
Master Pages
(páginas maestras) permiten crear un
diseño común, que será compartido por varias
Content Pages
(páginas de contenido)
Solución más elegante al problema de definir un "
look and
feel
" común
Master Pages
Página Maestra (Master Page)
Página de Contenido
(Content Page)
Master Pages
Las páginas maestras definen las zonas de contenido variable, con el control
<asp:ContentPlaceHolder>
Es posible definir varias zonas de contenido variable en una misma página maestra (varios
ContentPlaceHolders)
Las páginas de contenido hacen referencia a las páginas maestras y rellenan las zonas de
contenido variable con el control
<asp:Content>
Todo contenido de una página de contenido debe aparecer entre controles Content
<%@ Master ... <asp:ContentPlaceHolder ID="Main" runat="server" /> <%@ Page ... MasterPageFile= "~/Site.master" %> <asp:Content ID="Content1" ContentPlaceHolderID= "Main" runat="server" /> </asp:Content>
Master pages. Página maestra (.Master)
<%@ Master Language="C#" AutoEventWireup="true" Codebehind="MyMasterPage.master.cs" Inherits="AspDotNetTutorial.MyMasterPage" %>
<html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server">
<title>ASP.NET Tutorial</title>
<link href="Styles.css" rel="stylesheet" type="text/css" /> </head>
<body>
<div id="window">
<!-- Body content. --> <div>
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server"> </asp:ContentPlaceHolder>
</div>
<!-- Footer. -->
<div id="footer">© Universidad de A Coruña - 2012</div> </div> </body> </html>
MyMasterPage.Master
Identifica el espacio
para el contenido
Master pages. Página de contenido (.aspx)
<%@ Page Language="C#" MasterPageFile="~/MyPageMaster.Master" AutoEventWireup="true" Codebehind="MyContentPage.aspx.cs"
Inherits="AspDotNetTutorial.MyContentPage"
Title="My Content Page" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<form id="form1" runat="server">
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox> <asp:Button ID="Button1" runat="server" Text="Button" /> </form>
</asp:Content>
MyContentPage.aspx
Indica qué
contenedor rellena
Contenido por defecto
Los controles
ContentPlaceHolder
pueden definir
contenido por defecto
El contenido por defecto se muestra únicamente si la
página de contenido no lo sobrescribe
<%@ Master ... %>
...
<asp:ContentPlaceHolder ID="Main" runat="server">
Este es el contenido por defecto, que aparecera si no hay ningun control <asp:content> que le proporcione contenido en una página de contenido hija
Páginas maestras anidadas
Es posible crear una página maestra que haga
referencia a una página maestra ya existente
Una página maestra (padre) define la apariencia general
del sitio
Otra página maestra basada en la primera (hija)
extiende la apariencia visual del sitio Web
De utilidad en grandes sitios Web en los que existen
subconjuntos de páginas que comparten apariencia
visual
Páginas maestras anidadas
Página maestra "padre"
<%@ Master Language="C#" AutoEventWireup="true"
Codebehind="ParentMaster.master.cs" Inherits="WebApplication1.ParentMaster" %> <!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 id="Head1" runat="server"> <title>New Website</title> </head>
<body>
<form id="form1" runat="server"> <div>
<h1>This is parent master code</h1>
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</div> </form> </body> </html>
Páginas maestras anidadas
Página maestra "hija"
<%@ Master Language="C#" MasterPageFile="~/ParentMaster.Master" AutoEventWireup="true"
Codebehind="ChildMaster.master.cs" Inherits="WebApplication1.ChildMaster" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<h2>This is child master code</h2>
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
Páginas maestras anidadas
Página de contenido
<%@ Page Language="C#" MasterPageFile="~/ChildMaster.Master"
AutoEventWireup="true" Codebehind="WebForm1.aspx.cs"
Inherits="WebApplication1.WebForm1" Title="Untitled Page" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<p>This is content code</p>
Páginas maestras anidadas
Aplicar una página maestra a un sitio Web
Es posible designar la página maestra de todas las páginas pertenecientes a un
mismo sitio Web
Archivo
Web.config
Todas las páginas
que tengan controles Content
se combinarán con la página
principal especificada
Se asegura que todas las páginas del sitio Web seguirán el diseño de la página
maestra, incluso aquéllas que carezcan del atributo
MasterPageFile
en la
directiva
<%@ Page
La definición a nivel de página tiene preferencia sobre la definición a nivel de
aplicación
<configuration>
<system.web>
<pages masterPageFile="~/MasterPage.master" />
</system.web>
</configuration>
La propiedad
Page.Master
En ocasiones, puede ser necesario acceder desde una página de contenido a
controles definidos en la página maestra
La propiedad
Page.Master
devuelve una referencia a la página maestra
Instancia de clase derivada de
System.Web.UI.MasterPage
Null
si la página no está asociada a una página maestra
Permite acceder a contenido definido en la página maestra. Opciones:
Weak Typing
, utilizando FindControl()
La propiedad
Page.Master
Weak Typing
, utilizando FindControl()
Pág. Maestra, .aspx:
Pág. Contenido, .aspx.cs:
<asp: Label ID="Title" runat="server"/>
La propiedad
Page.Master
Strong Typing
, utilizando propiedad pública (más recomendable)
Pág. Maestra, .aspx:
Pág. Maestra, .aspx.cs:
Pág. Contenido, .aspx.cs:
public String TitleText {
get { return Title.Text; } set { Title.Text = value; } }
<asp: Label ID="Title" runat="server"/>
Página maestra según el navegador
Es posible seleccionar automáticamente una página
maestra dependiendo del navegador
Ejemplo:
Lista de navegadores disponibles (en el servidor de
producción):
C:\Windows\Microsoft.NET\Framework\[Version]\Config\Browsers
Algunos ejemplos:
