Ler XML com flash

Lendo XML com flash e Action Script 2

Bom aqui vai um tutorial bem simples de como se ler um XML com o flash.

Existem varios tipos de XML, são eles com ou com id ou valores dentro dos nós como atributos… ou as vezes só com conteúdo dentro do mesmo.
E eu como muitos programadores já passaram mals bucados para ler um XML no flash.

Pois bem aqui eu vou tentar simplificar um cadinho a vida dos programadores de como ler um XML
Teremos o seguinte XML para ler como desafio:

<?xml version="1.0" encoding="UTF-8"?>
<xml version='1.0'>
<childNode id='1'>Exemplo de XML</childNode>
</xml>

Bem simples pois assim não vamos ter muito o que complicar né?

Então vamos primeiramente como fazer em ActionScript 2
Não tem muito mistério, coloquei comentários para explicar o porque fiz dessa maneira
Segue o código:

//Aqui crio a variavel que via ser responsavel pelo XML
var xml:XML = new XML();
//Aqui vou dizer para ignorar os espaços em branco
xml.ignoreWhite = true;
//Aqui eu vou carregar meu XML
xml.load('exemplo.xml');
//Aqui vou criar o ao carregar chama uma função
xml.onLoad = function(ok){
if(ok){ //Se carregou com sucesso faz:
//Aqui eu pego o attributo do cabeçalio do meu XML no caso o vou pegar o 1.0
trace(xml.firstChild.attributes.version);
/*
* Aqui agora eu vou pegar o atributo do nós.. como é o primeiro nó tenho que pegar o valor
* como se fosse uma array então temos que usar o [0] como parametro para indicar que é o primeiro nós e não o segundo
* Lembrando que arrays sempre começam do 0 para mostrar o primeiro elemento
*/
trace(xml.firstChild.childNodes[0].attributes.id);
//Aqui eu vou pegar agora o valor do nó
//Para isso preciso chamar o firstChild novamente para dizer que eu quero o valor daquele nó e não de outros que podem estar dentro dele
trace(xml.firstChild.childNodes[0].firstChild.nodeValue);
}else { //Senão ele vai mostrar um erro
trace('error');
}
}

Action Script 3 ficará para uma proxima.

Abraços e até lá

Fazendo gradiente com AS 2.0

Isso é um código simples de se entender

//Primeiro você importa a classe necessária do flash
import flash.geom.*;
//Especifica qual o tipo de gradiente vc quer
var fillType:String = “linear”
//Escolhe as cores no caso azul e vermelho
var colors:Array = [0xFF0000, 0x0000FF];
//Diz o alpha que vai de 0 a 100
var alphas:Array = [100, 100];
//que vai de 0 a 255 ou 0 a 0xFF
var ratios:Array = [0, 255];
//Cria-se a variavel matrix responsavel pela configuração
var matrix:Matrix = new Matrix();
//Cria a caixa de gradiente
matrix.createGradientBox(100, 20, 0, 0, 0);
//Se trabalha com spreadMethod que são reflect, repeat e pad. (pad é o padrão)
var spreadMethod:String = “pad”;
//Agora criamos o gradiente propriamente dito, colocando sempre, tipo, cores, alphas, ratios, matrix e o tipo de controle
this.beginGradientFill(fillType, colors, alphas, ratios, matrix, spreadMethod);
//Aqui eu só crio o quadrado que vai ter as cores
this.moveTo(0, 0);
this.lineTo(0, 100);
this.lineTo(100, 100);
this.lineTo(100, 0);
this.lineTo(0, 0);
this.endFill();

Simples fácil e prático

Lembrando que ao copiar e colar mudar as aspas, pois o WP altera as aspas no código

Abraços e até a próxima.

[Tutorial] Scroll de Frames

Bom galera,
Hoje vou dar uma explicação de como fazer um scroll, mas não é um scroll de textos nem nada disso… vou ensinar como fazer para dar scroll nos frames de sua animação!!

Isso é bom para fazer coisas girar sem ter nenhum programa 3D ou fazer alguns efeitos legais como vai e vem em uma animação…

Basicamente código é de um scroll … mas como estamos falando de frames, vamos ter que pegar o frame corrente (_currentFrame) e o total de frames (_totalFrames)… mesma coisa de um loader vc pega o BytesLoaded e o BytesTotal

Só que é para fazer um scroll
Então segue o código:

//Crio uma timeline com 72 frames
//Dou um stop para ele iniciar parado
stop();
//Digo qual a posição inicial do meu scrollSeek a bolinha do scroll
var inic = scroller._x;

//No onEnterFrame eu vou procurar o frame que me encontro e executar a função anda
onEnterFrame = function(){
//Aqui tenho um campo de texto criado para indicar que frame eu estou
frame_atual.text = _currentframe;
//Aqui chamo a função
anda();
}

/*
* A função anda… é nada menos nada mais que uma função de Load
* só que faz o clip andar… ou seja é um scroll mas para os frames
*/
function anda(){
var scroll_inicial = scroller._x – inic;
var scroll_final = barra._width;
var total_scroll = Math.round((scroll_inicial/scroll_final)*100);
valor = Math.round((_totalframes/100)*total_scroll);
gotoAndStop(valor);
}

/*
* Aqui eu dou a ação para a bolinha andar na minha barra de scroll e somente nela
* no caso minha barra é horizontal por isso uso a posição y e não x
*/
scroller.onMouseDown = function(){
startDrag(this, true, inic, barra._y, barra._width + inic, barra._y);
}
//Aqui é só quando soltar o mouse para o drag
scroller.onMouseUp = function(){
stopDrag();
}

Espero que gostem até o proximo tutorial 😉

Abraços

Usando Mascara com gradiente

Bom como todo mundo sabe, flash e mascara né é lá uma coisa que cheira muito bem… então eu resolvi fazer aqui um post de uma maneira simples para fazer suas mascaras com gradiente.

O que você vai precisar são 2 MovieClips e 3 linhas de código

O primeiro movieclip você vai montar como se fosse sua mascara, faça ela ficar com o gradiente que você bem entender… e instacie o clip como mascara. Lembre de criar o gradiente etc, usando as ferramentas do proprio flash, não use photoshop etc… pois vai ficar uma transparencia falsa… e se a pessoa usar monitor de 16bits vai conseguir ver a sua “transparencia”.

Feito isso coloque o outro clip, ou imagem tbm em seu palco, logo a baixo da imagem que você quer e então você vai colocar como imagem a instancia.

Feito isso tudo, clique sobre o frame, abra seu ActionScript(F9) e coloque a action no frame
mascara.cacheAsBitmap = true;
imagem.cacheAsBitmap = true;
imagem.setMask(mascara);

E pronto ta feito… simples fácil e pratico.

Abraços e até a proxima!

Usando Tween

Hoje vou dar um pequeno exemplo de como usar o tween do flash
Fazendo uma bolinha ir e voltar de uma posição de uma maneira simples

Eis o código:

//Importo as classes necessárias
import mx.transitions.*;
import mx.transitions.easing;

//Crio meu tween que vai fazer a animação
var primeiroTween:Tween = new Tween();
//Crio minha variavel verificadora
var foi:Boolean = true;

//Agora dou a bolinha intanciada de bola no palco a ação de clic
bola.onPress = function() {
//Se foi estiver em true, ele executa a primeira ação
if(foi) {
//Aqui faço a bolinha se movimentar no eixo x de 0 a 200 em 1 segundo
primeiroTween = new Tween(bola, “_x”, Back.easeOut, 0, 200, 1, true);
//Aqui ao terminar a ação do movimento da bolinha eu troco o valor da minha variavel
//assim evito que multiplos clics façam com que ela vá para proxima ação
primeiroTween.onMotionFinished = function() {
foi = false;
}
//Aqui é se ela já foi então volta
}else {
//Para ela voltar eu uso o yoyo() que faz a ação inicial ao contrário
primeiroTween.yoyo();
}
}

Simples fácil e pratico

Agora só aplicar para outras opções 😉
Té mais

[Tutorial] Banner Randomico

Bom esse tutorial é destinado a uma ferramenta que mostre banners randomicos, mas apenas de SWF’s não serve para passar banners em gif ou jpg

Apenas banners com varios frames, pois ele não calcula um tempo em si… ele apenas calcula quantos frames já passou se chegou ao total de frames ele passa para o proximo

O código é alto explicativo, espero que gostem

/*
*
* Codigo criado por Thiago de Oliveira Cruz
* Código para fazer banners randomicos, sem repetição até terminar de passar todos
*
*/

//Crio uma array com todos os meus banners
//Lembrando que aqui posso criar um XML para popular esse valor ou um LoadVars
var array:Array = new Array(‘banner1.swf’,’banner2.swf’,’banner3.swf’);
//Cria a string vazia que vai receber os banner que forem passando
var old:String = new String();
//Crio um contador
var count:Number = 0;

//Crio o alvo que vai carregar os clips
var alvo:MovieClip = this.createEmptyMovieClip(‘alvo’, 0);

//Crio minha função que vai fica loopando os swf’s
function init(){
var i = Math.round(Math.random()*2);
var str:String = array[i].toString();
//Crio o if que busca se o valor já passou pela nova array
if(old.indexOf(str) >= 0) {
//verifico se meu contador = valor total da array menos 1 pq a contagem de array é do 0 e não 1
if(count >= array.length){
//zero a string de banners
old = “”;
//zero meu contador
count = 0;
//re inicio minha função
init();
} else {
//somo + 1 ao meu contador caso ele não passe pelo resultado acima.
count++;
init();
}
}else{
//Somo o nome do baner a minha string de controle
old += str+”,”;
//Carrego os banners
loadMovie(array[i], alvo);
}
}
//Verificador do frame do banner, se atingir o maximo ele para e passa para o proximo
this.onEnterFrame = function(){
if(alvo._currentframe == alvo._totalframes){
init();
}
};

//Inicio toda a função
init();

Até a proxima

Twitter em seu site com flash

Aqui vou ensinar como fazer um arquivo de flash para pegar seus tweets do twitter.

Fiz adaptações no código de AS 3.0 para poder fazer para AS 2.0.

Vamos usar a API do proprio twitter pra fazer ok?

Então vamos lá
No flash:

/*
* Carregando o Twitter em seu flash
* Criado por Thiago de Oliveira Cruz
*/

//Primeiro passo é criar meu xml
var twitter:LoadVars = new LoadVars();
var twitterXML:XML = new XML();

twitterXML.ignoreWhite = true;

//loadPolicyFile
System.security.loadPolicyFile(‘crossdomain.xml’);

//Crio meu campo de texto
var campo:TextField = this.createTextField(“campo”, 1, 20, 20, Stage.width – 50, Stage.height – 50);
var stats:TextField = this.createTextField(“stats”, 2, 20, Stage.height – 40, Stage.width – 50, 50);
//Do a propriedade de multiline para ele e wordWrap
campo.multiline = true;
campo.wordWrap = true;

/*
* Crio meu scroll com o UIScrollBar
* (precisa colocar esse componente na biblioteca senão, não funciona)
*/
this.createClassObject(mx.controls.UIScrollBar, “scroller”, -5);
//Coloco o tamanho do campo igual ao palco
scroller.setSize(16, Stage.height – 50);
//Digo qual a posição do X do scroll
scroller._x = Stage.width – 16;
//Coloco o scrill ao campo
scroller.setScrollTarget(campo);

//Carrego o meu xml do twitter e vira um arquivo twitter.xml criado pelo php
twitter.load(‘twitter.php’);
//Ignoro os espaços em branco
twitter.onLoad = function(ok) {
if(ok){
//Recupero meu arquivo e carrego o xml
twitterXML.load(‘twitter.xml’);
twitterXML.onLoad = init;
}else {
trace(‘deu erro’);
}
}
//Coloco o XML num campo de texto previamente criado
function init(){
var cn = twitterXML.firstChild.childNodes;
for(var i = 0; i < cn.length; i++){
campo.text += cn[i].childNodes[2].firstChild.nodeValue + newline + newline;
}
}

Comopode ver eu uso um loadVars para carregar um php depois do que eleresponder… no caso ele deveria responder um XML em texto… mas aipor algum motivo, que eu desconheço… não consegui recuperar essetexto como XML para o flash com AS 2.0 então eu simplesmentetransformei em arquivo salvando em meu servidor.

Agora vamos ao PHP:

————– abre php ——————
/*
* Esse código foi criado por Thiago de Oliveira Cruz
* Sem fins lucrativos apenas para aprendizagem!
* Não pode ser vendido, nem com nenhum fim lucrativo
*/
#Essa função aqui precisa do curl ativado em seu sistema de PHP
#caso não tenha entre no php.ini de seu servidor… ou localhost e descomente o curl.dll
#para saber o que curl faz acesse http://www.php.net/curl
function get_content($url)
{
$ch = curl_init();

curl_setopt ($ch, CURLOPT_URL, $url);
curl_setopt ($ch, CURLOPT_HEADER, 0);

ob_start();

curl_exec ($ch);
curl_close ($ch);
$string = ob_get_contents();

ob_end_clean();

return $string;
}

#Aqui eu coloco meu arquivo XML que vai ser puxado do twitter… então coloque um legal aqui como o da CocaCola de Exemplo
$content = get_content (“http://twitter.com/statuses/user_timeline.xml?screen_name=CocaCola&#8221;);
#Aqui eu to colocando o cabeçalio desse arquivo aqui que deve retornar um XML ele sozinho…
#caso consiga recuperar no flash… não precisa fazer os passos de criação de arquivo.
header(“Content-type:text/xml”);

#Aqui eu crio um arquivo em meu servidor chamado twitter.xml
$nodes = fopen(‘twitter.xml’,’w’);
#Escrevo o texto todo que esse arquivo escreve… que já é um XML
fwrite($nodes, $content);
#Salvo meu arquivo
fclose($nodes);

#Aqui eu imprimo o arquivo como um XML em tela
echo $content;
——— fecha PHP ————-

Agora você precisa do crossdomain né?
Esse basta pegar um igual do twitter e salvar na mesma pasta de seu site
http://www.twitter.com/crossdomain.xml

Lembre-seque no meu código eu chamo o crossdomain no policy então é extremamenteobrigatório e necessário para que esse código funcione!!!

Espero que gostem e aproveitem bem.

Font do código: republicofcode

Abraços