Uma aplicação web deve ter uma identidade visual

A navegação de um web site não deve estar fixa no código + -

Deve ser fácil modificar a navegação de um site de uma maneira não intrusiva

• Sem mexer no código
• Pelo próprio web master

Padrão típico de separação das páginas + -

Permite que diversas páginas tenham uma aparância consistente

• Menu sempre no mesmo lugar

  Cabeçalho com migalhas de pão

  Login aparecendo em quase todas as páginas

Páginas que contém uma estrutura que será repetida em diversas páginas

+ - Cada MasterPage (página mestre) define uma ou mais Content Page (página de conteúdo)

• Define uma região da MasterPage que pode ser substituída por conteúdo da página associada

A área em roxo é a área que pode ser editada

Se a tag <asp:Content> for removida, é exibido o conteúdo padrão colocado na Master Page

• Migalhas de Pão
• Bread Crumbs
• Mostra a hierarquia de navegação

• Menu de navegação
• Menu muito simplificado

• Navegação hierárquica
• Formato de árvore

• Evite os tutoriais muito antigos!

• + - Use a propriedade Master da classe Page para acessar as propriedades públicas da Master
  • Master.Hora = System.DateTime.Now;
  • Considere Hora, uma propriedade pública da Master
• + - Procurar um elemento na Master usando o FindControl
  • Label l = (Label) Master.FindControl("LabelCab");
  • Considere LabelCab um Label disponível na Master

• void Page_PreInit(Object sender, EventArgs e)  

  {  

  this.MasterPageFile = "~/NewMaster.master";

  }  

• <script type="text/javascript">
    function pageLoad() {
      // Master pageLoad() code.
   
      // If function contentPageLoad exists, execute it.
      if(typeof contentPageLoad == 'function')
        contentPageLoad();
  }

• + - ~ Tutorial sobre Master Pages
  • ~ Scott Mitchell
  • 2008
  • Tutorial oficial da Microsoft
  • Bem escrito
  • Bastante completo
  • Código exemplo disponível
  • + - Série de artigos
    • ~ Creating a Site-Wide Layout Using Master Pages
    • ~ Multiple ContentPlaceHolders and Default Content
    • ~ Specifying the Title, Meta Tags, and Other HTML Headers in the Master Page
    • ~ URLs in Master Pages
    • ~ Control ID Naming in Content Pages
    • ~ Interacting with the Master Page from the Content Page
    • ~ Interacting with the Content Page from the Master Page
    • ~ Master Pages and ASP.NET AJAX
    • ~ Specifying the Master Page Programmatically
    • ~ Nested Master Pages
• + - ~ Creating a Layout using Master Pages
  • Microsoft
  • 2005
  • Explicação básica sobre Master Pages
  • Versão 2.0 do Framework

• + - ~ Visual Studio 2008 and Nested Masterpages
  • ~ Joe Stagner
  • 2007
  • + - Master Pages Aninhadas
    • Como colocar uma Master Page dentro da outra
  • Voltado para o framework 3.5
• + - ~ How Do I: Create a Master Page in Visual Studio 2008
  • Asli Bilgin
  • 2008
  • Passo a passo básico sobre criação de Master Pages
  • Com código exemplo
  • Voltado para o framework 3.5
  • Focado em trabalho com CSS
• + - ~ How Do I: Create Nested Master Page in Visual Studio 2008
  • Asli Bilgin
  • 2008
  • Passo a passo sobre criação de Master Pages aninhadas
  • ~ Semelhante ao anterior
• + - ~ Lesson 6: Working with Stylesheets and Master Pages
  • 2005
  • Vídeo para o VS2005
• + - ~ How Do I: Use Master Pages and Site Navigation?
  • 2006
  • + - Mostra como usar os componentes de navegação
    • TreeView
    • SiteMapPath
  • Vídeo para o VS2005
• + - ~ How Do I: Work with Master Pages Declaratively and Programmatically
  • Chris Pels
  • 2008
  • + - Como criar Master Pages via
    • Programação
    • Declarativamente
• + - ~ How Do I: Handle Events in Master and Content Pages
  • Chris Pels
  • 2008
  • Gerenciamento de eventos
  • Master X Content
• + - ~ How Do I: Work with Nested Master Pages to Create Standard Content Layouts
  • Chris Pels
  • 2008
  • Master Pages aninhadas
  • Bastante completo
  • Discute, resumidamente, arquitetura de um web site

• + - ~ Master Pages in ASP.NET 2.0
  • Stephen Walther
  • 2004
  • Tutorial antigo
  • Bem completo
  • Não use tabelas para definir layout como o autor fez
• + - ~ Master Pages no ASP.NET 2.0
  • Em Português
  • Renato Haddad
  • 2005
  • ~ Semelhante ao anterior

• ~ Sobre Componentes de Navegação
• ~ Sobre Master Pages
• + - Passo a Passo
  • ~ Walkthrough: Creating and Using ASP.NET Master Pages in Visual Web Developer
  • ~ Walkthrough: Using Nested Master Pages in ASP.NET
  • ~ Working with ASP.NET Master Pages Programmatically

~ Projeto Gerado

+ - Criar WebSite

+ - Criar uma MasterPage

• A MasterPage permite que se defina uma estrutura comum para um conjunto de páginas
• + - MasterPage
  • Molde
  • Padrão
  • Define diversas páginas
• 
• 

+ - Entender o esqueleto da MasterPage

• 

  Cada controle ContentPlaceHolder define uma região da MasterPage que pode ser substituída na ContentPage

• + - Criar um arquivo CSS
  • 
  • 
  • ~ 
• + - Definir a interface ASPX / HTML
  • 
  • 

+ - Criar as Páginas Baseadas no MasterPage

• + - Criar as páginas
  • Sobre.ASPX
  • Login.ASPX
  • Vitrine.ASPX
• 
• 

+ - Definir a navegação através de um arquivo de mapa do site

• O arquivo web.sitemap é um arquivo XML que gerencia a hierarquia de páginas
• 
• 
• 

+ - Configurar TreeView e associar ao arquivo web.sitemap