Partilhar via

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

  • 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 Basic projetos, selecionados o Windows 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 Solution Explorer, clique com o botão direito UserControl1.vbe em seguida, clique em Renomear. Altere o nome de arquivo para ctlClock.vb. 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.vbe em seguida, clique em View Designer.

  2. Na 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, não aparecem com os controles na superfície de design, mas sim no Component Designer (Bandeja inferior da superfície de design).

  5. No Designer de componente, clique em Timer1e defina a Interval propriedade para 1000 e o Enabled propriedade para True.

    O Interval propriedade controla a freqüência com que os tiques de componente timer. 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 Designer de componente, 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.

    [Visual Basic]

    Protected Sub Timer1_Tick(ByVal sender As Object, ByVal e As _
    System.EventArgs) Handles Timer1.Tick
    ' Causes the label to display the current time.  
    lblDisplay.Text = Format(Now, "hh:mm:ss")
End Sub

    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ível. Para obter mais informações, consulte o "herdar de um controle de usuário" seção abaixo.

    [Visual Basic]

    Protected Overridable Sub Timer1_Tick(ByVal sender As Object, ByVal _
    e As System.EventArgs) Handles Timer1.Tick

  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.vbe em seguida, clique em Exibir código.

    O Editor de código para o controle abre.

  2. Localize o Public Class ctlClock instrução. Abaixo dela, digite o seguinte código.

    [Visual Basic]

    Private colFColor as Color
Private colBColor as Color

    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. Insira o seguinte código abaixo de declarações de variáveis a partir da etapa 2.

    [Visual Basic]

    ' Declares the name and type of the property.
Property ClockBackColor() as Color
    ' Retrieves the value of the private variable colBColor.
    Get
        Return colBColor
    End Get
    ' Stores the selected value in the private variable colBColor, and 
    ' updates the background color of the label control lblDisplay.
    Set(ByVal value as Color)
        colBColor = value
        lblDisplay.BackColor = colBColor   
    End Set

End Property
' Provides a similar set of instructions for the foreground color.
Property ClockForeColor() as Color
    Get
        Return colFColor
    End Get
    Set(ByVal value as Color)
        colFColor = value
        lblDisplay.ForeColor = colFColor
    End Set
End Property

    O código anterior faz duas propriedades personalizadas, ClockForeColor e ClockBackColor, disponível para usuários subseqüentes desse controle chamando o Property instrução. 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 projetos autônomos; eles devem ser hospedados em um recipiente próprio (container). 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, selecione o ClockBackColor propriedade e em seguida, clique na seta suspensa 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.

  5. Clique em Fechar para fechar a Contêiner de teste de UserControl.

    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.vbe 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.vb 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 a declaração de classe para o controle de ctlAlarmClock, que aparece como Public Class ctlAlarmClock. Na declaração da classe, insira o código a seguir.

    [Visual Basic]

    Private dteAlarmTime As Date
Private blnAlarmSet As Boolean
' These properties will be declared as Public to allow future 
' developers to access them.
Public Property AlarmTime() As Date
    Get
        Return dteAlarmTime
    End Get
    Set(ByVal value as Date)
        dteAlarmTime = value
    End Set
End Property
Public Property AlarmSet() As Boolean
    Get
        Return blnAlarmSet
    End Get
    Set(ByVal value as Boolean)
        blnAlarmSet = value
    End Set
End Property

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 clique em View Designer.

    O designer para ctlAlarmClock abre na janela principal.

  2. Clique em lblDisplay (a parte de exibição do controle) e 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, para som e 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 Solution Explorer, clique com o botão direito ctlAlarmClock.vbe em seguida, clique em Exibir código.

  2. Localize o Private blnAlarmSet As Boolean instrução. Imediatamente abaixo dela, adicione a instrução a seguir.

    [Visual Basic]

    Dim blnColorTicker as Boolean

  3. Localize o End Class a instrução na parte inferior da página. Antes de End Class a instrução, adicione o código a seguir.

    [Visual Basic]

    Protected Overrides Sub Timer1_Tick(ByVal sender As Object, ByVal e _
    As System.EventArgs)
    ' Calls the Timer1_Tick method of ctlClock.
    MyBase.Timer1_Tick(sender, e)
    ' Checks to see if the Alarm is set.
    If AlarmSet = False Then
        Exit Sub
    End If
    ' If the date, hour, and minute of the alarm time are the same as
    ' now, flash and beep an alarm. 
    If AlarmTime.Date = Now.Date And AlarmTime.Hour = Now.Hour And _
        AlarmTime.Minute = Now.Minute Then
        ' Sounds an audible beep.
        Beep()
        ' 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 Then
            lblAlarm.BackColor = Color.PeachPuff
            blnColorTicker = True
        Else
            lblAlarm.BackColor = Color.Plum
            blnColorTicker = False
        End If
    Else
        ' Once the alarm has sounded for a minute, the label is made 
        ' invisible again.
        lblAlarm.Visible = False
    End If
End Sub

    A adição desse código realiza várias tarefas. O Overrides 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 MyBase.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 soar, e um bipe audível será ouvido.

    ObservaçãoObservação

    Porque você está substituindo um manipulador de eventos herdadas, você não tem de especificar o evento com o Handles palavra-chave. O evento já está conectado. Tudo o que você está substituindo é a implementação do manipulador.

    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.vbe em seguida, clique em View Designer.

  2. No designer, clique duas vezes em lblAlarm. O O Editor de código abre para o Private Sub lblAlarm_Click linha.

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

    [Visual Basic]

    Private Sub lblAlarm_Click(ByVal sender As Object, ByVal e As _
 System.EventArgs) Handles lblAlarm.Click
    ' Turns off the alarm.
    AlarmSet = False
    ' Hides the flashing label.
    lblAlarm.Visible = False
End Sub

  4. 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. Sobre o arquivo , aponte para Adde, em seguida, clique em Novo projeto.

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

    O teste projeto é adicionado ao Solution Explorer.

  4. No Solution Explorer, clique com o botão direito do Test projeto nó e então clique em Add Reference para exibir o Add Reference caixa de diálogo.

  5. Clique na guia projetos. O projeto ctlClockLib serão listadas em Nome do projeto. Clique duas vezes em ctlClockLib para adicionar a referência ao projeto de teste.

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

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

  8. Clique duas vezes em ctlAlarmClock para adicionar uma instância de ctlAlarmClock para o seu formulário.

  9. 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.

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

  11. Defina as propriedades desses controles da seguinte maneira.

    Controle

    Propriedade

    Valor

    label1

    Texto

    (espaço em branco)

     

    Nome

    lblTest

    dateTimePicker1

    Nome

    dtpTest

     

    Formato

    Time

  12. No designer, clique duas vezes em dtpTest.

    O O Editor de código abre para Private Sub dtpTest_ValueChanged.

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

    [Visual Basic]

    Private Sub dtpTest_ValueChanged(ByVal sender As Object, ByVal e As _
    System.EventArgs) Handles dtpTest.ValueChanged
    ctlAlarmClock1.AlarmTime = dtpTest.Value
    ctlAlarmClock1.AlarmSet = True
    lblTest.Text = "Alarm Time is " & Format(ctlAlarmClock1.AlarmTime, _
        "hh:mm")
End Sub

  14. No Solution Explorer, clique com o botão direito testee em seguida, clique em Set as StartUp Project.

  15. 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.

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

  17. 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 é definido, o sinal sonoro soará e lblAlarm será flash.

  18. Desligar o alarme clicando em lblAlarm. 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: Controles de composição do autor

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

Conceitos

Variedades de controles personalizados

Outros recursos

Passo a passo de criação do componente