Compartilhar via

Demonstra Passo a passo: Criação de um controle composto com Visual C#

  • Artigo

Controles compostos fornecem um meio pelo qual interfaces gráficas personalizadas podem ser criados e reutilizados. Um controle composto é essencialmente um componente com uma representação visual. Como tal, ele pode consistir de um ou mais Windows Forms controles, componentes ou blocos de código que estendem a funcionalidade Validando entrada de usuário, modificando propriedades de vídeo, ou executar outras tarefas necessárias pelo autor. Controles compostos podem ser colocados em formulários do Windows, da mesma maneira como os outros controles. Na primeira parte desta explicação passo a passo, você criar um controle composto simple, chamado ctlClock. Na segunda parte da explicação, você pode estender a funcionalidade do ctlClock por meio de herança.

ObservaçãoObservação

As caixas de diálogo e comandos de menu demonstradas podem ser diferentes daqueles descritos na Ajuda, dependendo das configurações ativas ou configurações de edição. Para alterar as configurações, escolha Import and Export Settings sobre o Ferramentas menu. Para obter mais informações, consulte Trabalhando com configurações.

Criando o projeto

Quando você cria um novo projeto, você pode especificar seu nome para definir o namespace raiz, o nome do assembly e o nome do projeto e garantir que o componente padrão será no namespace correto.

Para criar a biblioteca de controle de ctlClockLib e o controle de ctlClock

  1. No menu Arquivo, clique em Novo e, em seguida, clique em Projeto. para abrir a caixa de diálogo Novo Projeto.

  2. Na lista de Visual C# projetos, selecionados o Windows Forms Control Library modelo de projeto, o tipo de ctlClockLib na nome caixa e clique OK.

    O nome do projeto, ctlClockLib, também é atribuído ao namespace raiz por padrão. O namespace principal é usado para qualificar os nomes dos componentes no conjunto de módulos (assembly). Por exemplo, se dois assemblys fornecem componentes chamados ctlClock, você pode especificar o ctlClock usando o componente ctlClockLib.ctlClock.

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

    ObservaçãoObservação

    Por padrão, um controle composto herda de UserControl classe fornecida pelo sistema. O UserControl classe fornece a funcionalidade necessária para todos os controles de composição e implementa o padrão métodos e propriedades.

  4. Sobre o arquivo menu, clique em Salvar tudo para salvar o projeto.

Adicionando o Windows controles e componentes para o controle composto

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

Para adicionar um rótulo e um Timer para seu controle composto

  1. No Solution Explorer, clique com o botão direito ctlClock.cse em seguida, clique em View Designer.

  2. No caixa de ferramentas, expanda o Controles comuns nó e clique duas vezes em rótulo.

    A Label controle chamado label1 é adicionado ao seu controle na superfície de designer.

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

    Propriedade

    Alterar para

    Nome

    lblDisplay

    Texto

    (espaço em branco)

    AlinhamentoDoTexto

    MiddleCenter

    Font.Size

    14

  4. No caixa de ferramentas, expanda o componentes nó e clique duas vezes em Timer.

    Porque um Timer é um componente, ele não tem representação visual em tempo de execução. Portanto, ela não aparece com os controles na superfície de design, mas sim no Component Designer (Bandeja inferior da superfície de design).

  5. No Component Designer, clique em timer1e defina a Interval propriedade para 1000 e o Enabled propriedade para true.

    O Interval propriedade controla a freqüência com que o Timer escalas de componente. Cada vez que timer1 tiques, ele executará o código de timer1_Tick evento. O intervalo representa o número de milissegundos entre as escalas.

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

  7. Modificar o código para que se assemelha ao seguinte exemplo de código. Certifique-se de alterar o modificador de acesso de private para protected.

    [C#]

    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 a ser mostrado na lblDisplay. Porque o intervalo de timer1 foi definido como 1000, esse evento ocorrerá em cada mil milissegundos, portanto a atualização a cada segundo de hora atual.

  8. Modificar o método a ser substituíveis com o virtual palavra-chave. Para obter mais informações, consulte o "herdar de um controle de usuário" seção abaixo.

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

  9. Sobre o arquivo menu, clique em Salvar tudo para salvar o projeto.

Adicionar propriedades para o controle composto

O controle do relógio agora encapsula um Label controle e um Timer componente, cada um com seu próprio conjunto de propriedades inerente. Enquanto as propriedades individuais desses controles não será acessíveis a usuários subseqüentes do seu controle, você pode criar e expor propriedades personalizadas, escrevendo os apropriado blocos de código. O procedimento a seguir, você irá adicionar propriedades para o controle que permitem ao usuário alterar a cor de plano de fundo e texto.

Para adicionar uma propriedade para o controle composto

  1. No Solution Explorer, clique com o botão direito ctlClock.cse em seguida, clique em Exibir código.

    O O Editor de código para o controle abre.

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

    [C#]

    private Color colFColor;
private Color colBColor;

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

  3. Digite o seguinte código abaixo de declarações de variáveis a partir da etapa 2.

    [C#]

    // 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 faz duas propriedades personalizadas, ClockForeColor e ClockBackColor, disponível para usuários subseqüentes de controle. O get e set instruções fornecem para armazenamento e recuperação de valor da propriedade, bem como o código para implementar a funcionalidade apropriada para a propriedade.

  4. Sobre o arquivo menu, clique em Salvar tudo para salvar o projeto.

Testando o controle

Controles não são aplicativos autônomos; eles devem ser hospedados em um recipiente. Testar o comportamento em tempo de execução do controle e exercício de suas propriedades com o Contêiner de teste de UserControl. Para obter mais informações, consulte Como: Teste o comportamento de tempo de execução de um UserControl.

Para testar seu controle.

  1. Pressione F5 para compilar o projeto e executar o controle da Contêiner de teste de UserControl.

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

  3. Escolha uma cor clicando nele.

    A cor de plano de fundo do seu controle altera a cor selecionada.

  4. Use uma seqüência semelhante de eventos para verificar se a ClockForeColor propriedade está funcionando como esperado.

    Esta seção e seções anteriores, você viu como os 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 no seu controle composto e como testar o seu controle após a conclusão. Na próxima seção, você aprenderá como construir um controle composto herdado usando o ctlClock como base.

Herdar de um controle composto

Nas seções anteriores, você aprendeu como combinar o código, componentes e controles do Windows em composição de controles reutilizável. Seu controle composto agora pode ser usado como base no qual outros controles podem ser criados. O processo de derivar uma classe de uma classe base é chamado herança. Nesta seção, você irá criar um controle composto chamado ctlAlarmClock. Esse controle será derivado controle pai, ctlClock. Você aprenderá a estender a funcionalidade de ctlClock , substituindo os métodos de pai e a adição de novos métodos e propriedades.

A primeira etapa na criação de um controle herdado é derivar a seu pai. Essa ação cria um novo controle que tem todas as propriedades, métodos e as características gráficas do controle pai, mas também pode atuar como uma base para a adição de funcionalidade de nova ou modificada.

Para criar o controle herdado

  1. No Solution Explorer, clique com o botão direito ctlClockLib, aponte para Adde em seguida, clique em O controle de usuário.

    A caixa de diálogo Adicionar Novo Item aparece.

  2. Selecione o Herdadas de controle de usuário modelo.

  3. No nome , digite ctlAlarmClock.cse em seguida, clique em Add.

    O O selecionador de herança caixa de diálogo aparece.

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

  5. No Solution Explorer, procure os projetos atuais.

    ObservaçãoObservação

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

Adicionar as propriedades de alarme

Propriedades são adicionadas a um controle herdado da mesma forma que eles são adicionados a um controle composto. Agora, você usará a sintaxe de declaração de propriedade para adicionar duas propriedades para o controle: AlarmTime, que irá armazenar o valor de data e hora em que o alarme é desativado, e AlarmSet, que indica se o alarme é definido.

Para adicionar propriedades a seu controle composto

  1. No Solution Explorer, clique com o botão direito ctlAlarmClocke em seguida, clique em Exibir código.

  2. Localize o public class instrução. Observe que o controle herda de ctlClockLib.ctlClock. Sob a chave de abertura ({) a instrução, digite o código a seguir.

    [C#]

    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;
    }
}

Adicionando a Interface gráfica do controle

Seu controle herdado tem uma interface visual que é idêntica ao controle que herda do. Ela possui os mesmos controles constituintes como o controle pai, mas as propriedades dos controles constituintes não estará disponíveis a menos que especificamente estavam expostos. Você pode adicionar a interface gráfica de um controle composto herdado da mesma maneira como você adicionaria a qualquer controle composto. Para continuar a adicionar a interface visual do despertador, você adicionará um controle label que piscará quando é soar o alarme.

Para adicionar o controle de rótulo

  1. No Solution Explorer, clique com o botão direito ctlAlarmClocke em seguida, clique em View Designer.

    O designer para ctlAlarmClock abre na janela principal.

  2. Clique na parte de exibição do controle e, em seguida, exibir a janela de propriedades.

    ObservaçãoObservação

    Enquanto todas as propriedades são exibidas, eles estão esmaecidos. Isso indica que essas propriedades são nativas do lblDisplay e não pode ser modificado ou acessado 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 meios.
    ObservaçãoObservação

    Se desejar que os usuários subseqüentes do seu controle composto tenham acesso aos seus controles internos, declará-los como public ou protected. Isso permitirá que você definir e modificar propriedades de controles contidos no seu controle composto, usando o código apropriado.

  3. Adicionar um Label o controle para o seu controle composto.

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

    Propriedade

    Configuração

    Nome

    lblAlarm

    Texto

    Alarme!

    AlinhamentoDoTexto

    MiddleCenter

    Visible

    false

Adicionando a funcionalidade de alarme

Nos procedimentos anteriores, você adicionou um controle que irá ativar a funcionalidade de alarme no seu controle composto e propriedades. Neste procedimento, você irá adicionar código para comparar a hora atual para a hora do alarme e, se eles forem iguais, um alarme de Flash. Substituindo o timer1_Tick o método de ctlClock e adicionando código adicional para ele, você estenderá a capacidade de ctlAlarmClock , mantendo toda a funcionalidade inerente de ctlClock.

Para substituir o método timer1_Tick de ctlClock

  1. No O Editor de código, localize o private bool blnAlarmSet; instrução. Imediatamente abaixo dela, adicione a instrução a seguir.

    [C#]

    private bool blnColorTicker;

  2. No O Editor de código, localize a chave de fechamento (}) no final da classe a. Antes da chave, adicione o seguinte código.

    [C#]

    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 desse código realiza várias tarefas. O 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, chama o método substitui invocando o base.timer1_Tick a instrução, garantindo que toda a funcionalidade incorporada no controle original é reproduzida nesse controle. Em seguida, executa o código adicional para incorporar a funcionalidade de alarme. Um controle de rótulo piscando aparecerá quando o alarme ocorre.

    O controle do alarm clock está quase concluído. A única coisa que permanece é implementar uma maneira para desativá-la. Para fazer isso, você irá adicionar código para o lblAlarm_Click método.

Para implementar o método de suspensão dos sinais

  1. No Solution Explorer, clique com o botão direito ctlAlarmClock.cse em seguida, clique em View Designer.

    O designer abre.

  2. Adicione um botão no controle. Defina as propriedades do botão, como segue.

    Propriedade

    Valor

    Nome

    btnAlarmOff

    Texto

    Desabilitar o alarme

  3. No designer, clique duas vezes em btnAlarmOff.

    O O Editor de código abre para o private void btnAlarmOff_Click linha.

  4. Modificar esse método para que se parece com o código a seguir.

    [C#]

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

  5. Sobre o arquivo menu, clique em Salvar tudo para salvar o projeto.

Usando o controle herdado em um formulário.

Você pode testar seu controle herdado da mesma maneira que você testou o controle da classe base, ctlClock: Pressione F5 para compilar o projeto e executar o controle da Contêiner de teste de UserControl. Para obter mais informações, consulte Como: Teste o comportamento de tempo de execução de um UserControl.

Para colocar o controle para usar, você precisará hospedá-lo em um formulário. Assim como um controle composto padrão, um controle composto herdado não é autônomo e deve ser hospedado em um formulário ou outro recipiente. Desde que ctlAlarmClock tem uma profundidade maior funcionalidade, código adicional é necessária para testar o proprietário. Neste procedimento, você irá escrever um programa simples para testar a funcionalidade de ctlAlarmClock. Você irá escrever código para definir e exibir o AlarmTime propriedade de ctlAlarmClocke testar suas funções inerentes.

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

  1. No Solution Explorer, clique com o botão direito ctlClockLibe em seguida, clique em Build.

  2. Adicionar um novo Windows Application de projeto à solução e o nome de teste.

  3. No Solution Explorer, clique com o botão direito do referências o nó para o seu projeto de teste. Clique em Adicionar referência de para exibir o Add Reference caixa de diálogo. Clique na guia projetos. O ctlClockLib projeto será listado em Nome do projeto. Clique duas vezes no projeto para adicionar a referência ao projeto de teste.

  4. No Solution Explorer, clique com o botão direito testee em seguida, clique em Build.

  5. No caixa de ferramentas, expanda o ctlClockLib componentes nó.

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

  7. No Toolbox, localize e clique duas vezes em DateTimePicker para adicionar uma DateTimePicker controle ao formulário e 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.

    Controle

    Propriedade

    Valor

    label1

    Texto

    (espaço em branco)

     

    Nome

    lblTest

    dateTimePicker1

    Nome

    dtpTest

     

    Formato

    Time

  10. No designer, clique duas vezes em dtpTest.

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

  11. Modificar o código para que ele é semelhante ao seguinte.

    [C#]

    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 Solution Explorer, clique com o botão direito testee em seguida, clique em Set as StartUp Project.

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

    O programa de teste é iniciado. Observe que a hora atual é atualizada a ctlAlarmClock controle e que a hora inicial é mostrada na DateTimePicker de controle.

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

  15. Usando o teclado, defina um valor de minutos é um minuto de maior que a hora atual mostrada por ctlAlarmClock.

    O tempo para a configuração de alarme é mostrado na lblTest. Aguarde até que o tempo exibido atingir o tempo de configuração de alarme. Quando o tempo exibido atinge o tempo para o qual o alarme for definido, o lblAlarm será flash.

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

    Esta explicação passo a passo abordou vários conceitos-chave. Você aprendeu a criar um controle composto pela combinação de controles e componentes em um recipiente de controle composto. Você aprendeu a adicionar propriedades a seu controle e escrever código para implementar a funcionalidade personalizada. A última seção, você aprendeu a estender a funcionalidade de um determinado controle composto por meio de herança e alterar a funcionalidade dos métodos de host, substituindo esses métodos.

Consulte também

Tarefas

Como: Exibir um controle na escolher a caixa de diálogo itens da caixa de ferramentas

Demonstra Passo a passo: Herdar de um controle Windows Forms com Visual C#

Conceitos

Variedades de controles personalizados

Outros recursos

Programando com Componentes

Passo a passo de criação do componente