Personalização do Flex Alert Box em Action Script

   

Desta vez venho aqui mostrar um exemplo de personalização da típica Alert box do Flex (Alert.show();) mas em Action Script, este exemplo que mostro em baixo, utiliza a declaração de um Alert numa variável e a sua configuração por via de Action Script, antes de este mesmo Alert ser apresentado na aplicação.

Para já apenas disponibilizo alguns controlos de “estilo” que podemos personalizar na aplicação antes a apresentação, dos quais passo a apresentar:

  • Personalização da cor de fundo.
  • Personalização da cor do bordo/titulo.
  • Modificação do “alpha”/ transparência no fundo e titulo.
  • Inserção de um titulo e texto.
  • Controlo de botões a apresentar
  • Inserção e modificação de um ícone no Alert

Podem também ver no código fonte exemplos de utilização de:

-ArrayCollections
-Embed images declaradas como Class
-Utilização da função Switch();
-Utilização do AddChild();
-ComboBox e dataProvider.
-Algumas Propriedades do Alert como:
–setSyle (backgroundColor, borderColor, backgroundAlpha, borderAlpha)
–iconClass
–title
–text

Disponibilizo todo o código, devidamente comentado, para que possam perceber passo a passo o funcionamento da configuração de um Alert em Flex.

Ficaram de fora alguns parâmetros como o tipo de letra e sua cor, bordos, efeitos na apresentação e verificação de qual botão foi pressionado.

Aqui fica o exemplo:

 

Caso não consiga ver o swf clique aqui

Para ver em outra janela clique aqui

Código Fonte

Espero que seja útil.

Aguardo comentários.

versão pdf temporariamente indisponivel.
Deixe um comentário or Deixe um Trackback

5 Comentários

  1. Fevereiro 6, 2008 às 12:11 pm | Permalink

    Show de bola esse tutorial sobre alert eu nem imaginava que tinha como fazer tudo isso, vai dar uma diferença e tanto nas aplicações, valew demais.

  2. Márcio
    Março 6, 2008 às 11:41 pm | Permalink

    Hum.. Já vou utilizar isto aqui.

    Inté.

  3. Marcelo
    Junho 19, 2008 às 8:54 pm | Permalink

    Muito bom, más Monstre-nos também como capturar o evento do botão que foi clicado

  4. Junho 20, 2008 às 12:29 pm | Permalink

    Para capturar o botão que foi clicado, basta adicionar um listner ao alert,
    Primeiro importamos o evento Close que será usado pelo eventListner

    import mx.events.CloseEvent;

    depois fazer na função mostraAlerta(), no final:

    alerta.addEventListener(Event.CLOSE, fechado);

    depois criamos uma função:

    private function fechado(evento:CloseEvent):void {
    Alert.show(”o botão clicado foi:”+evento.detail);

    }

    para fazer uma comparaçao nesta ultima função:

    if(evento.detail==Alert.OK) //ok clicado
    if(evento.detail==Alert.YES) //YES clicado
    if(evento.detail==Alert.NO) //NO clicado
    if(evento.detail==Alert.CANCEL) //CANCEL clicado

    se quiser fazer tudo directamente no seu alert:

    Alert.show(”Alert teste”, “Alerta 1″, Alert.OK | Alert.CANCEL, this, fechado);

    e a função:

    private function fechado(evento:CloseEvent):void {
    if(evento.detail==Alert.OK) //NO clicado
    if(evento.detail==Alert.CANCEL) //CANCEL clicado
    }

    e está feito! seria isso?
    Abraço.

  5. Marcelo
    Junho 27, 2008 às 5:52 pm | Permalink

    É isto mesmo, muito bom.

2 Trackbacks

  1. Por Manifesto Flex Brasil | TSW - That Should Work em Março 19, 2008 às 1:32 pm

    [...] Personalização do Flex Alert Box em Action Script Por que ele é relevante: Aborda praticamente todos os parametros “graficos” mais [...]

  2. [...] Action Script 3 - O livro. (Sorteio) » Live Help/Call Center Source in flex+blazeDS » Para capturar o botão que foi clicado, b…» Jeferson, quanto a mais tutoriais, é um …» Velho… parabéns… Impressionante [...]

Deixe um comentário

O seu email nunca será publicado ou partilhado. Campos obrigatórios estão marcados com um *

*
*