1. Introdução
Qualquer site composto por múltiplas páginas requer algum tipo de interface de usuário de navegação, que é criada em duas etapas. Primeiro, a estrutura lógica do site deve ser definida; em seguida, os elementos da interface do usuário são adicionados para permitir que os usuários alternem entre as várias partes da estrutura do site. Antes do ASP.NET 2.0, os desenvolvedores eram obrigados a resolver esses dois problemas sozinhos. Entretanto, a partir da versão 2.0, o ASP.NET fornece uma maneira simples de definir a estrutura de um site e inclui vários controles da Web - projetados especificamente para exibir a interface do usuário de navegação do site.
No artigo anterior, analisamos como criar um arquivo de mapa de site XML Web.sitemap por meio de controles de navegação da Web e como exibir informações de navegação do site, que incluem:
·SiteMapPath, que exibe uma localização atual (Home＞Eletrônicos＞XBOX)
·TreeView, que Exibe uma árvore recolhível exibida verticalmente, usada para exibir toda a hierarquia do mapa do site
, que exibe um menu alinhado horizontal ou verticalmente.
O artigo anterior forneceu apenas uma função e capacidade para o arquivo de mapa do site e o controle da Web de navegação. . Nesta seção, voltaremos nossa atenção para o controle programático das informações do mapa do site e examinaremos detalhadamente o controle da Web de navegação SiteMapPath.
2. Mapa do Site
Os exemplos neste artigo utilizam o mapa do site criado na Parte Um. Você pode ver a sintaxe exata do arquivo XML do mapa do site na Parte 1 ou baixá-lo no final deste artigo. Uma representação gráfica da estrutura do site usada nestes exemplos é mostrada abaixo:
3. Mapa do site controlado programaticamente
Um mapa do site é uma coleção de nós de mapa do site associados. Normalmente, cada nó do mapa do site contém um título, um URL e uma descrição. A imagem mostrada acima é um exemplo de mapa do site, onde cada retângulo representa um nó do mapa do site. O ASP.NET não requer um formato específico para especificar mapas de sites, embora forneça a opção padrão de usar um arquivo no formato XML. (Consulte a Parte 1 para obter detalhes sobre arquivos XML.)
O ASP.NET fornece uma classe chamada SiteMap - que fornece acesso programático somente leitura ao mapa do site. Esta classe é utilizada internamente por dois controles, que analisaremos mais adiante neste artigo:
SiteMapPath - Gera um breadcrumb baseado na localização da página visitada e na estrutura do site. Especificamente, o SiteMapPath começa no nó retornado pela propriedade SiteMap.CurrentNode e percorre a hierarquia até a raiz.
· SiteMapDataSource - Este controle cria uma fonte de dados hierárquica - mapeia a estrutura do mapa do site. Para exibir informações do mapa do site em outro controle da Web, como TreeView ou Menu, o controle da Web não consulta o mapa do site diretamente; em vez disso, ele se vincula a um controle SiteMapDataSource - que é responsável pela leitura da estrutura do mapa do site.
A classe SiteMap possui duas propriedades: RootNode e CurrentNode. Ambas as propriedades retornam instâncias de SiteMapNode. A classe SiteMapNode representa um nó definido no mapa do site e possui propriedades que descrevem o nó - Título, Url e Descrição, bem como propriedades que controlam a hierarquia programaticamente - ParentNode, ChildNodes, NextSibling, PreviousSibling e assim por diante.
Você pode usar a classe SiteMap em suas próprias páginas ASP.NET. Por exemplo, podemos exibir links Next, Previous e Up em cada página - apenas adicionando três controles HyperLink à página principal do site, além de um pouco de programação para verificar se o CurrentNode possui NextSibling, PreviousSibling ou ParentNode. Especificamente, você adicionará a seguinte marcação à sua página principal:
[<asp:HyperLink ID="lnkPrev" runat="server">Prev</asp:HyperLink>] |
[<asp:HyperLink ID="lnkUp" runat="server">Ativar</asp:HyperLink>] |
[<asp:HyperLink ID="lnkNext" runat="server">Next</asp:HyperLink>]
O manipulador de eventos Page_Load da página principal tem a seguinte aparência:
If SiteMap.CurrentNode IsNot Nothing Then
'Definir link próximo/anterior/acimaSe SiteMap.CurrentNode.PreviousSibling não for nada então
lnkPrev.NavigateUrl = SiteMap.CurrentNode.PreviousSibling.Url
lnkPrev.Text = "< Anterior (" & SiteMap.CurrentNode.PreviousSibling.Title & ")"
Outro
lnkPrev.NavigateUrl = String.Empty
lnkPrev.Text = "<Anterior"
Terminar se
Se SiteMap.CurrentNode.ParentNode não for nada, então
lnkUp.NavigateUrl = SiteMap.CurrentNode.ParentNode.Url
lnkUp.Text = "Up (" & SiteMap.CurrentNode.ParentNode.Title & ")"
Outro
lnkUp.NavigateUrl = String.Empty
lnkUp.Text = "Para cima"
Terminar se
Se SiteMap.CurrentNode.NextSibling não for nada, então
lnkNext.NavigateUrl = SiteMap.CurrentNode.NextSibling.Url
lnkNext.Text = "(" & SiteMap.CurrentNode.NextSibling.Title & ") Próximo >"
Outro
lnkNext.NavigateUrl = String.Empty
lnkNext.Text = "Próximo>"
Terminar se
End If
Isso adicionará três hiperlinks Próximo, Acima e Anterior a cada página que herda da página principal, veja o instantâneo abaixo.
4. Use o controle SiteMapPath para exibir trilhas de navegação
O controle SiteMapPath exibe uma trilha de navegação - ela é usada para mostrar aos usuários onde eles estão na estrutura do site. A saída do controle SiteMapPath é determinada pelos três fatores a seguir:
· a estrutura do site, conforme definido pelo mapa do site,
· a página que está sendo visitada e
· os valores das propriedades do controle SiteMapPath
Quando uma página com
. um controle SiteMapPath é acessado, o controle SiteMapPath tenta converter os mapas de URL da página para o valor de url de um nó do mapa do site definido no mapa do site. Se uma correspondência for encontrada, o controle percorrerá a estrutura até a raiz e produzirá a seguinte saída: RootNode>ParentNode>...>ParentNode>CurrentNode. O CurrentNode aqui é o título do nó do mapa do site - é usado para mapear a URL da solicitação da página atual e os ParentNodes são gerados como hiperlinks se o nó do mapa do site tiver um valor de URL definido no mapa do site; Um controle SiteMapPath na página "Livros de Histórico" (Books/History.aspx) gerará Home>Books>History e também gerará Home e Books na forma de hiperlinks, apontando de volta para Default.aspx e Books/Default.aspx respectivamente . Ao acessar Books/Default.aspx, SiteMapPath gera Home>Books.
Para ser bem claro, a saída do SiteMapPath depende tanto do mapa do site em si quanto da página que está sendo visitada. A saída do SiteMapPath pode ser customizada por meio das propriedades deste controle. Existem algumas propriedades no formato de controle padrão da Web - BackColor, Font, ForeColor e assim por diante - e existem algumas configurações específicas para SiteMapPath, incluindo:
u PathDirection - pode assumir um de dois valores, RootToCurrent (o padrão) ou CurrentToRoot. Quando o valor é RootToCurrent, a localização atual na página "Livros de Histórico" é gerada como Home>Books>History; quando o valor é CurrentToRoot, a saída será History>Books>Home;
·PathSeparator - especifica a string usada para separar cada nó no breadcrumb; o padrão é >
·RenderCurrentNodeAsLink - um atributo booleano - especifica se o CurrentNode deve ser gerado como um link;
·ParentLevelsDisplayed - um valor inteiro - pode ser usado para limitar a altura da estrutura em árvore exibida pela localização atual. Por padrão, o valor deste atributo é -1, o que significa que não há limite; definir seu valor como 1 gerará a trilha de navegação Livros>Histórico na página "Livros de Histórico". A raiz não está incluída porque o controle SiteMapPath percorre apenas um pai - de "Histórico" para "Livro".
· ShowToolTips - Se um nó do mapa do site tiver um valor de descrição, a descrição será exibida como um texto de dica de ferramenta para cada nó de navegação estrutural se esta propriedade estiver definida como True (o padrão).
Existem também propriedades de estilo que podem ser usadas para definir BackColor, Font, ForeColor, etc. - para várias partes do controle SiteMapPath. Você pode usar a propriedade NodeStyle para personalizar a aparência dos nós na trilha. Você pode usar RootNodeStyle e CurrentNodeStyle para personalizar ainda mais o primeiro e o último nós na trilha. Geralmente, a maneira mais fácil e esteticamente agradável de formatar o controle SiteMapPath é usar o assistente "Formatação automática" - isso pode ser ativado por meio da tag sensível do controle.
5. Personalize a saída gerada com modelos
O SiteMapPath contém quatro modelos - eles permitem maior personalização da saída gerada. Os modelos permitem combinar marcação HTML estática, controles da Web e sintaxe de vinculação de dados. Se você já usou controles DataList ou Repeater, já está familiarizado com os modelos. Os modelos no ASP.NET 2.0 são basicamente iguais aos do ASP.NET 1.x, exceto que o ASP.NET 2.0 introduz uma sintaxe nova e mais concisa para expressões de vinculação de dados. Por exemplo, no ASP.NET 1.x, você deve usar a sintaxe <%# DataBinder.Eval(Container.DataItem, PropertyName) %> para obter o valor de uma coluna. No ASP.NET 2.0, essa sintaxe antiga ainda pode ser usada, mas você pode opcionalmente usar a versão mais curta <%# Eval(PropertyName) %>.
Por padrão, SiteMapPath gera nós raiz e pai como hiperlinks regulares para que, quando os usuários clicarem no link, eles possam voltar rapidamente para cima na árvore de hierarquia de controle. No entanto, você pode querer fazer algum processamento no lado do servidor antes de enviar as informações de volta ao usuário - talvez você queira registrar para onde o usuário está indo ou salvar automaticamente quaisquer alterações feitas na página. Isso pode ser feito usando um modelo e gerando o nó como um LinkButton.
Por exemplo, se você deseja gerar apenas o nó raiz de SiteMapPath como um LinkButton, você pode usar a seguinte tag para adicionar um <RootNodeTemplate> ao controle SiteMapPath:
<asp:SiteMapPath ID="SiteMapPath1" runat="server" ＞
＜RootNodeTemplate＞
<asp:LinkButton ID="LinkButton1" runat="servidor"
Text='＜%# Eval("título") %＞'
CommandArgument='＜%# Eval("url") %＞'
OnCommand="LinkButton1_Command">
</asp:LinkButton>
＜/RootNodeTemplate＞
</asp:SiteMapPath>
Esta tag adiciona um controle LinkButton ao SiteMapPath - sua propriedade Text é atribuída à propriedade Title do SiteMapNode correspondente. Quando o LinkButton é clicado, um postback é causado e o evento Command do controle é acionado - isso ativa o manipulador de eventos LinkButton1_Command. A propriedade Url do SiteMapNode é passada para esse manipulador de eventos por meio da propriedade CommandArgument. Neste manipulador de eventos, você pode fazer qualquer processamento necessário no lado do servidor e, em seguida, direcionar o usuário para a página solicitada por meio de Response.Redirect(e.CommandArgument).
