Muitas vezes pensamos, como era facil se pudessemos guardar isto e esta variavel no pc do utilizador, pois bem, isso é possivel e até bem facil, depois de ler um artigo bem interessante, deixo aqui um package que pode simplesmente ser utilizado para gravar e ler dados de um cookie no pc do utilizador… vejam o seguinte código:

Read more »

Tenho andado cheio de trabalho e com um “grande projecto” pessoal em mãos para a comunidade flex  que brevemente anunciarei o seu inicio, que nem tenho tido muito tempo para o blog…

Depois do logotipo deste projecto já criado, tive necessidade de arranjar um preloader “original” e comecei com algumas pesquisas e testes e como resultado final apareceu uma animação bem engraçada e que apesar de tudo é bem simples, com recurso a um componente open source (reflexion manager) e a algumas funções de animação do flex consegui um efeito de “salto elastico”, ora vejam então o resultado final:

O exemplo têm o código fonte disponivel, mas não acessivel atravéz do exemplo em cima, podem aceder directamente ao código fonte aqui

Ou rever o exemplo, caso não vejam em cima, aqui.

Os efeitos e o reflection funcionam em praticamente todos os objectos do flex.

Como podem ver o flex consegue produzir efeitos bem engraçados.

Cumprimentos.

Bem, ando meio ausente devido à enorme quantidade de trabalho que muitas vezes têm que ver prazos cumpridos… mas lá vou dando uma passada pelo blog… hoje trago a resposta a muitas duvidas de muita gente.

Muitas pessoas, tal como eu, perguntam… quais as diferenças entre o AS2 & AS3 ??

Bem, estar a explicar todas as classes alteradas levava muito tempo, mas descobri uma preciosidade da adobe muito interessante, uma lista de todas as classes que foram alteradas na migração do AS2 para o AS3, e aí se encontra a resposta para as preces de todos os que têm essas duvidas.

Aqui podem encontrar o link directo:

Adobe Action Script Language Refrence - Diferences.

Espero que seja muito util, principalmente quando andam à procura de uma utilização de uma classe que dá erro..

Abraço.

Em continuação com o tutorial…

Esta parte já foi incluída no livro aqui disponibilizado para download…

Vejamos o seguinte código de um package devidamente comentado:

package teste

{

import flash.events.Event;

import mx.containers.Panel;

import mx.controls.Label;

import mx.events.ChildExistenceChangedEvent;

import mx.events.FlexEvent;

public class teste extends Panel

{

//colocamos a imagem como embed (incoporada no nosso applicativo e definida

//com a variavel imediatamente em baixo (iconImg) disponivel na forma de class.

[Embed("flexBtn.png")]

private var iconImg:Class;

/*Esta propriedade estará disponivel como elitura/escrita por exemplo: 

meuPainel.nomePessoal */

[Bindable]

private var _nomePessoal:String;

//Disponivel como dataCriacao em modo de leitura apenas; meuPainel.dataCriacao

private var _dataCriacao:String;

//variavel temporaria usada para saber as horas/minutos/segundos usados em baixo

private var dados:Date = new Date;

public function teste()

{

//definimos o painel

this.width=270;

this.height=270;

this.x=0;

this.y=0;

//adicionamos o eventListner

this.addEventListener(FlexEvent.CREATION_COMPLETE, criado,false,0,true);

}

private function criado(evt:FlexEvent):void {

/*definimos a hora exacta da criação do painel, com recurso ao date, neste 

caso d variavel dados */

_dataCriacao=dados.getHours()+":"+dados.getMinutes()+":"+dados.getSeconds();

//adicionamos o icon ao painel

this.titleIcon=iconImg;

//verificamos se o nomePessoal foi definido

if(!_nomePessoal) {

/*se o nome nao tiver sido dados, damos um nome temporario, no caso será dados como:

Teste Painel "numero" onde o numero será um valor aleatorio entre 0 e 15, este

numero é conseguido através do Math.floor(Math.ramdom()*15); */

_nomePessoal="Teste Painel "+Math.floor(Math.random()*15);

}

/*vamos usar um label que indica o nomePessoal e a hora da ciração do painel, este

Label desaparecerá assim que forem adicionados filhos ao painel, para isso usamos 

um evenListner*/

var lbl:Label = new Label;

lbl.name="status";

lbl.x=0;

lbl.y=0;

//definimos o texto

lbl.text=_nomePessoal + " criado em: "+dataCriacao;

//adicionamos como child ao painel

this.addChild(lbl);

//event listner para sabermos quando foi adicionado um filho ao painel para

//podermos remover o label colocado em cima.

this.addEventListener(ChildExistenceChangedEvent.CHILD_ADD, remove, false, 0, true);

//despacha o evento terminado personalizado

this.dispatchEvent(new Event("btnsProntos"));

//remove o eventListner terminao, visto que apenas será disparado uma vez.

this.removeEventListener(FlexEvent.CREATION_COMPLETE, criado);

}

private function remove(evt:ChildExistenceChangedEvent):void {

//função para remover o label com o nome e hora de ciração, isto acontece quando é

//adicionado um filho ao painel.

//removemos o child 0 (é o child lbl usado em cima, é o numero zero porque nada 

//mais foi adicionado ao painel)

this.removeChildAt(0);

//removemos o event listner caso contrario se forem adicionados mais que um filho

//esta função vai remover sempre o ultimo inserido

this.removeEventListener(ChildExistenceChangedEvent.CHILD_ADD, remove);

}

/*como quero apenas que a propriedade de dataCriacao seja apenas de leitura, fazemos

apenas a função para ler esse valor, com o get, chamado getter */

public function get dataCriacao():String {

return _dataCriacao;

}

/*como quero que a propriedade _nomePessoal seja quer de leitura, quer de escrita,

tenho que dizer à nossa classe que pode disponibilizar ou receber conteudo de/nessa

variavel, fazendo isso com as funções get e set **/

public function get nomePessoal():String {

return _nomePessoal;

}

//Recebe uma string como nome

public function set nomePessoal(nome:String):void {

_nomePessoal=nome;

}

}

}

No exemplo em cima usei já uma class mais complexa, mas como está devidamente comentada será bem facil de perceber. Neste exemplo podemos entender o seguinte; É usado um Painel como base, (extends) e as suas propriedades…depois disso é automaticamente adicionado um titleIcon exemplificando atributos herdados do pai (Panel).

Read more »

Depois de estar ausente 2 dias das publicações no blog, venho anunciar um doce para os leitores, depois de muito investigar, testar e inventar, lá consegui realizar um projecto ambicioso.

Criar um leitor de mp3 para qualquer aplicação flex com um equalizer, algo meio complicado no inicio, mas com um resultado final lindo

Vamos aos detalhes:
* www.msdevstudio.com
* MP3 Player v1.0
* Um simples leitor de mp3 feito totalmente em action script, extendendo
* um canvas, com um spectrum analiser, que nos mostra como podemos usar
* os dados do flash.media.SoundMixer para obter as variações do espectro
* de audio e com elas desenhar a respectiva variação das ondas numa linha.
*
* Podemos definir a cor do spectrum, e fundo, autoPlay e urlMP3
* Por defeito:
* corSpectrum: #43ADF0;
* corFundo: #202021;
* autoPlay=false;
* urlMP3 = http://www.msdevstudio.com/music/Obssesion.mp3
*
* Para usar basta copiar o package (preservando as directorias e nomes com->msdevstudio->playSound)
* para a pasta do vosso projecto, e este player passa a estar disponivel na janela componentes em custom
* ou se preferirem usar em action script, usam apenas para testar:
*
* import com.msdevstudio.playSound;
*
* var meuPlayer:playSound;
*
* e numa função:
* meuPlayer.corSpectrum=”#43ADF0″;
* meuPlayer.corFundo=”#202021″;
* meuPlayer.urlMp3=”http://www.msdevstudio.com/music/Obssesion.mp3″;
* addChild(meuPlayer);
* meuPlayer.play();
*
* estão disponiveis os metodos:
*
* meuPlayer.play();
* meuPlayer.stop();
* meuPlayer.pause();
* meuPlayer.resume();
* meuPlayer.autoPlay=false/true;
* meuPlayer.corSpectrum=”#43ADF0″; //cor
* meuPlayer.corFundo=”#202021″; //cor
* meuPlayer.urlMp3=”http://www.msdevstudio.com/music/Obssesion.mp3″; //ficheiro audio/mp3
*
* estas opções também estão disponiveis no painel de propriedades, em geral, sendo mais facil definir as   opções.
*
* Por Mário Santos
* www.msdevstudio.com
* Creative Commons by-nd-nc 3.0 unported
*

Vejam a imagem:

Podem aumentar e diminuir o seu tamanho quase sem limitações… o seu uso como dito em cima é bem simples..vejam algumas personalizações…

Vejam o exemplo online aqui com o código fonte disponível

Se quiserem apenas o package, façam download aqui

p.s. O código ainda não está comentado… mais à frente faço isso.

Deu trabalho, mas vocês merecem! :p

Venham de lá esses comentários!!

Abraço.

A todos os que participaram no sorteio ( http://msdevstudio.com/blog/2008/06/17/tutorial-action-script-3-o-livro-sorteio ) em que estava em jogo 10 cópias da primeira parte do livro que reúne todas as 10 partes do tutorial action script 3 e uma parte extra.

O sorteio foi efectuado com a seguinte query à base de dados:

SELECT `comment_author` as autor, `comment_author_email` as mail FROM `wp_comments` WHERE `comment_post_ID`=”222″ AND `comment_author`!=”Mário Santos” ORDER BY RAND() LIMIT 10;

VENCEDORES Roger Câmara Rafael Vitor C Garcia Tiago Reges Geraldo Junior Tafarel Gerbasi Ved Felipe Meireles

SORTEIO Cliquem na imagem para ver maior.

Mas a todos os que não ganharam…fica uma palavrinha.

É muito importante para mim, que tenham participado e deixado os vossos comentários, principalmente porque me ajuda a escrever mais e cada vez melhor, a vocês um grande Obrigado. A todos os que têm enviado os seus emails, e que às vezes não respondo nos melhores prazos, um obrigado.

E por final, como não gosto muito de perder! e achei que todos mereciam o livro, será também enviado a todos os outros, ou seja NÃO HÀ PERDEDORES!

Agora, 4 pontos:

- Peço para já que se encontrarem algum erro (que não seja de português, já que não foram corrigidos) que me informem.

- Se alguém estiver interessado em rever o tutorial todo e me informar de erros, esteja à vontade que eu agradeço.

- Não divulguem muito o tutorial pelo simples motivo que ele ainda não foi corrigido pelo que será actualizado depois.

- Será que alguém está interessado em escrever alguns artigos (pequenos pedaços de código, que gostavam de incluir ou ver explicados no livro)? estejam À vontade…

Agora apenas aguardem cerca de 15 minutos e terão todos no vosso email uma cópia desta primeira parte do livro.

Um abraço a todos e continuem fieis ao TSW!

Depois de ter lançado os primeiros 10 artigos do meu tutorial, compilei-os em apenas um pdf juntando a eles a parte 11 que nos explica e mostra um exemplo completo da primeira class hereditária e composta. Um óptimo exemplo para quem tem seguido o tutorial e que agora conseguirá finalmente fazer a sua primeira class em action script. Aqui fica a capa fresquinha!!

O livro inicialmente seria para FLASH e FLEX, mas decidi direcciona-lo apenas para o FLEX, pelo que aliado ao tutorial Adobe Flex a partir do zero se torna uma grande referencia para iniciantes e não só. Esta primeira parte conta já com 36 paginas que fala desde as noções basicas até a abordagem completa de componentes, propriedades, métodos, eventos, class’s e muito mais…

Ainda não vou disponibilizar para todos o download, apenas disponibilizarei por sorteio 10 cópias entre os comentários que obter visto que texto ainda tem alguns erros de português (sim, eu sei…mas querem o que? escrever à pressa e quase 2 anos a escrever francês dá nisto) pelo que ainda terei de os corrigir.

Deixem então um comentário ao meu trabalho desenvolvido e distribuido pelo blog em 6 meses de vida (escrevam algo bonito ah?!!), estruturando o vosso comentário se possível da seguinte forma:

O que eu critico: “escrevam uma critica dirigida ao blog/trabalhos/a mim”

O que eu gosto: “escrevam um elogio dirigido ao blog/trabalhos/a mim”

O sorteio será no próximo sábado (21/06/08) às 12:00 (GMT)

Se não forem atingidos 10 comentários o livro será distribuído pelos que existem.

Venham esses comentários!

p.s. Deixem um e-mail válido.

Em continuação com o tutorial ( 001 - 002 - 003 - 004 - 005 - 006 - 007 - 008 )

5. Programação Orientada a Objectos.

Por muitos a linguagem orientada a objectos é uma maneira simples, rápida e eficaz que se pode traduzir por uma melhor performance no código e uma mais fácil identificação de erros bem como a interpretação por parte de outros programadores. Mas como tudo, também existe outro lado da moeda, que muitos programadores ainda mostram barreira em aceitar esta metodologia de programação e se mostram muito reticentes ao seu uso.

Mas no Action Script 3 não existe outra maneira, ou se programa orientado a objectos ou então é melhor esquecer o AS3.

Daqui para a frente falaremos cada vez mais de este tipo de programação, bem como o seu uso, por isso vamos falar em mais concreto dos benefícios de usar a adequada estruturação do código. Um dos básicos da linguagem orientada a objecto é a compreensão do seu método de funcionamento e estruturação, com especial atenção a:

Class’s: Colecção de funções e variáveis relacionadas para facilitar a interacção com determinados objectos. Isto é o ‘core’ do AS3 e das linguagens OOP, e será mostrado o seu uso em diferentes situações.

Inheritance (Código hereditário) : Uma das grandes vantagens do AS3 (OOP) é a possibilidade de alterar/remover/adicionar propriedades/funções a determinado componente/função/método sem ter que re-inventar a roda, o que nos permite extender uma class/componente sem termos que programar a class do zero, o que além de nos poupar imensas linhas de código, permite também entender melhor o comportamento de determinado componente ou class e melhora-las/adequa-las às nossas necessidades.

Composition (Composição): Como foi falado em cima, esta possibilidade de extender todos os componentes e suas class’s, pode ser muito util, mas não é possível em algumas situações e para isso temos este metodo ”Composition” que é uma técnica que nos permite criar uma class que possa trabalhar com outra em conjunto, e que nada herda de uma possível class de um componente.

Encapsulation: Geralmente não é uma boa ideia expor todos os aspectos de uma class para outras class’s ou aplicação, esta Ecapsulação é um método que permite ”ocultar” a maior parte das propriedades e funçoes de uma class permitindo apenas que certos elementos sejam expostos.

Polymorphism: Este método permite que objectos de diferentes class’s possam ter o mesmo nome e os mesmos eventos e que se comportem de diferentes formas, o que acaba por permitir que não seja necessário que se criem novos métodos sendo depois mais fácil extender essa class…tendo apenas que perceber como o objecto se comporta nas diferentes classes.

Nota: É importante compreender que as linguagens OOP podem não ser fáceis, nem apropriadas para toda a gente ou situação, mas é muito util principalmente quando usada em projectos de média/grande dimensão com bastantes programadores, já que simplifica em muito o trabalho de equipa. Não é obrigado a aprender OOP para saber programar AS3, mas que ficará limitado a quase 50% das possibilidades do AS3 também é bem verdade.

Uma das iniciais vantagens no processo de programar uma linguagem OOP é escolher uma boa plataforma para o seu desenvolvimento, principalmente porque existem variadas maneiras de criar uma interface e várias ferramentas para o fazer. Uma boa prática é que antes de iniciar o seu projecto faça o seu plano de necessidades, objectivos, arquitectura e comportamento de programação. Se fizer isto, é meio caminho andado para perceber que uma linguagem OOP como o AS3 pode satisfazer facilmente as necessidades do projecto, mas não se preocupem em ser demasiado exigentes nos vossos primeiros projectos, porque com certeza que encontrarão problemas e cometerão erros, que servirão para optimizar e melhorar a vossa maneira de trabalhar.

Vamos falar detalhadamente e praticamente de cada um destes pontos…

Read more »

Depois do lançamento da parte 5 do tutorial, algumas pessoas estão a ter problemas em seguir o tutorial, talvez porque este engloba também alguns conhecimentos de PHP, mas também porque é demasiado extenso… Por isso venho então colocar para download os sources usados no tutorial:

- Adobe Flex a Partir do zero parte V (Tutorial, parte 5).

- ola.mundo (serviço do amfPHP, a colocar na pasta services do amfPHP.

- olaMundo release (A release do projecto finalizado com código fonte).

- services config.xml (Usando no compilador para determinar o caminho do gateway do amfPHP).

Quanto ao tutorial, qualquer problema digam.

Ah, gostava de saber se alguém já terminou esta parte, e se houve problemas de maior…

Um abraço.

Em continuação com o tutorial ( 001 - 002 - 003 - 004 - 005 - 006 - 007)

4.3. Removendo objectos da display list. removeChild ():

O processo para remover child’s do stage ou de algum elemento é bem simples e muito parecido com o processo de os adicionar. O método removeChild() está também presente em muitos dos elementos gráficos, pelo que usamos apenas:

removeChild(painel) 

e eliminaria-mos o child painel bem como todo o seu conteúdo que inclui o nosso objecto comboBox.

Alem deste processo podemos usar também o método removeChildAt() que recebe como parâmetro o número/index do (child) objecto em causa, número/index esse que é atribuído automaticamente pela display list, no exemplo em cima, o comboBox será o child com número/index 0, visto que é o único child adicionado ao painel, para o remover-mos devemos usar:

painel.removeChildAt(0); 

e o comboBox seria automaticamente removido do painel.

Vamos supor que na função em cima, adicionamos também um TextInput ao painel:

private var texto:TextInput = new TextInput();

//e em baixo adicionaríamos ao painel:

painel.addChild(combo);

painel.addChild(texto);

Aqui o texto passará a ser o child com o número/index 1, e para o remover teríamos que usar:

painel.removeChild(texto);

ou

painel.removeChildAt(1);

Read more »