Como alguns sabem comecei a escrever um conjunto de artigos para o site que aborda as novidades existentes na nova versão do Asp.Net. Infelizmente, não estou a conseguir escrever novos artigos devido à falta de tempo; contudo, para compensar, quero ver se consigo colocar alguns posts sobre as novidades no meu blog. É verdade que a quantidade de detalhes não será tão grande como a que apresento nos artigos, mas parece-me que é melhor do que nada :)
Hoje vou começar a falar um pouco sobre dois novos conceitos introduzidos na próxima versão da plataforma. Até à versão 1.XX, a melhor forma de definir os estilo aplicados a um controlo passava pela utilização de CSS. Apesar deste mecanismo permitir a centralização da definição de estilos (na maior parte das vezes, os programadores construíam ficheiros externos de CSS que continham os estilos aplicados a todos os controlos), a manutenção e aplicação a todos os controlos pretendidos não podia ser feita de forma automática.
A nova versão da plataforma apresenta dois conceitos muito interessantes que podem ser utilizados para simplificar este tipo de problemas: estou a falar da utilização de temas (oficialmente designados de themes) e das skins. Uma skin é responsável por definir os atributos de estilo que podem ser aplicados a um controlo. Um tema não é mais do que um conjunto de skins. Cada skin pode ser identificada através de um nome atribuído ao atributo SkinID. Cada tema pode possuir uma skin por defeito que será automaticamente aplicada a um controlo se este não indicar explicitamente qual a skin que deseja utilizar. Convém salientar que uma skin só tem significado quando for definida no interior de um tema!
Na prática, um tema será sempre implementado através da criação de um directório situado no interior da pasta App_Themes (uma das novas pastas especiais existentes na nova versão da plataforma). Por outro lado, uma skin será sempre representada através de um ou mais ficheiros com extensão .skin. Apesar de não ter de haver um relacionamento de 1-para-1 entre ficheiros e skins, a verdade é que parece-me boa ideia organizarmos as nossas skins de acordo com este padrão.
Mas como é que definimos uma skin? Para exemplificar a construção de uma skin, vamos supor que queremos definir os atributos de estilo aplicados a todas as caixas de texto da nossa aplicação. Neste caso, vamos querer colocar o border da caixa de texto com a cor azul escura. Neste caso, teríamos de começar por criar uma nova pasta no interior da pasta especial App_Themes do nosso site. A criação dessa pasta introduz um novo tema. Dentro dessa pasta, teríamos de adicionar um novo ficheiro de extensão .skin que iria conter as definições associadas à skin. Neste caso, o ficheiro de skin iria possuir o seguinte conteúdo:
<asp:TextBox runat="server" BorderColor="darkblue" BorderStyle="solid" BorderWidth="1" />
Portanto, como estamos a verificar através da linha anterior, a aplicação de atributos de estilo é feito como se estivésssemos a aplicar estilos a um controlo contido numa página. O exemplo anterior é especial pois define a skin por defeito. Uma skin por defeito não atribui nenhum valor á propriedade SkinID (ou melhor, utiliza uma string vazia como valor dessa propriedade). Um aspecto importante relacionado com as skins prende-se com o facto de uma skin não poder re-definir o estilo aplicado a um controlo. Portanto, de acordo com o exemplo apresentado, não poderíamos voltar a definir os estilos do controlo TextBox para a skin por defeito(nem mesmo recorrendo a outro ficheiro). Contudo, poderíamos definir o estilo desse controlo noutra skin. Por exemplo, poderíamos criar uma nova skin chamada de vermelho (no mesmo ficheiro ou noutro diferente) com a seguinte instrução:
<asp:TextBox runat="server" SkinID="vermelho" BorderColor="red" BorderStyle="solid" BorderWidth="1" />
A vantagem da utilização da skin por defeito prende-se com o facto de apenas termos de definir o tema utilizado pela página. Se esse tema possuir uma skin por defeito então essa skin será aplicada a todos os controlos que estejam disponíveis para serem "decorados" por um tema. A aplicação do tema a um controlo pode ser efectuada de várias formas. Hoje vou apenas apresentar uma delas. Por exemplo, se adicionarem à aplicação o seguinte código, irão reparar que a primeira caixa de texto utiliza automaticamente as definições apresentadas pela skin por defeito; por outro lado, a segunda caixa recorre à skin vermelho definida no interior do mesmo tema:
<%@ Page Language="C#" Theme="Theme1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<script runat="server">
</script>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>
</head>a
<body>
<form id="form1" runat="server">
<h3>Aplicação de Themes: utilização de skin por defeito</h3>
Nome: <asp:TextBox ID="nome" runat="server" ></asp:TextBox>
<br />
Telefone: <asp:TextBox ID="telefone" runat="server" SkinID="vermelho"></asp:TextBox><br />
<asp:Button ID="Confirmar" runat="server" Text="Button" OnClick="ProcessClick" /><p />
<asp:Label ID="info" runat="server" Text=""></asp:Label>
</form>
</body>
</html>
Como é possível verificar, o atributo SkinID também é utilizado para indicar o nome da skin que deve ser aplicada ao controlo (para além desta função, já tinhamos visto anteriormente que o atributo era utilizado para dar um nome a uma skin quando associado a um controlo colocado no interior do ficheiro .skin).Bom, para introdução chega. No próximo post vou voltar a falar acerca dos vários tipos de temas que podem ser utilizados por uma aplicação.
posted on Wednesday, April 13, 2005 1:11 AM