Bom, como já várias pessoas me tem pedido, mesmo não tendo muito tempo livre nem sendo um profissional vou iniciar aqui uma série de tutoriais para quem deseja começar do zero a construir os seus projectos em Flex, focando essencialmente o Adobe Flex Builder
Como já devem saber o Adobe Flex é uma plataforma de desenvolvimento de RIA’s (pt.wikipedia.com/ria) em flash. A grande diferença do convencional flash e esta plataforma é mesmo o estilo de programação e a diversidade do conteúdo que é possível criar com o Flex, ja que cada vez mais são disponibilizadas API’s para o Flex de aplicações como o flicker, google maps, yahoo maps, youtube entre tantas outras.
O Flex por si não é o mais indicado para construir animações frame-by-frame, para isso podem usar o flash e usar a vossa animação dentro do Flex, mas sim para a construção de RIA’s.
Vou tentar dividir este tutorial em varias secções, abrangendo o mais básico desde a instalação até ao desenvolver uma pequena aplicação de inserção de dados numa base de dados, animações/transições simples, ou criação de uma aplicação para desktop via Adobe AIR.
Utilizarei o Flex Builder 3 beta 2 (Trial, Windows), já que para iniciação é o mais indicado, já que o Flex SDK (Free) é muito mais "elaborado" e o Flex Builder 3 alpha (linux) ainda não tem parte de componentes drag & drop.
Este tutorial será dividido pelas seguintes secções :
(podendo focar mais opções dentro de cada um deles)
Actualizado: Ver topico Flex Book.
Como devem imaginar pelo titulo do post, este tutorial vai dividir-se por várias partes, visto que vou utilizar ilustrações e código fonte em cada uma delas.
Tenham paciência, se entrarem no espiríto, sei que vai ser difícil esperar mas vou tentar demorar o menor número de dias possível, vao ver que vale bem a pena.
Qualquer duvida no decorrer do tutorial, coloquem-na usando o sistema de comentários identificando bem a vossa dúvida e sejam claros, mas antes leiam atentamente o tutorial porque muitas duvidas podem ter como origem uma má leitura do tutorial. Podem também recorrer ao fórum http://www.xtechpt.com onde coloquei ja o tutorial com as devidas secçoes e também esta disponível um tópico para duvidas. Acedam directamente aos tópicos aqui
Comentários e sugestões são sempre bem vindos.
Entretanto quem desejar seguir este tutorial, recomendo vivamente que vejam os link’s Adobe Flex Explorers que ja indiquei aqui no blog (http://msdevstudio.com/blog/2007/12/02/rias-onde-encontrar-suportetutoriais/) para se inteirarem melhor com a estrutura dos componentes do flex.
Bom, se ainda não tiverem feito o download do Flex Builder beta 2, façam o download para adiantar trabalho, disponível aqui: http://labs.adobe.com/technologies/flex/flexbuilder3/ no link Get Flex Builder do lado direito do site, é necessário o registo (gratuito) para fazer o download (de cerca de 300mb de flex builder ) Retirem a versão stand alone para Windows. E instalem-o com os parâmetro default. Não vou usar o flash debugger para já, mas se vos for proposto na instalação instalem-o também… dependendo da versão do flash player do vosso computador, pode ser-vos proposto para instalar os plug-in’s para o Internet Explorer e Mozilla, por isso instalem-os também.
Até já.
Como no desenvolver do tutorial comecei já por ser muito extenso, disponibilizarei a sua versão em partes (*.pdf) assim que forem sendo concluídas, e assim também se torna mais fácil para vocês seguirem o tutorial.
A primeira parte ja está completa.
Download aqui: Adobe_Flex_a_partir_do_zero_1.pdf
A Segunda também:
Download aqui: Adobe_Flex_a_partir_do_zero_2.pdf
A terceira:
Download aqui: Adobe_Flex_a_partir_do_zero_3.pdf
A Quarta
Download aqui: Adobe_Flex_a_partir_do_zero_4.pdf
A Quinta
Index e Download: Adobe Flex a partir do Zero Parte 5
Noticias fresquinhas.
Quem estiver interessado pode fazer o download de todo o conteudo dos 4 tutoriais (Partes I, II, III, IV) em apenas um ficheiro e agora com permissão para copiar e imprimir já que muita gente pediu com jeitinho :=)
aqui está: Flex Book Parte I, II, III, IV (actualizado, ver topico)
abraço!
Cumprimentos.
38 Comentários
cara estou a mais de um mes procurando material de estudo para flex, e acabei chegando no seu site, seu tutorial ta ficando muito bom coisa de profissional, parabens, espero q continue assim.
É sempre bom ouvir comentários desses, como disse iniciei-me no flex também procurando na net, mas era bem dificil encontrar documentação que iniciava mesmo do zero, foi por isso que comecei este tutorial. Talvez no meio desta semana coloque a segunda parte que ja estou escrevendo.
Obrigado pelo comentário.
cara!
parabens mesmo…
td q eu precisava.
já tá nos favoritos!!!
Já aí está a terceira parte do tutorial!!
Vejam: http://msdevstudio.com/blog/2008/03/01/adobe-flex-a-partir-do-zero-parte-iii/
Abraços!
Gostaria de deixar registrado o quanto seu trabalho tem colaborado. Meus mais sinceros agradecimemtos, espero que continue com este trabalho, pois não imagina o quanto esta colaborando.
Muito obrigado !!!
Parabens pela sua dedicação e disponibilidade para ajudar aos iniciantes e amantes da programção.
Parabens ……………………
Noticias fresquinhas.
Quem estiver interessado pode fazer o download de todo o conteudo dos 3 tutoriais (Partes I, II, III) em apenas um ficheiro e agora com permissão para copiar e imprimir já que muita gente pediu com jeitinho :=)
aqui está: http://www.msdevstudio.com/mywork/FlexTutor/Flex_Book_Part_1_2_3.pdf
abraço!
Tutoriais muito bons, quando vai sair a parte IV, estou aguardando…
Abraço.
Boas notícias para os seguidores do meu tutorial, aqui fica disponível a quarta parte com 14 paginas do tutorial que cada vez mais pessoal estava a pedir.
Vejam em: http://msdevstudio.com/blog/2008/04/08/adobe-flex-a-partir-do-zero-parte-iv/
Abraço.
Companheiro,
Tenho que agradecer.
Muito Obrigado
Parabéns pela excelência no trabalho!
Obrigado
Olá amigo, estou entrando nesse tal de Flex a pouco tempo, fiz um curso, porem ainda me restam muitas duvidas e sinceramente, creio que seram sanadas com esses tutoriais, pois já trabalho com PHP a algum tempo e esse tutorial vai de encontro a exatamente o que eu quero. Parabens mais uma vez, sao pessoas como você qe fazem a internet um lugar mais agradavel e sem duvida melhor. Abracos e fique com deus!
Mário eu estava olhando a imagem do seu flex builder Milestone. Ele é free totalmente para baixar e usar??
O registro é gratuito mesmo ?
Outra coisa … pelo fato de ser beta, quando for alpha será pago ?
O que eu tenho aqui é :
Flex Builder Core - 3.0.194161
Flex Builder Satandalone - 3.0.194161
Outra pergunta: você sugere retirar a versão standalone para Windows mas meu sistema operacional é Windows ou não tem nada aver??
Abraço e muito obrigado pelos tutos !@
Boas!
O meu flex actual é o Flex Builder Professional, com licensa paga.
Mas pode fazer o download da ultima versão no http://labs.adobe.com e pedir uma licensa se for esudante ou trabalhador de escolas/faculdades gratuitamente em http://www.flexregistration.com tendo apenas que apresentar um cartão de estudante ou certificado da escola.
Sugeri essa versão (windows) por sugerir… não tem que ser obrigatórimente essa
Abraço.
Muito bom estes tutorias!!! Obrigado! Parabéns pelo excelente trabalho!
Velho… parabéns…
Impressionante sua dedicação para com os iniciantes !… Precisamos de mais pessoas assim …
Muuuuuuuito bom mesmoo está de parabéns Mario, ja estou na expectativa da parte 5!! obrigado!
Opa revisando acabei de achar a parte 5 hehe, mais ela não esta na versão final, hunn ao começar a ler não vi o tópico 8 do tutorial na parte 4 vai até o 7 depois na parte 5 pula pro 9…vou mais ja vou começar a estudar, quaisquer novas duvidas eu te passo por e-mail valeu Mário está muuito bom, parabéns!
Victor, Slakcmod, Obrigado!.
LeviJr, a parte 5 segue a actualização feita pelo flex book que reune as 4 partes anteriores com algumas correções e ajustes, houve algumas alterações na sua estrutura, mas nada de mais…
http://msdevstudio.com/blog/2008/04/30/tutorial-adobe-flex-a-partir-do-zero-actualizado/
Abraço.
Muito bom trabalho, para quando a parte 3?
A proposito, testei o preenchimento de uma datagrid com webservice asxm e funcionou, no entanto usando webservice wcg obtive o seguinte erro, podia dar uma ajudinha ja que nao encontro exemplos com WCF e Flex! Obrigado!
[RPC Fault faultString="Unrecognized binding style 'null'. Only 'document' and 'rpc' styles are supported." faultCode="EncodingError" faultDetail="null"]
at mx.rpc.soap::Operation/http://www.adobe.com/2006/flex/mx/internal::invokePendingCall()[E:\dev\3.0.x\frameworks\projects\rpc\src\mx\rpc\soap\Operation.as:774]
at mx.rpc.soap::Operation/send()[E:\dev\3.0.x\frameworks\projects\rpc\src\mx\rpc\soap\Operation.as:688]
at Function/http://adobe.com/AS3/2006/builtin::apply()
at mx.rpc.soap.mxml::Operation/send()
Oupa… tudo bem? obrigado pelo comentário…
O tutorial já tem a parte 3, 4 e 5
Vá ao menu no topo em post-list e veja que encontra os devidos posts com os devidos downloads
Quanto ao WCF você está usando como backend .net certo? tenho pena, mas não tenho muita experiencia na area do .net, mas posso informar que existem já handlers para .net, no estilo de amfPHP (php) ou BlazeDS (java..), veja qual o será mais util:
WebOrb para .net
http://www.themidnightcoders.com/weborb/dotnet/
FluorineFX .net
http://www.fluorinefx.com/
Espero que ajude!
Abraço.
Ah obrigado, eu já tinha tentado com o IE mas nao salvava como pdf nao sei pq, com firefox consegui.
Exacto, o meu webservice é .net, obrigado pelos links, vou investigar por ai.
Continuacao de bom trabalho, abraço!
Olá Mário, seus tutoriais estão otimos, porém estou tendo dificuldades na parte 5 na função “insere()”, o objeto enviado para a classe do php está chegando nullo, ou seja ao gravar na base com ‘”.$dados->nome.”‘ todos os registros estão ficando em branco, você tem ideia do que possa ser? ja pesquisei mais não conseguir solucionar ainda, aguardo uma orientação obrigado e parabéns pelo ótimo trabalho, abraço!
Esperimente ver se o objecto dados.nome antes de enviar paa o remoteObject tem algum valor, e depois no php verifique se têm a funçâo toda correcta e se por final não funcionar experimente usar $dados['nome'] em vez de $dados->nome;
depois me informe o que aconteceu…
Abraço.
Olá Mário então eu cheguei a testar e estava enviando o objeto corretamente porém quando ele chegava na classe so tinha o valor nulo, mais agora esta perfeito troquei o código como vc disse por $dados['nome'] e perfeito, so estou tentando agora arrumar a atualização do datagrid ele so faz uma nova busca na base quando dou um refresh na pagina quando insiro um novo registro ele o datagrid não está atualizando, vou tentar resolver aqui, mais obrigadão pela ajuda Mário, abraço!
opa so corrigindo, ja corrigi o refresh do datagrid, foi distração minha acabei comentando o metodo buscaDados, fica uma observação quando eu insiro um registro com ‘ por exemplo levi’s da erro de syntax de sql tem como eu tratar isso? obrigado
Olá Mario estou com um probleminha terminei com sucesso a 5 parte da sua apostila terminei a aplicação com sucesso tb, porém so estou conseguindo acessar ela localmente quando tento acessar a aplicação de outra maquina o browser me da essa mensagem de erro,
[RPC Fault faultString="Send failed" faultCode="Client.Error.MessageSend" faultDetail="Channel.Security.Error error Error #2048: Security sandbox violation: ip/olaMundo/bin-debug/olaMundo.swf cannot load data from localhost/olaMundo/amfphp/gateway.php. url: 'localhost/olaMundo/amfphp/gateway.php'"]
aonde posso alterar esse valor ‘localhost/olaMundo/amfphp/gateway.php’”] ?? ja tentei em varios lugares mais sem sucesso, pode me ajudar? obrigado abraço.
LeviJr. Esse erro deve-se à conhecida protecção de dominio do flash.
Esse valor deve ser alterado no services-config.xml e indicar a pasta amfphp (que deve estar no mesmo servidor onde a aplicação princiapl corre) e o seu gateway..
depois de alterado esse services config.xml deve compilar de novo a sua aplicação.
Veja se resolveu.
Abraço.
Exatamente Mário consegui resolver o problema alterando o services-config.xml, queria agradecer o tutorial que foi de grande utilidade e lhe dar os parabens pelo ótimo trabalho, obrigado e qualquer novidade é bem vinda.
abraço.
Caro Mário Santos, seu material está de parabéns. Acabo de devorá-lo.
Gostaria de saber se o amigo sabe onde posso encontrar livros técnicos ou material para download em PT/BR. Grande Abraço.
Ever - Curitiba/Paraná - Brasil
Boas Ever, quanto a mais material é bem dificil de encontrar em português, e foi essa uma das razões que me levou a iniciar esta serie de tutoriais, pode encontrar em alguns blog’s como o do vedovelli.com.br, dclick, riapt.org e mais algums..bem como algumas listas como o flexbrasil ou flexdev… de resto… desconheço…
Cumprimentos…
p.s. Foi facil seguir o tutorial ?
Meus parabens pelo tutorial.
Era o que precisava para dar um boa organizada no codigo e muito mais.
MUITISSIMO OBRIGADO
Boas Fabyan Alexander!
Não têm que agradecer!
Só está mesmo faltando tempo para continuar com a série
Olá Mário!
Gostaria de pedir, se possível, que você fizesse um tutorial de como publicar um site em flex utilizando banco de dados mysql. Estou utilizando atualmente uma biblioteca open source chamada asSql que faz a conexão diretamente no actionscript. É fantástico porém estou com erros de “Security SandBox Violation”. Já tentei de tudo, inclusive utilizar crossdomain mas não consigo acesso remoto de jeito nenhum, somente acesso local. Um bom tutorial de acesso remoto ao mysql iria me ajudar muito. Tenho certeza que existem muitos outros usuários que tem esta mesma dúvida.
Obrigado por enquanto.
Att. Abel
Abel, já viu este post:
http://msdevstudio.com/blog/2008/09/10/tutorial-crossdomainxml-nao-deixe-o-flex-complicar/
Pode ser problema de não ter carregado o crossdomain no seu aplicativo.
Quanto ao servidor mySql, ele encontra-se no mesmo servidor da sua aplicação?
Parabénssss…sem palavras pra descrever tamanha força de vontade em querer passar seus conhecimentos! Parabéns e sucesso!
Vinicius, Valeu pelas palavras!!