Você está aqui: Principal » Lista Completa de Tutoriais

Sobre este Tutorial

Autor:	Mauricio Pereira Borges Junior
Data:	25-08-2006
Categoria:	Programação
Assunto:	C# - BÁSICO
Visitas:

Usando Themes ASP.NET – Parte 2

Anteriormente falei e mostrei o conceito, problema e solução usando o “themes” do Visual Studio.NET 2005. Para quem quiser verificar sobre a “Parte 1”, favor acessa o link abaixo:

Parte 1 - Themes

Conceito

Uma nova característica e do ASP.NET 2.0 é deixar os usuários terem mais controle no visual onde possa sentir e ver uma página web. Um tema pode ser definido cores, nome de fontes, tamanho e estilo de cada controle. O novo “skin” suportado no ASP.NET 2.0 é uma extensão da mesma idéia do CSS.

Usuários individuais podem selecionar um tema para várias opções avaliadas para o mesmo, e especificar o tema deles escolhendo determinado “skin”. O “skin” é um cliente servidor relativo como se fosse um CSS stylesheet, ou seja, é similar a um arquivo CSS mas diferente, um “skin” pode sobrescrever várias propriedades visuais daquele específico controle de um página ou de várias páginas.

Você pode armazenar várias versões de imagens para o tema, cada tema uma imagem diferente ou atribuir várias imagens para todos os temas baseado no corrente “skin” usado.

Os temas ficam dentro da pasta /App_Themes, e contém os seguintes itens:

- Stylesheet.css (arquivo que define a aparência dos objetos HTMLs);

- Skin File – (Eles são arquivos que definem a aparência de controles clientes servidores ASP.NET. Você pode pensar deles como se fossem arquivos stylesheet clientes servidores;

- Outros recursos como imagens.

Problema

Preciso diferenciar os meus componentes de tela usando “stylesheet”, ou seja, um TextBox quero que tenha a letra em azul e outro tracejado. Preciso adicionar vários componentes diferentes na tela usando ou não estilo “stylesheet.css”. Além de mudar os estilos, preciso adicionar os “themes” para todas as páginas dentro do meu projeto.

Solução

O primeiro de tudo é criar um “Estilo.css”, o passo seguinte é colocar dentro do “skin” a “CssClass” para atribuir os estilos de cores e fontes. Cliquei com o botão direito do mouse em cima da pasta “Themes” e escolhi a opção “Add New Item...”. (Referência Theme2.1.1)

Referência: Theme2.1.1

A tela seguinte escolhi o tipo de arquivo na tela de “templates”. O tipo escolhido foi “Style Sheet”. (Referência Theme2.1.2).

Referência: Theme2.1.2

Coloquei o nome do arquivo de “Estilo.css”. Em seguida cliquei no botão ADD, o mesmo foi adicionado dentro da tela de Solution Explorer e dentro da página Theme. Dentro do arquivo “css” adicionei uma classe para configurar um label. (Referência Theme2.1.3).

.Label

{

background-color:Blue;

font-size:20px;

}

Referência: Theme2.1.3

O “background-color: Blue” coloca o fundo da cor azul, o “font-size:20px” define o tamanho da fonte mostrada em tela.

Na “Parte 1” mostrei como criar o “skin” do projeto, o passo seguinte é adicionar um “label” dentro do arquivo criado anteriormente chamado “SkinFile.skin”. (Referência Theme2.1.4)

<asp:Label runat="server" CssClass="Label" />

Referência: Theme2.1.4

Adicionei o código da referência (Theme2.1.4) dentro do skin e agora adicionarei uma tag dentro do arquivo de configuração chamado web.config. Neste arquivo de configuração e dentro da tag <system.web>, adicionei uma tag para utilizar em todas as páginas automaticamente os estilos adicionados no skin do projeto. (Referência Theme2.1.5).

Referência: Theme2.1.5

Esse código atribui para todas as páginas o tema criado; dessa forma; só adicionarei o controle “Label” dentro de qualquer página ASPX. Dentro do arquivo “DEFAULT.ASPX” criado anteriormente coloquei um objeto de tela. (Referência Theme2.1.6)

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<title>Projeto Themes</title>

</head>

<body>

<div>

<asp:TextBox runat="server" ID="txt"></asp:TextBox>

<asp:Label id="lbl" runat="server" Text="Label"></asp:Label>

</div>

</form>

</body>

</html>

Referência: Theme2.1.6

A referência (Theme2.1.6) mostro toda a página “default.aspx”. Logo nas primeiras linhas, adicionei o “stylesheet”. (Referência Theme2.1.7)

Referência: Theme2.1.7

Adicionei o estilo e em seguida o controle Label de acordo com os detalhes da referência (Theme2.1.8).

<asp:Label id="lbl" runat="server" Text="Label"></asp:Label>

Referência: Theme2.1.8

Referência: Theme2.1.9

Na execução do projeto, note que o label adicionado anteriormente no skin com um estilo puxado do arquivo de stylesheet foi executado com sucesso. Da forma que fiz para pegar o estilo, todos os label’s de todas as páginas estarão com o fundo azul, como na referência (Theme2.1.9).

Outro Problema

Em caso de sites ou sistemas, não quero que todos os label’s fiquem do fundo de cor azul e sim alguns label’s poderão ficar. Então tenho um problema, quero adicionar para alguns label’s a cor no fundo azul e outros labels não. Da forma que está configurado hoje, todos os labels estarão com o fundo azul.

Para a solução desse problema, existe o atributo “SkinId” que serve para diferenciação, ou seja, preciso adicionar mais um controle do tipo label no skinFile.skin com o atributo “SkinID”, depois de adicionar, preciso colocar na página o controle com o mesmo “SkinId”.

Solução

Como falei anteriormente, para solucionar o problema de não ficar sempre um label com o fundo da cor azul, preciso usar o atributo “SkinId” tanto no arquivo de “skin” quanto na página. Para solucionar o problema, adicionei mais um novo label dentro do “skinFile.skin” que fica dentro da pasta “Theme”. (Referência Theme2.1.10).

<asp:TextBox runat="server" SkinId="teste" ForeColor="Yellow" />

<asp:Label runat="server" CssClass="Label" />

<asp:Label runat="server" SkinId="labelTeste" />

Referência: Theme2.1.10

Note que acrescentei mais um label apenas sem o uso do atributo CssClass e com o “SkinId=labelTeste”. Depois de adicionado, coloquei mais um controle de tela na página “Default.aspx” com o mesmo “SkinId”. (Referência Theme2.1.11).

<asp:Label id="lbl" runat="server" SkinId="labelTeste" Text="Label"></asp:Label>

Referência: Theme2.1.11

Um label foi adicionado na página “Default.aspx” com o nome do SkinId igual ao do arquivo skinFile.skin. Para melhor entendimento segue todo o código da página “Default.aspx”. (Referência Theme2.1.12)

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<title>Projeto Themes</title>

</head>

<body>

<div>

<asp:TextBox runat="server" ID="txt"></asp:TextBox>

<br />

<asp:Label id="Label1" runat="server" Text="Label"></asp:Label>

<asp:Label id="lbl" runat="server" SkinId="labelTeste" Text="Label"></asp:Label>

</div>

</form>

</body>

</html>

Referência: Theme2.1.12

Executei o projeto e retornou o resultado conforme a (Referência Theme2.1.13).

Referência: Theme2.1.13

Espero que tenha ajudado um pouco. Bom, fico por aqui. Qualquer dúvida, favor entrar em contato através do e-mail mauricio@aspneti.com

Livros Publicados

Mauricio Junior

www.mauriciojunior.org

www.aspneti.com

LISTA DE TODOS OS TUTORIAIS DISPONÍVEIS

LIVROS CAMPEÕES DE VENDA NO SITE

Cursos Online com Certificado e Suporte à Dúvidas

CURSOS ONLINE COM CERTIFICADO - INDICADOS POR JÚLIO BATTISTI EM PARCERIA COM CURSOS 24 HORAS
AdministraÇÃo
Administração Contábil e Financeira Administração de Empresas Administração do Tempo Aprenda a Falar em Público Chefia e Liderança Departamento Pessoal Empreendedorismo Gestão da Qualidade Gestão de Compras	Gestão de Projetos Gestão Escolar Gestão Hoteleira Gestão Pública Logística Matemática Financeira HP 12C Planejamento Estratégico Qualidade de Vida no Trabalho
COMUNICAÇÃO E MARKETING
Administração de Empresas Aprenda a Falar em Público Comércio Exterior Empreendedorismo Escrita e Redação Etiqueta Social e Empresarial Jornalismo Online Marketing Pessoal	Marketing Social Planejamento Estratégico Produção de Eventos Propaganda e Marketing Sucesso Profissional Técnicas de Vendas Telemarketing
CONCURSOS PÚBLICOS
Conhecimentos Bancários Gestão Pública Memorização e Leitura Dinâmica	Noções Gerais de Direito Raciocínio Lógico
CONTABILIDADE E ECONOMIA
Administração Contábil e Financeira Administração de Empresas Bolsa de Valores Comércio Exterior	Conhecimentos Bancários Contabilidade Básica Finanças Pessoais Matemática Financeira HP 12C
DIREITO
Assistente Social Departamento Pessoal	Gestão Pública Noções Gerais de Direito
GESTÃO E LIDERANÇA
Administração de Empresas Administração do Tempo Aprenda a Falar em Público Chefia e Liderança Empreendedorismo Etiqueta Social e Empresarial Gestão de Compras Gestão de Projetos Gestão Escolar	Gestão Hoteleira Gestão Pública Marketing Pessoal Memorização e Leitura Dinâmica Negociação Propaganda e Marketing Recolocação Profissional Secretariado Executivo Sucesso Profissional
INFORMÁTICA
Access 2007 ASP AutoCad 2D AutoCad 3D CorelDraw Excel 2007 Flash Linux MS Project 2007	Photoshop PowerPoint 2007 Raciocínio Lógico Redes e Noções de Hardware Segurança na Internet Webmaster Windows 7 Word 2007 Word e Excel
MEIO AMBIENTE
Educação Ambiental Guia de Turismo	Marketing Social Reciclagem e Energias Renováveis
PEDAGOGIA
Bullying Distúrbios de Aprendizagem Educação Ambiental Educação de Jovens e Adultos Educação Especial	Educação Infantil Escrita e Redação Gestão Escolar Saúde Emocional do Educador
ProfissionalizanteS
Administração de Empresas Assistente Social Comércio Exterior Departamento Pessoal Educação de Jovens e Adultos Educação Infantil Enfermagem Fotografia Digital Gestão da Qualidade Gestão de Compras Guia de Gastronomia	Guia de Turismo Jornalismo Online Logística Produção de Eventos Recepcionista de Hotel Recrutamento e Seleção Secretariado Executivo Segurança do Trabalho Técnicas de Vendas Telemarketing Webmaster
RECURSOS HUMANOS
Administração de Empresas Departamento Pessoal Gestão Pública	Qualidade de Vida no Trabalho Recrutamento e Seleção
SAÚDE
Assistente Social Bullying Enfermagem	Primeiros Socorros Saúde Emocional do Educador Segurança do Trabalho
TURISMO E HOTELARIA
Gestão Hoteleira Guia de Gastronomia	Guia de Turismo Recepcionista de Hotel

CURSOS ONLINE COM CERTIFICADO - INDICADOS POR JÚLIO BATTISTI EM PARCERIA COM BRAVA CURSOS
INFORMÁTICA
Curso de Digitação Formatando e Instalando Computador Excel para Iniciantes Curso Compre no Ebay Informática Educativa Curso de Linux	Segurança na Internet Montagem e Manutenção de Computadores Curso Remoção de Vírus Curso Ubuntu Instalação Linux - Ubuntu
AdministraÇÃo
Gestão de Projetos e Empreendedorismo Benefícios da Previdência Curso HP 12C Matemática Financeira Curso Análise Salarial	Processo de Elaboração de Questionário Excelência no Atendimento ao Cliente Logística do Transporte Licitações e Contratos Administrativos
Profissionalizante
Adestramento Canino Como fazer pesquisa Científica e Monografia Curso de Corte e Costura Supervisor de Telemarketing Balconista de Padaria Curso Educação Infantil	Recepcionista e Secretaria Velas Artesanais Relações Interpessoais Curso de Arbitragem Bullying e Cyberbullying Capacitação de Tutores em EAD
EstÉtica
Curso de Massoterapia Curso de Depilação Drenagem Linfática Curso de Maquiagem Limpeza Turbinada de Pele	Alisamento e Relaxamento Capilar Curso de Etiqueta SPA de Vinhoterapia na Estética Facial Curso de Shantala Introdução à Colorimetria Capilar
Pessoal
Curso de Caligrafia Memorização Chefia e Liderança Curso Falar em Público Curso Bases Neurológicas Leitura Dinâmica Planejamento de Projeto Pessoal Reforma Ortográfica	Como Passar em Concursos Públicos Direção Defensiva Administração do Tempo Curso de Redação Curso de Meditação Como Passar no Vestibular Atualização Gramatical
NegÓCIOS
Relações Humanas e Ética Profissional Marketing e Vendas Diretas	Persuasão em Vendas
Entretenimento
Curso de Mágica
SaÚde
Primeiros Socorros Curso de Fitoterapia Curso de Aromaterapia Medicina Alternativa Plantas Medicinais	Técnicas básicas de Enfermagem O Trabalho do Agente Comunitário de Saúde Ergonomia - Postura Correta em Frente ao Computador Ética Profissional - Ênfase em Radiologia Adolescência: Visão Saúde do Assunto
Meio Ambiente
Curso Gestão Ambiental Jardinagem e Paisagismo	Curso de Reciclagem Curso de Bonsai
MÚsica
Curso de Violão
NutriÇÃo
Higiene e Manipulação de Alimentos Congelamento de Alimentos	Culinária Básica Culinária Intermediária
RelaÇÕes Humanas
Curso Gestão de Pessoas Departamento Pessoal Desenvolvimento Pessoal Empresarial Curso de Telemarketing Curso Dinâmica em Grupo Rescisão Contrato de Trabalho Folha de Pagamento na Prática	Atendimento ao Cliente Adm. da Empregada Doméstica Curso de Homolognet Recursos Humanos - Férias Recursos Humanos - 13° Salário Registro de Empregados
Web Master
Curso de HTML Curso de WordPress	Curso de HTML5
Designer GrÁfico
Curso de Corel Draw Efeitos Especiais com InDesign CS5	Efeitos Tipográficos com InDesign CS5

CURSO EM FORMATO DE VÍDEO-AULA

EXEMPLOS PRÁTICOS PASSO A PASSO COM SOM E IMAGEM

Clique no curso para informações detalhadas

Curso

Duração

Informações

ACCESS

Vídeo Aula: Access 2007 - Consultas - Curso Completo e Prático

4:30h

LOJA DE LIVROS

VÍDEO-AULAS

E-BOOKS/CURSOS

CURSOS ONLINE COM CERTIFICADO

CURSOS COMPLETOS EM CD

CD-01

CD-02

CD-03

CD-04

CD-05

CD-06

CD-07

CD-08

CD-09

CD-10

CONTATO

Você está aqui: Principal » Lista Completa de Tutoriais

Sobre este Tutorial

Usando Themes ASP.NET – Parte 2

:: Tutoriais Relacionados

CURSOS
COMPLETOS EM CD