 Página anterior | Voltar ao início do trabalho | Página seguinte  |
|
<pages theme="Theme" /> |
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">
<html xmlns="http://www.w3.org/1999/xhtml" > <head runat="server"> <title>Projeto Themes</title> <link rel="stylesheet" type="text/css" href="App_Themes/Theme/Estilo.css" /> </head> <body> <form id="form1" runat="server"> <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)
|
<link rel="stylesheet" type="text/css" href="App_Themes/Theme/Estilo.css" /> |
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).
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".
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">
<html xmlns="http://www.w3.org/1999/xhtml" > <head runat="server"> <title>Projeto Themes</title> <link rel="stylesheet" type="text/css" href="App_Themes/Theme/Estilo.css" /> </head> <body> <form id="form1" runat="server"> <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[arroba]aspneti.com
Mauricio Junior - mauricio[arroba]ascompras.com
| Página anterior | Voltar ao início do trabalho | Página seguinte |
|
|
|
