Estamos aí pra dar continuidade ao post de como comunicar eventos entre componentes customizados do Flex.
Vou deixar abaixo o ambiente padrão para iniciarmos o tutorial.
Apresentando uma situação:
Digamos que você tenha em seu projeto dois Custom Components, o CC1 ( um Slider e um Label ) e o outro, CC2, seria um teclado formado por 6 botões numéricos, um botão para o "Ok", um Label que exibe o valor do botão numérico pressionado e um botão para limpar o Label... ok..
Abaixo estão os dois Custom Components:
Implementação: Passando eventos
Este caso é um pouco menos comum, mas pode ser útil, então vamos lá.
Imagine que teríamos a necessidade de que quando o usuário passar o mouse sobre algum número do CC2 o Slider do CC1 tenha que ficar com a cor de fundo diferente e quando o mouse sair de sobre o número o Slider volte à cor de origem. Neste caso faremos com que os Custom Components se conversem diretamente.
Vamos chamar o CC2 de componente enviador de evento, se é que essa palavra existe..rs, e o CC1 de receptor de evento, pois já que o CC2 irá controlar a cor de fundo do Slider do CC1, podemos dizer que o CC2 envia e o CC1 recebe.
Vamos ver o código do Custom Components CC2:
Código CC2:
No código CC2 pegamos como exemplo somente um Botão, mas a idéia se aplica a qualquer objeto que quisermos.
Repare que no evento mouseOver do Botão será chamada a função "__envia_cor_fundo_slider_over ()" ( linha 34 ), essa função ( linhas 20 a 22 ) faz com que seja disparado um evento de nome "cor_fundo_slider_over", este evento pode ter qualquer nome, então procure dar nomes que sejam facilmente associados ao tipo de ação que está executando. Quando esta função é executada a classe principal poderá "escutá-la" e após isso qualquer outra classe envolvida no projeto poderá validar se a classe principal "ouviu" o evento com o nome pré-definido e executar qualquer ação.
Vamos ver o código do CC1 que está apto a "ouvir" o que o componente CC2 está enviando.
Código CC1:
Da linha 12 a 16 temos declarada a função "__recebe__cor_fundo_slider_over ()", repare que adicionamos a função "addEventListener( NOME DO EVENTO, FUNÇÃO () { ... } )", esta função é a responsável por ficar verificando ou "ouvindo" o evento que a classe principal receberá, mas para chegarmos à classe principal precisamos adicional antes da função a classe "Application" e o método "application" como já explicamos no post anterior. Resumindo: caso o mouse passe por cima do Botão no CC2, este enviará para a classe principal um evento personalizado chamado neste exemplo de "cor_fundo_slider_over", por outro lado a função "addEventListener" do CC1 ficará verificando na classe principal se este evento chegou lá, acontecendo isso a função anônima será disparada e no nosso caso ela está mudando a cor de fundo do slider. Não esquecendo que a função "__recebe__cor_fundo_slider_over()" deve ser chamada no inicio do programa ( linhas 3 a 6 ).
Abaixo está o programa:
Aí está, espero que seja útil, até o próximo post.
0 comentários:
Postar um comentário