domingo, 16 de maio de 2010

Carregar imagem externa no flash com loadMovie

Autor: Rodrigo Gonçalves

Versão AS: Actionscript 2.0
Dificuldade: básico
Obs.: Para um bom entendimento deste tutorial,
é interessante ter familiaridade com a interface do programa Flash e lógica de programação.

Neste tutorial veremos como carregar uma imagem externa com o função loadMovie() do Actionscript 2.0.
O loadMovie pode ser utilizado em casos mais simples de carregamento externo. Porém, se precisar ter maior controle e algo mais complexo sobre carregamento externo, é melhor utilizar a classe MovieClipLoader() do AS2.

Donwload do exemplo:
No final deste tópico existe um exemplo do que podemos fazer com a função loadMovie.

Receita: O que precisamos pra fazer funcionar o loadMovie:

Ingredientes:
* 1 função loadMovie();
* 1 Movie clip, que será nosso alvo e deve ter um nome de instância para referência-lo no Actionscript;
* 1 imagem que deseja carregar podendo ser com as seguintes extensões:
jpg, png, gif(não animados) ou um arquivo swf.

Ingredientes anotados, “mão na massa”!

Abra seu Amigo Flash, crie um novo documento.
Caso você utilize a versão Flash CS3, na hora de criar um novo documento escolha a opção “Actionscript 2.0″.

Crie 2 camadas com seguintes nomes:
Camada 1: actions
Camada 2: alvo_mc

Imagem 1: organizando camadas.Na camada “alvo_mc” no frame (quadro) 1
Crie um Movie Clip vazio (Ctrl + F8) com as seguinte configuração:
* Name: mc_vazio
* Type: Movie Clip

A configuração deve ficar como a imagem 2 a seguir.


Imagem2: criando novo Movie Clip vazio.

O Movie Clip (MC) não deverá conter nenhum conteúdo inserido neste MC. Isto mesmo. Exatamente nenhum conteúdo.
Precisamos deste MC vazio para ser um “alvo” para imagem que irá carregar. Caso tenha conteúdo neste MC a imagem nova irá carregar no lugar da atual. Então, neste caso apenas deixamos o MC vazio para este fim de carregar imagem externa.
Após criar seu MC Vazio deve ficar algo parecido como na imagem 3 logo abaixo.


Imagem 3: 1 Movie Clip vazio.

Retorne para a cena 1 (scene 1). Este MC vazio que criamos estará na biblioteca.
Precisamos arrastar este MC para o palco (stage) e nomea-lo com uma instância pra “chamar” pelo Actionscript.

Selecione a camada “alvo_mc” no 1º frame. Abra a biblioteca (ctrl + L ou F11) em seguida arraste este MC vazio para o palco, posicione onde você quiser.
Obs: Lembra-se este MC será um “alvo” pra carregar a imagem desejada.
Então, imagine o tamanho em largura e altura em pixels pra determinar a posição mais adequada no palco pra este MC vazio receber sua imagem.


Imagem 4: arrastando o MC vazio da biblioteca para o palco(stage) do Flash.

Logo em seguida, selecione seu MC e insira um nome de instância: “alvo_mc”(sem aspas).
Obs: Você pode colocar outro nome de instância de sua preferência. Mas, para este exemplo utilizamos a intância “alvo_mc”.


Imagem 5: inserindo um nome de instância para o Movi clip.

Podemos agora chamar este MC pelo Actionscript.
Antes de inserirmos este código, você deve conhecer a sintaxe do loadMovie no Actionscript 2.0 isto facilita na criação do seu código:

loadMovie(endereco_url:String, Alvo:Objeto);

Dicas: Você pode encontrar algo mais detalhado no “Ajuda do Flash” (tecla F1).

Na camada “actions” no 1º frame abra o painel de Actions (F9).
Insira o seguinte código:

loadMovie(”imagem.jpg”, alvo_mc);

Uma outra maneira de declarar loadMovie seguindo esta mesma lógica:

alvo_mc.loadMovie(”imagem.jpg”);

A única diferença notável está na escrita, declaramos antes o objeto(Movie Clip) e depois o loadMovie(”enedereço da imagem”).

Entendendo o código

O endereço URL pode ser absoluto (http://…/imagem.jpg) ou um endereço relativo (imagem.jpg).
Para este exemplo foi apenas sugestivo para facilitar no entendimento.
Para ver em funcionamento este exemplo, basta você colocar um endereço URL da imagem ou criar uma imagem com o nome que desejar.

Mas, caso não carregar a imagem, alguns dos erros mais comuns são:
* A imagem está com outra extensão ou nome;
* A imagem não existe no local proposto;
* O endereço da imagem não existe;
* A sintaxe do Actionscript está incorreta;
* Nome de instância do Movie Clipe está errado.
* Não existe um nome de instância.

Pronto! Você terá algo parecido como a imagem logo abaixo. Basta você escolher uma imagem de sua preferência.

Imagem 6: resultado final carregando a imagem com loadMovie.

Esta imagem é apenas sugestiva. Isso nada mais é que um Movie clipe vazio com um nome de instância que determinamos neste tutorial e que recebe um endereço da imagem.

Criando MovieClip vazio com createEmptyMovieClip()

Agora que você entendeu o conceito do loadMovie, fizemos nos exemplos anteriores todo trabalho mais “manual”. Podemos simplificar ainda mais apenas utilizando 2 linhas de código.
Iremos criar um MovieClip vazio dinamicamente pelo código e depois importar sua imagem/swf para o MovieClip criado.

O método utilizado para criar MovieClip Vazio é createEmptyMovieClip() da classe MovieClip para AS2.
Vamos ver a sintaxe para entedermos como utilizá-lo. Vejamos:

MovieClip.createEmptyMovieClip(name:String, depth:Number) : MovieClip

Este método solicita 2 parametros/argumentos, sendo:
- name: referente ao nome de instância que você dará para o MovieClip a qual conseguiremos manipulá-lo via Actionscript. Deverá colocar o nome entre aspas(dupla ou simples) pois é um dado do tipo String.
- depth: é a profundidade que será anexado esse MovieClip referente ao seu alvo. O valor será do tipo numérico.

Quando isso for criar retornará um objeto do tipo MovieClip.

Vamos ao exemplo.
Abra um arquivo novo.
Na 1º camada, selecione o frame 1, abra o painel de Actions [F9] e insira o seguinte código:

_root.createEmptyMovieClip(”alvoMc”, 0);
alvoMc.loadMovie(”sua_Imagem.jpg”);

Na 1º linha, criamos um Movie Clip vazio(createEmptyMovieClip) na timeline principal do Flash(root/raiz) e demos o nome de instância alvoMc que ficará anexado em um nível de profundidade 0 da timeline principal(root);
Repare que, a sintaxe do método createEmptyMovieClip() solicita um alvo para criar seu MovieClip vazio, ou seja um alvo do tipo MovieClip. Mas, colocamos um _root. Por que?
O _root é considerado pelo Flash como uma MovieClip principal(raiz) criado por padrão pelo programa, por isso quando utilizamos _root, estamos nos referindo a timeline principal do Flash.
Você poderia criar um MovieClip vazio em outro MovieClip criado. Ex.:

seuMovieClipAqui.createEmptyMovieClip(”alvoMc”, 0);

Na 2º linha, apenas aplicamos o carregamento de uma imagem externa no alvo desejado utilizando o método loadMovie que você já conhece nos exemplos anteriores.

Não tem nada inserido manualmente no stage, apenas o código.

Você pode adaptar em seu projeto. Isso pode ser muito útil para aplicações mais simples.
Caso queira criar por exemplo “galeria de imagens” onde você precisa de maior controle no carregamento. É aconselhável utilizar a classe MovieClipLoader() do AS2. No Help do Flash(atalho F1) você encontra mais informações e exemplos de como utilizá-lo.


Donwload 1 – exemplo com função loadMovie.

0 comentários:

Postar um comentário

Proibido palavras ofensivas, racistas ou descriminatórias.

[Seu Comentário será liberado no máximo em 24horas]