Detalhes

Categoria: Flex

Atualização: Quinta, 23 Julho 2009 16:54

Autor: vovó Vicki

Acessos: 5653

Enquanto os projetos são simples, seus scripts também são muito simples mas, à medida que se tornam mais elaborados, os scripts podem virar uma confusão de dar medo. Neste tutorial serão abordadas algumas das boas práticas de programação, assim como a modularização de código.

Identar o código

Uma das práticas mais comuns, principalmente quando se está com pressa, é criar um código "desdentado". Código banguela é aquele em que todas as linhas começam na mesma coluna, tornando difícil identificar o início e fim de áreas, blocos, funções, etc. É o tipo de pressa que vai acabar fazendo com que percamos tempo procurando agulha em palheiro caso ocorrer algum erro. Também é o tipo de pressa que vai nos dificultar a vida caso tenhamos que revisar o código depois de algum tempo.

Veja a diferença:

Explicações no código

Outra coisa que geralmente temos preguiça de fazer são linhas de observação que facilitam a compreensão do código. Na hora em que estamos programando, a lógica e a sequência do código está todinha na nossa cabeça, mas, depois de um certo tempo, será que vamos lembrar de cada detalhe? Tive um professor que costumava dizer que "o que abunda, não prejudica", ou seja, no futuro é melhor sobrar do que faltar explicação

Código modular

Separar tipos de código diferentes em arquivos diferentes também ajuda a manter a ordem. Porque misturar MXML com ActionScript e CSS num só balaio? O código fica mais "limpo" se colocarmos cada coisa no seu lugar. Vamos aproveitar enquanto nosso script está pequeno para aprender como criar módulos separados que trabalham em conjunto.

Usando como exemplo o código mostrado acima, notamos que há MXML misturado com ActionScript (tudo que está entre as tags <mx:Script> e </mx:Script>). Agora vamos separá-los.

Chame o Flex Builder, abra o projeto olaMundo.mxml e mãos à obra. Clique em File / New / ActionScript File, dê um nome para o arquivo que deve ser criado (eu mantive o nome olaMundo) e clique em Finish. Uma nova aba identificada por olaMundo.as aparece no painel de edição e se torna ativa. Vamos passar o ActionScript para este local.

Clique na aba olaMundo.mxml e no botão Source para ter acesso ao código. Copie a função clica(), volte a selecionar a aba olaMundo.as e cole o código copiado:

Selecione novamente a aba olaMundo.mxml e substitua

por

Cuidado com esta linha. Como a área de script está numa linha única, não se esqueça de terminar a linha com />. Para testar se está tudo OK, rode o aplicativo. Ele deve funcionar exatamente como antes. A única e grande diferença é que agora o código está arrumado

Você pode fazer o download deste projeto na seção de downloads/tutoriais da Aldeia.