Em continuação do meu Tutorial (Adobe Flex a partir do Zero), coloco a terceira parte para acesso publico, apesar de não ter tido muito tempo e de não ter obtido grandes comentários ao meu trabalho, decidi continuar com ele até porque as poucas reacções que tive foram bastante construtivas e incentivadoras.Esta terceira parte do tutorial ficou um pouco mais extensa, cerca de 11 páginas.Alterei a forma de como colocava o código nos documentos, desta vez a coloração sintáctica está como no flex builder para se mais fácil a compreensão.
O documento permite neste momento a cópia do seu conteúdo para colar directamente no Flex Builder, os artigos anteriores não permitiam isso até porque não tinham grandes extensões de código.
Esta novo parte foca essencialmente os seguintes pontos:
- States, entendendo a sua disposição.
- Transições e seus efeitos.
- Programação do exemplo oláMundo totalmente em action script.
- Efeitos e eventListners
Dentro destes tópicos já se encontram bastantes funções e técnicas que não foram explicadas anteriormente, mas foram sendo explicadas à media que foram sendo usadas, como EventListners, Childs, arrayCollections, Construção e atribuição de um dataProvider para uma dataGrid, creationCompleteEffect e mais alguns pontos.
Demorou um pouco a ser elaborada esta terceira parte, e gostava bastante de saber as vossas opiniões sobre o novo tipo de organização do tutorial, bem como criticas a possíveis erros e sugestões.
Qualquer duvida: Perguntem!
Opiniões precisam-se!!
Discussão:
Parte I : http://msdevstudio.com/blog/2008/01/05/adobe-flex-a-partir-do-zero/
Parte II : http://msdevstudio.com/blog/2008/01/31/adobe-flex-a-partir-do-zero-parte-ii/
Download:
Parte I:Adobe_Flex_a_partir_do_zero_1.pdf
Parte II: Adobe_Flex_a_partir_do_zero_2.pdf
Parte III: Adobe_Flex_a_partir_do_zero_3.pdf
Parte IV: Adobe_Flex_a_partir_do_zero_4.pdf
edit:
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 e IV (actualizado, ver topico)
abraço!
47 Comentários
Olá, msdevweb (Qual o seu nome?)
Nossa amigo, ficou muito bom o material! parabéns mesmo!!!!!
Concerteza você terá um bom feed-back!
Há tomei a liberdade de publicar nas listas brasileiras aqui.
Obrigado pelo comentário e pela publicação..
Ah.. o meu nome é Mário Santos
Um abraço!
Muito show
estou ancioso pellos proximos
e de grande valia estes artigos
ainda mais porque estou prestes a iniciar um curso de flex
Muito bom brother! Ainda mais para iniciantes do zero
como eu. Parabéns!!!! Seu blog ja está na minha lista de Favoritos, rsrsrs!!
e como disse o Leonardo, aguardamos pelos próximos artigos.
Abraço!
Parabéns pela sua dedicação. Para quem está começando, é uma mão na roda. Algumas coisas simples dão muito trabalho quando não sabemos fazer por onde.
Agradeço e já baixei os 3 arquivos para passar para o pessoal que está interessado no Flex (aqui no trabalho).
Inté.
Show de bola Mário. Muito legal sua atitude de estar disponibilizando um curso gratuito de flex para iniciantes. Da forma como você expressa neste tutorial, não vamos encontrar em lugar algum. Parabéns e não vejo a hora da quarta parte estar disponível.
Obrigado Abel.
Já estou trabalhando na quarta parte
Abraço.
Meu amigo, tá muito show eu não sabia absolutamente nada de flex, agora tenho uma boa noção ta ficando fera mesmo seu trabalho.
Só uma dúvida, tem como vc disponibilizar o pdf que permite ser impressa porq eu prefiro ler no papel e ir aplicando nas hors de folga nem sempre to de folga na frente de um micro.
Mas no mais ta maravilha mesmo.
Parabens pela iniciativa.
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!
Amigo Mário Agora fechou 100%. Ta perfeito os estudo com flex e isso você leva o mérito tambem porque graça a você que esta favorecendo uma boa galera com esses tutoriais. Muito didático seu material para quem estar no inicio da longa caminhada que nos aguarda para ser percorrida.
É simplesmente fantastico contar com materiais desse tipo. Bom ficamos por aqui e ansioso por mais uma parte. Rsss
Sucesso é o que todos desejamos pra você e pra nós tambem.
Amigo,
Os tutoriais estão muito bons. Parabéns. Se você tiver algum material para iniciantes fora essa maravilha que voce fez ai por favor me manda. Ok?
Parabens,
Jomar Kleber.
Olá!
Sou novo no Flex. Literalmente INICIANTE!
Criei um botão no flash onde eu passo o mouse ele muda de cor.. simples, só pra sevir de exemplo.
Fui no Flex e inserí esse botão atraves da ferramenta SWFloader.
Aí que está… Como faço pra que esse SWFloader vire um link pra que quando eu clicar nele ele mude pra outra pagina que eu direcionar????
Se tiver algum material explicando essa parte de links atraves do recurso “SWFloader” se puder me mande!!
Se puder me ajudar!! Agradeço!!1!!
Junior Rocha.
Oi junior… bom, vc podia fazer o seu botão no flex, se não for muito elaborado seria mais facil, mas bom.. para fazer o seu swfLoader abrir um url, basta fazer o seguinte:
procure a inha no seu código MXML que tem:
click=”loadUrl()” buttonMode=”true” useHandCursor=”true” ficaria algo como (note que as posições x e y podem variar, por isso meto xxx, e yyy)
e depois copie e cole o código que escrevo em baixo, logo a seguir a essa linha do SWFLoader:
< mx:Script>
< ![CDATA[
private function loadUrl():void
{
var url:URLRequest = new URLRequest("http://www.gmail.com");
navigateToURL(url);
}
]]>
< /mx:Script>
depois guarde o seu ficheiro e corra de novo o aplicativo… se carregar no SWFLoader deve abrir o site http://www.google.com numa nova janela… e pronto… já está, aprendeu um pouquinho de actionScript
Seria isso?
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.
Olá Mário!
Primeiramente muito obrigado por se prontificar a me ajudar e em segundo meus parabéns pelo seu trabalho realizado aqui, disponibilizando seus tutoriais (Ótimos) de modo a querer ajudar a todos nós iniciantes. É muito raro pessoas como você! Parabéns mesmo!
Bom… mas vamos lá..
Ainda permaneço “encalhado” com esse componente SWFloader.
Colei aqui meu codigo pra que possa entender como estou fazendo.
Mas acredito que fiz da maneira que me explicou acima…
Ao visualisar não deu nada. Ficou como se tivesse sem ação mesmo. como antes.
——————————————————————————-
——————————————————————————-
Aguardo seu retorno Mário!
Desde já agradeço!
Junior RC.
Mário, não consigo colar o codigo aqui. Como faço pra te mostrar?
Oi junior Rocha, faz o seguinte, ou cria um registo/post no mini-forum (tem o link no topo do blog) e coloca lá, assim podemos discutir lá o teu código.
abraço.
Desculpe-me Mário… deu certo dessa forma sim…
no site que estou fazendo, criei um banner animado no flash, tipo de “Promoção” entende, e através dele deu certo (ele está como clip de filme). Já os botões que fiz (estão como botões no flash) não deu certo dessa forma que me passou.
Será que dá certo se logo depois que criar os botões eu converter eles pra clipe de filme??
E se ao invés de clicar, e ir pra alguma URL, eu clicar e ir pra um Estate dentro da minha pagina mesmo, como faço?
Obrigado Mário!!
Hey Junior…
Bom, se converter eles como clip de filme provavelmente vai dar.. quanto ao clicar, quer ir para um estate dentro do flex é isso??
ou quer ir para um frame dentro da sua pagina html ?
se quiser ir para um frame, basta no “trigger” click do seu swfloader (onde chamava a função loadURL()), colocar:
this.currentState=”nome_do_state”;
para depois voltar ao state de raiz coloca
this.currentState=”";
se for para ir para um frame no seu html, na função que dei em cima coloca:
private function loadUrl():void
{
var url:URLRequest = new URLRequest(“http://www.gmail.com”);
navigateToURL(url, “nome_do_frame”);
}
seria isso?
abraço.
beleza Mário, isso mesmo! Muito obrigado!
Até mais!
Olá Mario!
Seguindo a série de apostilas ( parabéns mais uma vez… ), na quarta apostila, no tópico 6.3 onde
vc manda adicionar o seguinte comando na função abrePainelLogin :
painel.inputUser.text=”teste”. Ao salvar o projeto e executar, o seguinte erro me é apresentado :
TypeError: Error #1009: Cannot access a property or method of a null object reference.
at olaMundo/abrePainelLogin()[C:\Documents and Settings\abel.OBER\My Documents\Flex Builder 3\olaMundo\src\mainScript.as:102]
at olaMundo/___olaMundo_Button1_click()[C:\Documents and Settings\abel.OBER\My Documents\Flex Builder 3\olaMundo\src\olaMundo.mxml:8]
Você saberia me informou o porquê ?
Agradeço pela atenção!
Boas Abel.
Isso é estranho…
nessa função pouca coisa pode correr mal, verifique se o id do seu campo (inputText) que serve para colocar o user está com o id=inputUser (isto no dbConf.mxml, no painel de login).
penso que só pode ser isso…se não for, me mostra a linha 102. (era essa??).
abraço.
Ei ai Mario…
Abaixo segue trecho do código…
private function abrePainelLogin(centrado:Boolean):void {
var painel:dbConf = new dbConf();
painel.showCloseButton=true;
painel.inputUser.text=”teste”; // Linha 102
PopUpManager.addPopUp(painel,this,true);
if(centrado==true) PopUpManager.centerPopUp(painel);
}
e Logo abaixo o código do dbConf
//**************************************************************************************************************//
//*************************************************************************************************************//
Valeu T+.
piorou.. rsrsrsr
nessa função pouca coisa pode correr mal, verifique se o id do seu campo (inputText) que serve para colocar o user está com o id=inputUser (isto no dbConf.mxml, no painel de login).
vc verificou isso? se no seu dbConf.mxml o campo inputUser existe? (é suposto ser o campo onde se coloca o nome de utilizador)
penso que só pode ser isso…
E ai Mário, beleza ?
Consegui resolver… Na verdade o erro acontecia porque eu estava inicializando a propriedade textInput antes de chamar o PopUpManager…
Abaixo segue a função
private function abrePainelLogin(centrado:Boolean):void {
var painel:dbConf = new dbConf();
painel.showCloseButton=true;
painel.inputUser.text=”teste”; // LInha 102
PopUpManager.addPopUp(painel,this,true);
painel.inputUser.text=”teste”; // Colocando aqui funciona perfeitamente.
if(centrado==true) PopUpManager.centerPopUp(painel);
}
//*****************************************************************////
Abaixo segue o componente dbConf :
//*****************************************************************////
//*****************************************************************////
Valeu… Abraço!
Ainda bem que funcionou, eu estava achando estranho porque na altura tinha testado, e fui ver no tutorial e confirmei:
mas também reparei que tenho aqui um erro no tutorial, onde está este texto citado deveria estar:
É um erro, mas quem estiver com atenção consegue dar por ele!!
E já agora ficam todos convidados a denunciar erros encontrados!!
Abraço!
Parabéns! Seus tutoriais estão ótimos… está me ajudando bastante.
Quando vou fazer um download de alguns tutoriais e arquivos aqui vem pra mim baixar um arquivo de nome
download-manager que não consigo abrir…
Gostaria de saber qual é o programa utilizado para abrir este tipo de arquivo?
Desde já agradeço…
Já algumas pessoas têm deparado com esse erro, a extensão de packages e fontes é .rar e dos tutoriais em si é .pdf
vou verificar o que se poderá estar a passar.
Abraço.
Material mto bom mm, obrigado pelas dicas
De nada Henrique!
Achei muito interessante o desenvolvimento em FLEX, Mario voce poderia indicar algum curso on-line , um site alguma coisa para iniciantes
Boas Ari Araujo!
Desculpa so responder agora, tenho estado com bastante trabalho…
Alem dos tutoriais aqui colocados : “Flex a partir do zero” e o “trace(“action script 3″)” pode encontrar muita informação em blogs como o http://vedovelli.com.br que têm uns screencasts otimos para iniciantes e não só.
Existem também uns cursos na e-Genial: http://www.egenialsas.com.br/cursos
Esse são os unicos que conheço…
Abraço.
caraca cara, padrão mesmo, pelo jeito teremos um escritor,
^^
quando sai a primeira edição do livro,
msdevweb – caindo de cabeça
FLEX DO BASICO AO AVANÇADO
AHuAHHauHAuhu muito bom manda uma copia pra mim dae.
Abraço
Hola, estaba buscando un tutorial para flex y encontré esta página
pero no puedo descargar los archivos me pregunto si los podría bajar de otra página? o si existe la posiblidad de que me enviara los archivos? de verdad se lo agradecería.
Hola Carolina, el tutorial es en Português, si no tienes problema con la lingua puedes bajar tuedas las partes de lo tutorial aqui:
http://msdevstudio.com/blog/download-manager.php?id=25
Gracias.
Cara. Fantástico esse material. Não vejo a hora de você concluir a parte cinco. Estou indicando a todos que conheço.
Pedro, obrigado pelas palavras e recomendações, e boas noticias… a parte 5 esta no blog, disponivel para download… basta dar uma procurada
Cumps.
Muito Obrigado amigo eu baixei sua apostila, apos ler quero deixar meu depoimento, Valeu por compartilhar um pouco do seu conhecimento! fica com Deus!
Muito legal o tutorial Mário, parabéns!!!!
Abraço.
Danilo
como coloco uma mascara para o formato telefone em tempo de execução em um textinput??
por exemplo eu vou inserindo esse 1234567891
enquanto eu vou digitando ele vai colocando a mascara até que o resultado fique assim (12)3456-7891
ai… valeu mesmo a ajuda .. obrigadãooooooooo
Olá… muito obrigadaaa… estava procurando algum material e encontrei esta belezura por aqui…
continue assim, sempre colaborando… =)
Velho…
Esse tutorial me ajudo mto a iniciar no Flex..
Vlw mesmo.. e sucesso!.. o/
Estou começando a trabalhar com Flex Builder, e pretendo fazer meu Projeto da Pós Graduação nele, este artigo esta me ajudando muito. Valew pelo artigo.
muito bom parabéns por este post, isso vai me ajudar muito
abraço
Mário, obrigado por postar um conteúdo tão rico!
Meus parabéns e muito sucesso pra você!