Partilhar via

Passo a passo: Criar um controle composto com C#

Os controles compostos fornecem um meio pelo qual interfaces gráficas personalizadas podem ser criadas e reutilizadas. Um controle composto é essencialmente um componente com uma representação visual. Como tal, ele pode consistir em um ou mais controles do Windows Forms, componentes ou blocos de código que podem estender a funcionalidade validando a entrada do usuário, modificando as propriedades de exibição ou executando outras tarefas exigidas pelo autor. Os controles compostos podem ser colocados no Windows Forms da mesma maneira que outros controles. Na primeira parte deste passo a passo, você cria um controle composto simples chamado ctlClock. Na segunda parte do guia passo a passo, a funcionalidade de ctlClock é estendida através da herança.

Criar o projeto

Ao criar um novo projeto, você especifica seu nome para definir o namespace raiz, o nome do assembly e o nome do projeto e garante que o componente padrão esteja no namespace correto.

Para criar a biblioteca de controle ctlClockLib e o controle ctlClock

  1. No Visual Studio, crie um novo projeto da Biblioteca de Controle do Windows Forms e nomeie-o ctlClockLib.

    O nome do projeto, ctlClockLib, também é atribuído ao namespace raiz por padrão. O namespace raiz é usado para qualificar os nomes dos componentes no assembly. Por exemplo, se dois assemblies fornecerem componentes chamados ctlClock, você poderá especificar seu ctlClock componente usando ctlClockLib.ctlClock.

  2. No Gerenciador de Soluções, clique com o botão direito do mouse em UserControl1.cs e clique em Renomear. Altere o nome do arquivo para ctlClock.cs. Clique no botão Sim quando lhe for perguntado se pretende mudar o nome de todas as referências para o elemento de código "UserControl1".

    Observação

    Por padrão, um controle composto herda da UserControl classe fornecida pelo sistema. A UserControl classe fornece a funcionalidade exigida por todos os controles compostos e implementa métodos e propriedades padrão.

  3. No menu Arquivo , clique em Salvar tudo para salvar o projeto.

Adicionar controles e componentes do Windows ao controle composto

Uma interface visual é uma parte essencial do seu controlo composto. Essa interface visual é implementada pela adição de um ou mais controles do Windows à superfície do designer. Na demonstração a seguir, você incorporará controles do Windows em seu controle composto e escreverá código para implementar a funcionalidade.

Para adicionar um Rótulo e um Temporizador ao seu controle composto

  1. No Gerenciador de Soluções, clique com o botão direito do mouse em ctlClock.cs e clique em Exibir Designer.

  2. Na Caixa de Ferramentas, expanda o nó Controles Comuns e clique duas vezes em Rótulo.

    Um Label controle chamado label1 é adicionado ao seu controle na superfície do designer.

  3. No designer, clique em label1. Na janela Propriedades, defina as seguintes propriedades.

    Propriedade Alterar para
    Nome lblDisplay
    Texto (blank space)
    TextAlign MiddleCenter
    Tamanho da Fonte 14

  4. Na Caixa de Ferramentas, expanda o nó Componentes e clique duas vezes em Timer.

    Como a Timer é um componente, ele não tem representação visual em tempo de execução. Portanto, ele não aparece com os controles na superfície do designer, mas sim no Component Designer (uma bandeja na parte inferior da superfície do designer).

  5. No Component Designer, clique em timer1 e defina a Interval propriedade como 1000 e a Enabled propriedade como true.

    A Interval propriedade controla a frequência com que o Timer componente é acionado. Cada vez que timer1 dispara, ele executa o código do evento timer1_Tick. O intervalo representa o número de milissegundos entre ticks.

  6. No Component Designer, clique duas vezes em timer1 para ir para o timer1_Tick evento de ctlClock.

  7. Modifique o código para que ele se assemelhe ao exemplo de código a seguir. Certifique-se de alterar o modificador de acesso de private para protected.

    protected void timer1_Tick(object sender, System.EventArgs e)
{
    // Causes the label to display the current time.
    lblDisplay.Text = DateTime.Now.ToLongTimeString();
}

    Esse código fará com que a hora atual seja mostrada em lblDisplay. Como o intervalo de timer1 foi definido como 1000, esse evento ocorrerá a cada mil milissegundos, atualizando assim a hora atual a cada segundo.

  8. Modifique o método para ser substituível pela virtual palavra-chave. Para obter mais informações, consulte a seção "Herdando de um controle de usuário" abaixo.

    protected virtual void timer1_Tick(object sender, System.EventArgs e)

  9. No menu Arquivo , clique em Salvar tudo para salvar o projeto.

Adicionar propriedades ao controle composto

Seu controle de relógio agora encapsula um Label controle e um Timer componente, cada um com seu próprio conjunto de propriedades inerentes. Embora as propriedades individuais desses controles não sejam acessíveis aos usuários subsequentes do seu controle, você pode criar e expor propriedades personalizadas escrevendo os blocos de código apropriados. No procedimento a seguir, você adicionará propriedades ao seu controle que permitem que o usuário altere a cor do plano de fundo e do texto.

Para adicionar uma propriedade ao seu controle composto

  1. No Gerenciador de Soluções, clique com o botão direito do mouse em ctlClock.cs e clique em Exibir Código.

    O Editor de Códigos para seu controle é aberto.

  2. Localize a instrução public partial class ctlClock. Abaixo da chave de abertura ({), digite o código a seguir.

    private Color colFColor;
private Color colBColor;

    Essas instruções criam as variáveis privadas que você usará para armazenar os valores das propriedades que está prestes a criar.

  3. Insira ou cole o código a seguir abaixo das declarações de variáveis da etapa 2.

    // Declares the name and type of the property.
public Color ClockBackColor
{
    // Retrieves the value of the private variable colBColor.
    get
    {
        return colBColor;
    }
    // Stores the selected value in the private variable colBColor, and
    // updates the background color of the label control lblDisplay.
    set
    {
        colBColor = value;
        lblDisplay.BackColor = colBColor;
    }
}
// Provides a similar set of instructions for the foreground color.
public Color ClockForeColor
{
    get
    {
        return colFColor;
    }
    set
    {
        colFColor = value;
        lblDisplay.ForeColor = colFColor;
    }
}

    O código anterior torna disponíveis duas propriedades personalizadas, ClockForeColor e ClockBackColor, para usuários subsequentes desse controlo. As declarações get e set fornecem armazenamento e recolha do valor da propriedade, bem como código para implementar a funcionalidade apropriada à propriedade.

  4. No menu Arquivo , clique em Salvar tudo para salvar o projeto.

Testar o controle

Os controlos não são aplicações autónomas; eles devem ser hospedados em um contêiner. Teste o comportamento de tempo de execução do controle e exerça suas propriedades com o contêiner de teste UserControl. Para obter mais informações, consulte Como testar o comportamento Run-Time de um UserControl.

Para testar o seu controlo

  1. Pressione F5 para criar o projeto e executar seu controle no UserControl Test Container.

  2. Na grade de propriedades do contêiner de teste, localize a ClockBackColor propriedade e selecione a propriedade para exibir a paleta de cores.

  3. Escolha uma cor clicando nela.

    A cor de fundo do seu controlo muda para a cor que selecionou.

  4. Use uma sequência semelhante de eventos para verificar se a ClockForeColor propriedade está funcionando conforme o esperado.

    Nesta seção e nas seções anteriores, você viu como componentes e controles do Windows podem ser combinados com código e empacotamento para fornecer funcionalidade personalizada na forma de um controle composto. Você aprendeu a expor propriedades em seu controle composto e como testar seu controle depois que ele for concluído. Na próxima seção, você aprenderá como construir um controle composto herdado usando ctlClock como base.

Herdar de um controle composto

Nas seções anteriores, você aprendeu como combinar controles, componentes e código do Windows em controles compostos reutilizáveis. Seu controle composto agora pode ser usado como uma base sobre a qual outros controles podem ser construídos. O processo de derivar uma classe de uma classe base é chamado de herança. Nesta seção, você criará um controle composto chamado ctlAlarmClock. Este controlo será derivado do seu controlo-mãe, ctlClock. Você aprenderá a estender a funcionalidade do ctlClock substituindo os métodos pai e adicionando novos métodos e propriedades.

O primeiro passo para criar um controle herdado é derivá-lo de seu pai. Essa ação cria um novo controle que tem todas as propriedades, métodos e características gráficas do controle pai, mas também pode atuar como uma base para a adição de funcionalidade nova ou modificada.

Para criar o controle herdado

  1. No Gerenciador de Soluções, clique com o botão direito do mouse em ctlClockLib, aponte para Adicionar e clique em Controle de Usuário.

    A caixa de diálogo Adicionar Novo Item é aberta.

  2. Selecione o modelo Controle de usuário herdado .

  3. Na caixa Nome , digite ctlAlarmClock.cse clique em Adicionar.

    A caixa de diálogo Seletor de Herança é exibida.

  4. Em Nome do componente, clique duas vezes em ctlClock.

  5. No Gerenciador de Soluções, navegue pelos projetos atuais.

    Observação

    Um arquivo chamado ctlAlarmClock.cs foi adicionado ao projeto atual.

Adicionar as propriedades de alarme

As propriedades são adicionadas a um controle herdado da mesma forma que são adicionadas a um controle composto. Agora você usará a sintaxe da declaração de propriedade para adicionar duas propriedades ao seu controle: AlarmTime, que armazenará o valor da data e hora em que o alarme será disparado e AlarmSet, que indicará se o alarme está definido.

Para adicionar propriedades ao seu controle composto

  1. No Gerenciador de Soluções, clique com o botão direito do mouse em ctlAlarmClock e clique em Exibir Código.

  2. Localize a instrução public class. Observe que seu controle herda de ctlClockLib.ctlClock. Abaixo da chaveta de abertura do statement ({)), digite o código a seguir.

    private DateTime dteAlarmTime;
private bool blnAlarmSet;
// These properties will be declared as public to allow future
// developers to access them.
public DateTime AlarmTime
{
    get
    {
        return dteAlarmTime;
    }
    set
    {
        dteAlarmTime = value;
    }
}
public bool AlarmSet
{
    get
    {
        return blnAlarmSet;
    }
    set
    {
        blnAlarmSet = value;
    }
}

Adicionar à interface gráfica do controlo

Seu controle herdado tem uma interface visual que é idêntica ao controle do qual ele herda. Possui os mesmos controlos constituintes que o seu controlo-mãe, mas as propriedades dos controlos constituintes não estarão disponíveis a menos que tenham sido especificamente expostas. Você pode adicionar à interface gráfica de um controle composto herdado da mesma maneira que adicionaria a qualquer controle composto. Para continuar a acrescentar à interface visual do seu despertador, irá adicionar um controlo de rótulo que piscará quando o alarme estiver a soar.

Para adicionar o controle de rótulo

  1. No Gerenciador de Soluções, clique com o botão direito do mouse em ctlAlarmClock e clique em Exibir Designer.

    O designer for ctlAlarmClock abre na janela principal.

  2. Clique na parte de exibição do controle e exiba a janela Propriedades.

    Observação

    Enquanto todas as propriedades são exibidas, elas ficam esmaecidas. Isso indica que essas propriedades são nativas lblDisplay e não podem ser modificadas ou acessadas na janela Propriedades. Por padrão, os controles contidos em um controle composto são private, e suas propriedades não são acessíveis por qualquer meio.

    Observação

    Se você quiser que os usuários subsequentes do seu controle composto tenham acesso aos seus controles internos, declare-os como public ou protected. Isso permitirá que você defina e modifique as propriedades dos controles contidos em seu controle composto usando o código apropriado.

  3. Adicione um Label controlador ao seu controlador composto.

  4. Usando o mouse, arraste o Label controle imediatamente abaixo da caixa de exibição. Na janela Propriedades, defina as seguintes propriedades.

    Propriedade Configurações
    Nome lblAlarm
    Texto Alarme!
    TextAlign MiddleCenter
    visível false

Adicionar a funcionalidade de alarme

Nos procedimentos anteriores, você adicionou propriedades e um controle que habilitará a funcionalidade de alarme em seu controle composto. Neste procedimento, você adicionará código para comparar o tempo atual com o tempo de alarme e, se forem os mesmos, para piscar um alarme. Ao substituir o timer1_Tick método e ctlClock adicionar código adicional a ele, você estenderá a capacidade de ctlAlarmClock manter toda a funcionalidade inerente do ctlClock.

Para substituir o método timer1_Tick de ctlClock

  1. No Editor de códigos, localize a private bool blnAlarmSet; instrução. Imediatamente abaixo dela, coloque a seguinte afirmação.

    private bool blnColorTicker;

  2. No Editor de Códigos, localize a chave de fechamento (}) no final da classe. Imediatamente antes da chave, adicione o seguinte código.

    protected override void timer1_Tick(object sender, System.EventArgs e)
{
    // Calls the Timer1_Tick method of ctlClock.
    base.timer1_Tick(sender, e);
    // Checks to see if the alarm is set.
    if (AlarmSet == false)
        return;
    else
        // If the date, hour, and minute of the alarm time are the same as
        // the current time, flash an alarm.
    {
        if (AlarmTime.Date == DateTime.Now.Date && AlarmTime.Hour ==
            DateTime.Now.Hour && AlarmTime.Minute == DateTime.Now.Minute)
        {
            // Sets lblAlarmVisible to true, and changes the background color based on
            // the value of blnColorTicker. The background color of the label
            // will flash once per tick of the clock.
            lblAlarm.Visible = true;
            if (blnColorTicker == false)
            {
                lblAlarm.BackColor = Color.Red;
                blnColorTicker = true;
            }
            else
            {
                lblAlarm.BackColor = Color.Blue;
                blnColorTicker = false;
            }
        }
        else
        {
            // Once the alarm has sounded for a minute, the label is made
            // invisible again.
            lblAlarm.Visible = false;
        }
    }
}

    A adição deste código realiza várias tarefas. A override instrução direciona o controle para usar esse método no lugar do método que foi herdado do controle base. Quando esse método é chamado, ele chama o método que ele substitui invocando a base.timer1_Tick instrução, garantindo que toda a funcionalidade incorporada no controle original seja reproduzida nesse controle. Em seguida, executa código adicional para incorporar a funcionalidade de alarme. Um controle de rótulo piscando aparecerá quando o alarme ocorrer.

    O seu controlo do despertador está quase completo. A única coisa que resta é implementar uma maneira de desligá-lo. Para fazer isso, você adicionará código ao lblAlarm_Click método.

Para implementar o método de desligamento

  1. No Gerenciador de Soluções, clique com o botão direito do mouse em ctlAlarmClock.cs e clique em Exibir Designer.

    O designer inicia.

  2. Adicione um botão ao controle. Defina as propriedades do botão da seguinte maneira.

    Propriedade Valor
    Nome btnAlarmOff
    Texto Desativar alarme

  3. No designer, clique duas vezes em btnAlarmOff.

    O Editor de Código abre na private void btnAlarmOff_Click linha.

  4. Modifique esse método para que ele se assemelhe ao código a seguir.

    private void btnAlarmOff_Click(object sender, System.EventArgs e)
{
    // Turns off the alarm.
    AlarmSet = false;
    // Hides the flashing label.
    lblAlarm.Visible = false;
}

  5. No menu Arquivo , clique em Salvar tudo para salvar o projeto.

Usar o controle herdado em um formulário

Você pode testar seu controle herdado da mesma forma que testou o controle de classe base, ctlClock: Pressione F5 para criar o projeto e executar seu controle no contêiner de teste UserControl. Para obter mais informações, consulte Como testar o comportamento Run-Time de um UserControl.

Para colocar seu controle em uso, você precisará hospedá-lo em um formulário. Como com um controle composto padrão, um controle composto herdado não pode ficar sozinho e deve ser hospedado em um formulário ou outro contêiner. Uma vez que ctlAlarmClock tem uma maior profundidade de funcionalidade, é necessário código adicional para testá-lo. Neste procedimento, você escreverá um programa simples para testar a funcionalidade do ctlAlarmClock. Você escreverá código para definir e exibir a AlarmTime propriedade de ctlAlarmClock, e testará suas funções inerentes.

Para criar e adicionar seu controle a um formulário de teste

  1. No Gerenciador de Soluções, clique com o botão direito do mouse em ctlClockLib e clique em Compilar.

  2. Adicione um novo projeto de aplicativo Windows Forms à solução e nomeie-o Test.

  3. No Gerenciador de Soluções, clique com o botão direito do mouse no nó Referências do seu projeto de teste. Clique em Adicionar referência para exibir a caixa de diálogo Adicionar referência . Clique na guia Projetos. Seu ctlClockLib projeto será listado em Nome do projeto. Clique duas vezes no projeto para adicionar a referência ao projeto de teste.

  4. No Gerenciador de Soluções, clique com o botão direito do mouse em Testar e clique em Compilar.

  5. Na Caixa de Ferramentas, expanda o nó ctlClockLib Componentes.

  6. Clique duas vezes em ctlAlarmClock para adicionar uma cópia do ctlAlarmClock seu formulário.

  7. Na Caixa de Ferramentas, localize e clique duas vezes em DateTimePicker para adicionar um DateTimePicker controle ao formulário e, em seguida, adicione um Label controle clicando duas vezes em Rótulo.

  8. Use o mouse para posicionar os controles em um local conveniente no formulário.

  9. Defina as propriedades desses controles da seguinte maneira.

    Controlo Propriedade Valor
    label1 Texto (blank space)
    Nome lblTest
    dateTimePicker1 Nome dtpTest
    Formato Time

  10. No designer, clique duas vezes em dtpTest.

    O Editor de Código abre para private void dtpTest_ValueChanged.

  11. Modifique o código para que ele seja semelhante ao seguinte.

    private void dtpTest_ValueChanged(object sender, System.EventArgs e)
{
    ctlAlarmClock1.AlarmTime = dtpTest.Value;
    ctlAlarmClock1.AlarmSet = true;
    lblTest.Text = "Alarm Time is " +
        ctlAlarmClock1.AlarmTime.ToShortTimeString();
}

  12. No Gerenciador de Soluções, clique com o botão direito do mouse em Testar e clique em Definir como Projeto de Inicialização.

  13. No menu Depurar , clique em Iniciar Depuração.

    O programa de teste é iniciado. Observe que a hora atual é atualizada no controlo ctlAlarmClock e que a hora de início é mostrada no controlo DateTimePicker.

  14. Clique no DateTimePicker onde são exibidos os minutos da hora.

  15. Usando o teclado, defina um valor para minutos que seja um minuto maior do que a hora atual mostrada pelo ctlAlarmClock.

    O tempo para a configuração do alarme é mostrado em lblTest. Aguarde até que a hora exibida atinja a hora de configuração do alarme. Quando o tempo exibido atinge o tempo para o qual o alarme é definido, o lblAlarm piscará.

  16. Desligue o alarme clicando em btnAlarmOff. Agora você pode redefinir o alarme.

Este artigo abordou uma série de conceitos-chave. Você aprendeu a criar um controle composto combinando controles e componentes em um contêiner de controle composto. Você aprendeu a adicionar propriedades ao seu controle e a escrever código para implementar a funcionalidade personalizada. Na última seção, você aprendeu a estender a funcionalidade de um determinado controle composto por meio de herança e a alterar a funcionalidade de métodos de host substituindo esses métodos.

Ver também

  • Last updated on