Artigo WebMobile 21 - Themes, Skins e WebParts

Você precisa estar logado para dar um feedback. Clique aqui para efetuar o login
Para efetuar o download você precisa estar logado. Clique aqui para efetuar o login
Confirmar voto
0
 (0)  (0)

Veremos como construir sites usando Themes e Skins, além de saber como utilizar Web Parts na prática.

Esse artigo faz parte da revista WebMobile edição 21. Clique aqui para ler todos os artigos desta edição

imagem_pdf.jpg

ASP.NET

Themes, Skins e WebParts

Designs customizáveis com ASP.NET

 

Neste artigo veremos

·         Como utilizar Themes e Skins em uma aplicação Veb;

·         Como utilizar Web Parts;

·         Dicas para melhorar a interface de aplicações Web.

Qual a finalidade?

·         A finalidade é melhorar ainda mais a experiência do usuário em nossas aplicações;

Quais situações utilizam esses recursos?

·         Podemos utilizar esses recursos em praticamente todo tipo de Web Site, desde os mais simples até os portais mais complexos;

 

Resumo do DevMan

         A parte visual de um Web Site juntamente com a usabilidade dele, certamente são pontos importantes na decisão do internauta em continuar ou não a navegar pelas páginas. Para melhorar a experiência do usuário no sistema, nos valemos das mais variadas técnicas e conceitos de desenvolvimento.

         Nesse artigo veremos alguns recursos interessantes para chamar a atenção e melhorar essa experiência do usuário em nosso Web Site. Veremos como construir sites usando Themes e Skins, além de saber como utilizar Web Parts na prática.

 

Sabe aqueles sistemas em que você pode escolher o layout gráfico da interface? O sistema possui vários skins ou templates que podem ser trocados a hora que desejarmos, assim uma hora o aplicativo é amarelo outra azul, dependendo do skin definido. Conhece isso? O próprio Windows permite este tipo de configuração quando trocamos o esquema de cores nas propriedades do vídeo.

E o que você acha de embutir este tipo de funcionalidade em seus Web Sites? Pois é isso que iremos ver neste artigo. No ASP.NET temos as funcionalidades de Themes e Skins, que nos permite criar múltiplas formatações de layout, de uma forma bem simples e intuitiva.

Além disso, nessa mesma linha de designs customizáveis, vamos dar uma olhada em um recurso muito interessante, chamado WebParts. As WebPats, assim como os Themes e Skins já estão disponíveis no ASP.NET desde a versão 2.0. Com elas podemos criar interfaces Web onde podemos carregar mini-aplicativos em espaços pré-definidos na página.

 

Pasta App_Themes

Vamos começar com os Themes e Skins, criando um novo WebSite ASP.NET no Visual Web Developer 2008 Express, versão gratuita do Visual Studio 2008 para desenvolvimento de aplicações Web (veja como e onde baixar na nota do DevMan).

Abra o Visual Web Developer e vá até a opção File>New Web Site. Em Name informe WMThemesSkins e clique em OK.

Arraste na página Default.aspx um Label, um TextBox e um Button. Vamos formatá-los dando destaque para a cor vermelha, veja como deve ficar na Figura 1, onde você pode conferir o Design e o source da página.

Basicamente alteramos as propriedades BackColor, ForeColor e Size dos controles, para destacar a cor Vermelha neste design.

 

Figura 1. Design com destaque em Vermelho

 

Nota do DevMan

         Você sabia que a Microsoft disponibiliza versões gratuitas do Visual Studio 2008, e do banco de dados SQL Server 2008? Estas são as conhecidas edições Express destes produtos, e você pode realizar o download gratuitamente através deste site:

http://www.microsoft.com/express

         Neste site você encontrará os downloads das versões gratuitas do Visual Studio 2008 e do SQL Server 2008:

- Visual C# 2008 Express Edition: Para o desenvolvimento de aplicações Windows, Class Library e Console com a utilização da linguagem de programação C#.

- Visual Basic 2008 Express Edition: Tem a mesma função da versão acima, porém para programadores VB.NET.

- Visual C++ 2008 Express Edition: Para os admiradores de C++ que quiserem trabalhar na plataforma .NET

- Visual Web Developer 2008 Express Edition: É a versão Express do Visual Studio 2008 para o desenvolvimento de aplicações Web, com a utilização do ASP.NET. Baixe esta versão se você quiser fazer os exemplos deste artigo.

- SQL Server 2008 Express: edição gratuita do mais nova versão do banco de dados da Microsoft, o SQL Server 2008.

 

 

Até aqui não vimos novidade nenhuma. Vamos agora criar uma estrutura de pastas para utilizarmos os Themes e Skins neste WebSite. Como nos mostra a Figura 2, vá à Solution Explorer e clique com o botão direito sobre o nome do projeto.

Vá até a opção Add ASP.NET Folder e clique na opção Theme. Veja que uma pasta especial do ASP.NET é criada com o nome de App_Themes, e dentro desta pasta foi criada mais uma subpasta com o nome Theme1, que vamos substituir para Vermelho.

Como você já deve estar imaginando, cada pasta corresponde a um Theme em nosso projeto. Sendo assim, vamos criar mais duas pastas dentro de App_Themes, uma chamada Azul e outra Verde. No final sua Solution Explorer deve estar como nos mostra a Figura 3.

 

Figura 2. Criando o Folder Theme do ASP.NET

 

"

A exibição deste artigo foi interrompida :(
Este post está disponível para assinantes MVP

 
Você precisa estar logado para dar um feedback. Clique aqui para efetuar o login
Receba nossas novidades
Ficou com alguma dúvida?