Artigo .net Magazine 64 - Criando um controle personalizado para ASP.NET

Artigo da Revista .NET Magazine - Edição 64.

Esse artigo faz parte da revista .NET Magazine edição 64. Clique aqui para ler todos os artigos desta edição

Web – Expert – Mão na Massa

Criando um controle personalizado para ASP.NET

Criação de WebControl para controle de CheckBox com 3 estados

 

 

 

Do que trata o artigo

·Criação de Web Control;

·Javascript;

·Embedded Resource;

·WebResources.

·Referência de Assemblies no Web.Config.

Para que serve?

Criar um componente web de três estados semelhante ao checkbox, que irá indicar quando seu valor está selecionado, não selecionado ou nulo.

Em que situação o tema é útil

Em todos os projetos que necessitem controlar estados de ativo, inativo ou não definido e exibir isso de uma forma amigável ao usuário.

 

Resumo do DevMan

Aqui veremos a criação de um controle web personalizado, baseado no controle CheckBox do ASP.NET que terá por diferencial, gerenciar três estados distintos. Além do selecionado, não selecionado, que já são comuns, irá indicar quando o valor está nulo.

 

Na grande parte dos projetos que desenvolvemos, sempre nos deparamos com a necessidade de apresentar algum dado com o estado ligado/desligado, verdadeiro/falso ou o básico zero/um, mas e se o valor representado não estiver preenchido. Onde fica o nulo nesta história? Neste artigo veremos a implementação de um controle web, um checkbox, para manutenção deste terceiro estado.

Criando o ambiente

Para criarmos e testarmos o Three State CheckBox (nome dado ao projeto), usaremos dois projetos no Visual Studio, um Class Library e um ASP.NET Web Application, respectivamente DevmediaWebControl e TestCheckBoxControl. O Projeto DevmediaWebControl deve ser configurado conforme mostra a Figura 1, onde é necessário alterar o Assembly name e o Default namespace.

 

Figura 1. Configuração do projeto DevMediaWebControl

 

Nota do DevMan

A configuração das propriedades do projeto em relação ao nome do Assembly e Namespace permite fazermos a organização lógica das classes criadas em nossos projetos.

 

Por padrão, uma aplicação do tipo ClassLibrary não traz a referência do assembly System.Web. Essa referência é necessária para que possamos criar um novo WebControl. Vamos adicionar a referência deste assembly em nosso projeto. Para isso, no Solution Explorer, clique com o botão direito do mouse na pasta References e selecione a opção Add Reference e selecione o assembly necessário, como mostra a Figura 2. Além do System.Web precisaremos também associar as bibliotecas System.Drawing e System.Design.

 

Figura 2. Associação de Assembly

 

Para simular o comportamento visual do checkbox padrão Asp.Net serão utilizadas algumas imagens conforme apresentado na Tabela 1, organizadas conforme Figura 3.

 

Imagem

Nome

Descrição

CI.gif

Checked Image

CID.gif

Checked Image Disabled

CIO.gif

Checked Image Over

UI.gif

Undefined Image

UIO.gif

Undefined Image Over

UNI.gif

Unchecked Image

UNID.gif

Unchecked Image Disabled

UNIO.gif

Unchecked Image Over

Tabela 1. Relação de Imagens

 

Figura 3. Organização das imagens

 

Nota: As imagens apresentadas neste artigo podem ser encontradas juntamente com o download do código deste componente.

 

Mão na massa

No nosso projeto estamos utilizando as imagens apresentadas na Figura 3. Como opção, você poderá associar outras imagens em tempo de desenvolvimento, sendo que por padrão o componente terá em sua biblioteca todas essas imagens associadas como recursos web (WebResources).

Para que as imagens sejam compiladas em conjunto com o nosso código elas precisam ser marcadas individualmente como Embedded Resources, para isso, selecione-as no Solution Explorer, abra suas propriedades através da tecla de atalho F4 ou clique com o botão da direita e escolha a opção Properties e, atribua à propriedade Build Action a opção Embedded Resource, como mostra a Figura 4.

 " [...] continue lendo...

Artigos relacionados