Criando Templated Controls

Imagine que você precise criar um User Control, porém, precisa permitir que o desenvolvedor defina como ele será exibido na página.

Imagine que você não saiba como seu controle aparecerá na tela do usuário, onde somente o desenvolvedor, em tempo de design, definirá isso. Isto significa que não podemos incluir no nosso controle nenhuma Texbox, Labels, ou qualquer que seja outro controle. Não sabemos se os dados serão exibidos como link, caixas de texto ou áreas, por exemplo.

Templated User Controls resolve esta questão. Para criar um Templated User Control, você precisa de uma classe que implemente a interface INamingContainer e herde da classe Control. A interface INamingContainer define classes que são contêiners para controles, como as classes Page, Gridview e outras. Você precisa dela para quando quiser renderizar o mesmo controle várias vezes em tempo de execução.

Para criar seu Templated User Control, siga os seguintes passos:

Adicione um UserControl ao seu projeto e nomeie-o para PessoaControl.ascx
Arraste um PlaceHolder ao arquivo .ascx e nomeie-o para PessoaHolder
No CodeBehind do seu .ascx, adicione as propriedades Nome, Cidade e Idade à sua classe. Adicione também uma propriedade do tipo ITemplate.

public ITemplate PessoaTemplate
{
get { return _PessoaTemplate; }
set { _PessoaTemplate = value; }
}

private ITemplate _PessoaTemplate;

Na pasta App_Code, adicione uma classe chamada PessoaContainer, que será a classe implementada pela interface INamingContainer. Não esqueça que ela também herda da classe Control. Essa classe será usada pelo controle para exibir as propriedades na página. Portanto, defina as mesmas propriedades públicas que usou no CodeBehind do seu .ascx .

public class PessoaContainer:Control, INamingContainer
{
public PessoaContainer(string _nome, string _cidade, int _idade)
{
Nome = _nome;
Cidade = _cidade;
Idade = _idade;
}
private string _nome;
public string Nome
{
get { return _nome; }
set { _nome = value; }
}
private string _cidade;
public string Cidade
{
get { return _cidade; }
set { _cidade = value; }
}
private int _idade;
public int Idade
{
get { return _idade; }
set { _idade = value; }
}
}

Agora volte ao CodeBehind do seu controle e aplique os atributos TamplateContainer, passando a classe container PessoaContainer à ele e o atributo PersistenceMode.

[PersistenceMode(PersistenceMode.InnerProperty)]
[TemplateContainer(typeof(PessoaContainer))]
public ITemplate PessoaTemplate
{
get { return _PessoaTemplate; }
set { _PessoaTemplate = value; }
}

No método Page_Init() do controle, verifique se a propriedade PessoaTemplate está definida.
Se estiver definida, instancie a classe container e crie uma instância do ItemTmplate dentro da classe container.

public void Page_Init()
{
PessoaHolder.Controls.Clear();
if (PessoaTemplate == null)
{
PessoaHolder.Controls.Add(new LiteralControl(“Template não foi definido”));
}

PessoaContainer pContainer = new PessoaContainer(Nome, Cidade, Idade);
PessoaTemplate.InstantiateIn(pContainer);
PessoaHolder.Controls.Add(pContainer);
}

Agora adicione um webform no projeto e registre o controle:
<%@ Register TagName=”PessoaControl” TagPrefix=”uc1″ Src=”~/PessoaControl.ascx” %>

Adicione um controle à página e defina as propriedades. Veja que você pode formatar as informações do modo que puder, dentro da tag <PessoaTemplate>:

<uc1:PessoaControl ID=”PessoaControl1″ runat=”server” Nome=”Luciano Carvalho da Silva”
Cidade=”Rio de Janeiro” Idade=”26″ >
<PessoaTemplate>
<select id=”Select1″>
<option><%# Container.Nome %></option>
<option><%# Container.Cidade %></option>
<option><%# Container.Idade %></option>
</select>
</PessoaTemplate>
</uc1:PessoaControl>

Chame o método DataBind() no Page_Load() da sua página.

Note que o controle não é exibido no Design. Mas se você executar a página, poderá ver as modificações.

Abraços, e até a próxima.


About this entry