ASP.NET permite aos usuários criar controles. Esses controles definidos pelo usuário são classificados como:
controle de usuário
Controles personalizados
Os controles de usuário se comportam como páginas ASP.NET em miniatura ou formulários da Web que podem ser usados por muitas outras páginas. Eles são derivados da classe System.Web.UI.UserControl. Esses controles têm as seguintes propriedades:
Eles têm a extensão .ascx.
Eles não podem conter nenhum ou tags.
Eles têm uma diretiva Control em vez de uma diretiva Page.
Para entender esse conceito, vamos criar um controle de usuário simples que servirá como rodapé de uma página web. Para criar e usar controles de usuário, execute as seguintes etapas:
Crie um novo aplicativo da web.
Clique com o botão direito na pasta do projeto no Solution Explorer e selecione ADICIONAR Novo Item.
Selecione Controle de usuário da Web na caixa de diálogo Adicionar novo item e nomeie-o como footer.ascx. Inicialmente, footer.ascx contém apenas uma diretiva Control.
<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="footer.ascx.cs" Inherits="customcontroldemo.footer" %>
Adicione o seguinte código ao arquivo:
<table> <tr> <td align="center"> Copyright ©2010 TutorialPoints Ltd.</td> </tr> <tr> <td align="center"> Local: Hyderabad, AP </td> </ tr></tabela>
Para adicionar um controle de usuário à sua página da web, você deve adicionar uma diretiva Register e uma instância do controle de usuário da página. O código a seguir mostra as instruções:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="customcontroldemo._Default" %><%@ Register Src="~/footer.ascx" TagName="footer" TagPrefix="Tfooter" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transicional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" > < head runat="server"> <title> Página sem título </title> </head> <body> <form id="form1" runat="server"> <div> <asp:Label ID="Label1" runat="server" Text="Bem-vindo aos tutoriais do ASP.Net "></asp:Label> <br /> <br /> <asp:Button ID="Button1" runat="server" onclick="Button1_Click" Texto ="Informações de direitos autorais" /> </div> <Tfooter:footer ID="footer1" runat="server" /> </form> </body></html>
Ao ser executado, o rodapé da página é exibido e o controle fica disponível em todas as páginas do seu site.
Observe o seguinte:
(1) O comando Register especifica um nome de rótulo e um prefixo de rótulo para o controle.
<%@ Register Src="~/footer.ascx" TagName="footer" TagPrefix="Tfooter" %>
(2) Os seguintes nomes de tags e prefixos devem ser usados ao adicionar controles de usuário na página:
<Tfooter:footer ID="footer1" runat="servidor" />
Os controles personalizados são implantados como coleções separadas. Eles são compilados em bibliotecas de vínculo dinâmico (DLL) e usados como qualquer outro controle de serviço ASP.NET. Eles podem ser criados por qualquer um dos seguintes métodos:
Obtendo um controle personalizado de um controle existente.
Crie um novo controle personalizado combinando dois ou mais controles existentes.
Obtendo-o da classe de controle base.
Para entender esse conceito, vamos criar uma classe customizada que simplesmente renderizará uma mensagem de texto no navegador. Para criar o controle, execute as seguintes etapas:
Crie um novo site. Clique com o botão direito na solução (não no projeto) na parte superior da árvore no Solution Explorer.
Na caixa de diálogo Novo Projeto, selecione Controle de Servidor ASP.NET no modelo de projeto.
As etapas acima adicionam um novo projeto e criam um controle personalizado completo para a solução chamado ServerControl1. Neste exemplo, deixe-me nomear o projeto CustomControls. Para utilizar este controle, ele deve ser adicionado como referência à página web antes de ser cadastrado na página. Para adicionar uma referência a um projeto existente, clique com o botão direito no projeto (não na solução) e clique em Adicionar Referência.
Selecione o projeto CustomControl na guia Projetos na caixa de diálogo Adicionar Referência. O Solution Explorer pode exibir referências.
Para usar o controle na página, adicione uma diretiva Register na diretiva @Page.
<%@ Register Assembly="CustomControls" Namespace="CustomControls" TagPrefix="ccs" %>
Além disso, você pode usar controles como qualquer outro controle.
<form id="form1" runat="server"> <div> <ccs:ServerControl1 runat="server" Text = "Sou um controle de servidor personalizado" /> </div> </form>
Ao ser executado, a propriedade Text do controle é exibida no navegador, conforme mostrado abaixo:
No exemplo anterior, o valor da propriedade Text da classe personalizada foi definido. O ASP.NET adiciona essa propriedade por padrão quando o controle é criado. O código a seguir após o arquivo do controle revela isso.
usando System;usando System.Collections.Generic;usando System.ComponentModel;usando System.Linq;usando System.Text;usando System.Web;usando System.Web.UI;usando System.Web.UI.WebControls;namespace CustomControls{ [ DefaultProperty("Texto")] [ToolboxData("<{0}:ServerControl1 runat=server></{0}:ServerControl1 >")] público class ServerControl1: WebControl { [Bindable(true)] [Category("Appearance")] [DefaultValue("")] [Localizable(true)] public string Text { get { String s = (String)ViewState["Text"] ; return ((s == nulo)? "[" + this.ID + "]" : s); } } substituição protegida void RenderContents (saída HtmlTextWriter) { output.Write (Texto);
O código acima é gerado automaticamente para um controle personalizado. Eventos e métodos podem ser adicionados a classes de controle customizadas.
Vamos estender o controle personalizado anterior denominado ServerControl1. Vamos fornecer um método chamado checkpalindrome que lhe dará permissão para verificar o palíndromo.
Palíndromo é uma palavra/valor literal que ainda tem a mesma escrita quando invertido. Por exemplo, Malayalam, senhora, saras etc.
Estenda o código do seu controle personalizado e ele deverá ficar assim:
usando System;usando System.Collections.Generic;usando System.ComponentModel;usando System.Linq;usando System.Text;usando System.Web;usando System.Web.UI;usando System.Web.UI.WebControls;namespace CustomControls{ [ DefaultProperty("Texto")] [ToolboxData("<{0}:ServerControl1 runat=server></{0}:ServerControl1 >")] público class ServerControl1: WebControl { [Bindable(true)] [Category("Appearance")] [DefaultValue("")] [Localizable(true)] public string Text { get { String s = (String)ViewState["Text"] ; return ((s == nulo)? "[" + this.ID + "]" : s); } } substituição protegida void RenderContents(saída HtmlTextWriter) { if (this.checkpanlindrome()) { output.Write("Este é um palíndromo: <br />"); >"); saída.Write("<B>"); saída.Write(Texto); saída.Write("</B>"); output.Write("</FONT>"); } else { output.Write("Este não é um palíndromo: <br />"); output.Write("<FONT size=5 color=red>"); saída.Write("<B>"); saída.Write(Texto); saída.Write("</B>"); saída.Write("</FONT>"); if (this.Text! = null) { String str = this.Text; String strtoupper = Text.ToUpper () rev = strtoupper.ToCharArray(); rev); if (strtoupper == strrev) { return true } else { return false } } else { return false;
Ao alterar o código de um espaço, você deve construir o método clicando em Build --> Build Solution para que as alterações possam ser refletidas em seu projeto. Adicione uma caixa de texto e um controle de botão à página para que o usuário possa fornecer um trecho de texto. Quando o botão é clicado, ele é utilizado para verificar o palíndromo.
<form id="form1" runat="server"> <div> Digite uma palavra: <br /> <asp:TextBox ID="TextBox1" runat="server"> </asp:TextBox> <br /> < br /> <asp:Button ID="Button1" runat="server onclick="Button1_Click" Text="Verificar Palíndromo" /> <br /> <br /> <ccs:ServerControl1 ID="ServerControl11" runat="servidor" Text = "" /> </div></form>
O manipulador de eventos Click do botão simplesmente copia o texto da caixa de texto para a propriedade de texto do controle personalizado.
protected void Button1_Click(object sender, EventArgs e){ this.ServerControl11.Text = this.TextBox1.Text;}
Quando executado, o controle detecta palíndromos com sucesso.
Observe o seguinte:
(1) Quando você adiciona uma referência a um controle personalizado, ela é adicionada à caixa de ferramentas e você pode usá-la diretamente da caixa de ferramentas como outros controles.
(2) O método RenderContents da classe de controle personalizado foi substituído e você pode adicionar seus próprios métodos e eventos.
(3) O método RenderContents leva um parâmetro do tipo HtmlTextWriter, que será responsável por exibi-lo no navegador.