É um imenso prazer estar aqui com vocês, em minha primeira matéria no iMasters. Meu objetivo será postar alguns códigos que surgem na necessidade do dia-a-dia, tanto em níveis iniciantes como avançados. Não vou dizer que postarei em uma frequencia periódica, mas garanto-lhes que não será esporádico, afinal, Actionscript é minha paixão.
http://meu.imasters.com.br/autor/publicacao/
Voltar ao indice de artigos
Agora chega de embromação e vamos ao que interessa: ActionScript.
Escolhi para essa primeira matéria um código que me foi muito útil há um tempo atrás: o posicionamento randômico de MCs sem sobrepô-los. No meu caso, eu precisava posicionar alguns tópicos de um site, que eram no formato de quadrados aleatoriamente, mas estes não podiam ficar sobrepostos. Então mergulhei-me na Aba de Actions, e nasceu mais este filho.
Versão de AS: ActionScrip 2.0
Compatibilidade: Flash Player 6 ++
Dificuldade de produção: 5
Dificuldade de aplicação: 3
Produzido em: 2 hs
1º Crie seus movieclips e posicione-os no palco. Apenas um frame será necessário. Lembrando que podem ser quantos desejar. No meu caso, eu fiz alguns quadrados com um texto dinâmico de var “num” dentro de cada um, para facilitar o debug.
2º Instancie-os da maneira desejada. Qualquer nome é válido, não precisa ser sequencial, pois a referência a eles estarão em uma Matriz.
3º Poste a actionscript no frame:
//variáveis
var myMCs:Array = new Array(mc1, mc2, mc3);
var raiz = _root;
//distancia nas laterais
var distW = distH=20;
//função para definir os tamanhos
function defineX(i) {
//define como emcima por padrão
var emCima = true;
//enquanto estiver em cima, ele tenta pegar as posições corretas
while (emCima) {
//define as variaveis randomicas para x e y
X = random(500);
Y = random(350);
//número de emcimas
nCima = 0;
//para debug:
trace("KIT de "+i+" - X:"+X+" Y:"+Y+" nCima:"+nCima);
//faz o loop para averiguar se está emcima de algum
for (a=1; a<=i; a++) {
var mc = myMCs[i-1];
//ve se está em um local que não dá para ir
if ((X>Stage.width-mc._width) || (Y>Stage.height-mc._height)) {
trace("está em um lugar muito distante");
nCima++;
break;
}
//comparar se o valor X está em cima de algum mc, se não for o primeiro
if (i>1) {
var mcBase = myMCs[a-1];
if ((X>(mcBase._x+mcBase._width+distW)) || ((X+distH+mc._width)<mcBase._x)) {
//se não estiver, ele não faz nada
trace(i+": "+a+": não está em cima");
} else {
trace(i+": "+a+": NO X está em cima de "+mcBase+"._x:"+mcBase._x+" _y:"+mcBase._y);
//se estiver sobrepondo na largura, ve se está na altura
if ((Y<(mcBase._y+mcBase._height+distH)) && ((Y+mc._height+distH)>mcBase._y)) {
trace(i+": "+a+": NO Y está em cima de "+mcBase+"._x:"+mcBase._x+" _y:"+mcBase._y);
//adiciona mais um em cima
nCima++;
//quebra o for
break;
}
}
//se for o primeiro
} else {
trace("é o primeiro");
emCima = false;
break;
}
}
//faz a verificação para ver se tem algo em cima e quebrar o while
if (nCima == 0) {
//muda a variável para quebrar o loop
emCima = false;
}
}
//retorna as variáveis X e Y
return [X, Y];
}
//loop para posicionar cada um dos mcs corretamente
for (i=1; i<=myMCs.length; i++) {
var clip = myMCs[i-1];
clip.num = i;
clip.numArray = i;
var AeL = defineX(i);
clip._x = AeL[0];
clip._y = AeL[1];
trace("O x,y de "+clip+" é:"+clip._x+","+clip._y);
}
//A parte embaixo é opcional, pois só faz a animação dos mcs. Lembrando que para utilizá-la é necessário exportar em versão 7
//Chama a função transitions, que aplica a classe TransitionManager para os mcs
import mx.transitions.*;
import mx.transitions.easing.*;
Transitions();
function Transitions() {
for (i=1; i<=myMCs.length; i++) {
var clip = myMCs[i-1];
TransitionManager.start(clip, {type:Fly, direction:Transition.IN, duration:3, easing:Elastic.easeOut, startPoint:9});
}
}4º Na linha 2, existe a Matriz (Array) “myMCs”. Altere o seu conteúdo (mc1, mc2, mc3), pelo nome dos movieclips que quer posicionar, lembrando que não precisa ser exatamente 3.
5º É só testar o filme! Pode perceber que cada vez que você testa, os mc’s estão em um lugar, e nunca estarão sobrepostos.
Notas finais
- A animação (código a partir da linha 72), é opcional;
- Na linha 64, colocamos a variável “num” com o valor do loop do mc, somente para debug, esta linha não é necessária.
- Para utilizar a opção da animação, é necessário exportar em versão 7;
- Você pode fazer o download dos arquivos clicando aqui.
- Visite o meu blog e comente o arquivo, ou acesse o fórum iMasters para postar alguma dúvida.
- Você pode baixar os arquivos aqui
É isso aí galera. Espero que tenham gostado. E aguardem, que por aí vem mais!
Abraços.
De 0 a 10, o quanto você recomendaria este artigo para um amigo?