Olá pessoal. Vou compartilhar com vocês agora o código do Menu Circular um código que não é meu…srrs mas vou postá-lo com devida autorização do autor.
Na verdade eu tenho uma mínima participação, que foi uma alteração que fiz na questão da profundidade.
Para aplicá-lo, você só necessita colocar os movieclips que irão rotacionar no palco, com escala de 100% para visualizar o tamanho real, e instanciá-los.
Coloque o seguinte AS no seu frame:
// variavies de configuracao
/*******************************************/
// guardar as instancias a serem rotacionadas em um vetor
var clips = Array(”cel1″, “cel2″, “cel3″, “cel4″);
var raio = 230;
// raio de rotacao
var aceleracao = 0.05;
// aceleracao do mouse para o giro
var alphaMinimo = 50;
// transparencia do botao de menu mais distante
var alphaMaximo = 100;
// transparencia do botao de menu mais proximo
var escalaMinima = 50;
// tamanho do botao de menu mais distante
var escalaMaxima = 100;
// tamanho do botao de menu mais distante
var mouseSeguro = 100;
// pixels em torno do centro nos quais o //altura minima
// mouse nao gira o menu
/*******************************************/
// Variaveis calculadas
/*******************************************/
// variacao da transparencia
var difAlpha = alphaMaximo-alphaMinimo;
// variacao do tamanho
var difEscala = escalaMaxima-escalaMinima;
// posicao central do menu em X e Y
var xIni = 50;
var yIni = -130;
var alturaMaxima = yIni;
//valor da altura
var alturaMinima = alturaMaxima-50;
var dobroRaio = raio*2;
var conversao = Math.PI/180;
// fator de conversao de angulo para radiano
var difAngular = 360/clips.length;
var diffAltura = alturaMaxima-alturaMinima;
// diferenca angular entre os itens de menu
var angulo = 0;
// angulo inicial da roda como um todo
/*******************************************/
// funcoes
/*******************************************/
// funcao para determinar as posicoes X e Y
// de um menu em funcao do angulo e do raio
function posCircular(angulo, raio) {
var pos = new Object();
var rad = angulo*conversao;
pos.x = Math.sin(rad)*raio;
pos.y = Math.cos(rad)*raio;
return pos;
}
// funcao para ser chamada na mesma frequencia da animacao
// e que eh responsavel por girar o menu
this.onEnterFrame = function() {
// calculamos se o mouse esta fora da area central
// e com que velocidade o menu ira girar
velocidade = (this._xmouse-xIni);
if (Math.abs(velocidade)<=mouseSeguro) {
velocidade = 0;
} else {
velocidade *= aceleracao;
}
// giramos o menu todo
angulo += velocidade;
// reposicionamos cada item do menu
for (i=0; i<clips.length; i++) {
// criar alias para o clipe de filme atual
var ptr = this[clips[i]];
// calcular a diferenca angular desse menu
// em relacao a origem da roda
ptr.difAngular = difAngular*i;
// buscar as posicoes X (profundidade) e Y (altura) do menu
var pos = posCircular(angulo+ptr.difAngular, raio);
ptr._x = xIni+pos.x;
// calcular percentual de afastamento do menu
// para alterar seu tamanho e transparencia
var perc = (pos.y+raio)/dobroRaio;
ptr._alpha = perc*difAlpha+alphaMinimo;
ptr._xscale = ptr._yscale=perc*difEscala+escalaMinima;
// colocar o menu acima dos que estao mais afastados
ptr.swapDepths(pos.y+dobroRaio);
// alterar posicao vertical do menu]
var pctPos = (ptr._xscale-escalaMinima)/(difEscala/100);
var posAlt = (pctPos*(diffAltura/100))+alturaMinima;
ptr._y = posAlt;
trace(posAlt)
}
trace(”———————”)
};
Agora, é só configurar, alterando os valores das variáveis. Entenda abaixo:
var clips = new Array; //Aqui você colocará o nome da instância dos movieclips que irão participar da rotação.var raio = 230; //Valor do raio da rotação
var aceleracao = 0.05; //Velocidade com que a rotação será feita
var alphaMinimo = 50; //Valor da transparência do movieclip quando estiver no limite do fundo
var alphaMaximo = 100; //Valor da transparência do movieclip quando estiver no limite da frente
var escalaMinima = 50; //escala em % do tamanho do movieclip quando estiver no limite do fundo
var escalaMaxima = 100; //escala em % do tamanho do movieclip quando estiver no limite da frente
var mouseSeguro = 100; //área central em pixels onde o mouse não aciona o menu
var xIni = 50; //posicão x inicial do menu
var yIni = -130; //posição y inicial do menu
var alturaMinima = -180; //altura em que o movieclip fica quando estiver no limite do fundo
var alturaMaxima = -130; //altura máxima que o movieclip fica quando estiver no limite da frente
É isso aí galera. QQ dúvida é só perguntar.
Você pode baixar um exemplo aqui.
A matéria do amigo Thiago dos Santos, autor do código original, você encontra aqui:
http://imasters.uol.com.br/artigo/2931/actionscript/menu_circular_em_3d/
*As imagens utilizadas no exemplo são para mera demonstração, os direitos são de seus autores
#1 por renato arantes em Abril 9th, 2008
caro weverton
gostei das modificaçãoes que vc fez neste menu circular,
como sou iniciante em flash, tenho uma dificuldade que é fazer novas imagens rodarem, apesar de ter criado as arrays delas e ter colocado elas no movieclip menu circular,
se puder me ajudar agradeço muito
renato
#2 por fabio em Maio 16th, 2008
estou com alguns problemas, não precisa definir nenhum movimento no frame principal???
#3 por Weverton Naves em Maio 16th, 2008
renato, mande-me o arquivo.
#4 por Weverton Naves em Maio 16th, 2008
fabio.
Que movimento?
De início, é só abrir e testar. Se precisar alterar algo, vc tem que mudar as configurações.
Abs
#5 por Pedro Diniz em Agosto 23rd, 2008
fala ai Weverton Naves, blz ?
era exatamente isso que estava procurando
mas como transformar os MC (fotos dos celulares) em botão ?
eu tentei apenas mudar de movie clip para botão mas ñ da certo, ñ parece ser tão simples assim neh
se possivel, me add no msn
pedrodiniz18@hotmail.com
valeu
#6 por Weverton Naves em Setembro 1st, 2008
Pedro, por volta da linha 74, vc cola o seguinte código:
ptr.onRelease = function(){
//suas ações aqui
}
Só que como isso é um loop, ele aplica o código para todos.
Abs.
#7 por STORM em Setembro 9th, 2008
Olá Weverton, por acaso você tem o tutorial desse menu em AS3, pedi pro Thiago mas ele disse que não está interado no AS3 ainda…rs
Beijos ficou lindo!
#8 por Weverton Naves em Setembro 11th, 2008
Então STORM,
Eu tbm não estou muito interado com o AS3 tbm.
Obrigado.
#9 por paula faria em Outubro 6th, 2008
e como faço para ele ficar na horizontal?
#10 por Raphael em Janeiro 21st, 2009
para Pedro diniz…..
para colocar um link diferente em cada botão eh simples….
clique em cima do cel que deseja inserir o link…
e pressione F9 (tela para inserir o action)
em seguida coloque o código
on (release){
getURL (”pagina.html”,”janela a ser aberta”);
}
é só isso….
espero ter ajudado =D
#11 por celso em Junho 4th, 2009
preciso de ajuda
estou usando esse menu giratorio, so que a velocidade dele e determinada conforme a distacia do mouse e o tamanho do palco, e como ele nao fica no centro nao esta ficando legal pois se vc vai para um lado maior gira mais rapido e no outro lado quase nao gira.
poderia me ajudar?
#12 por Weverton Naves em Junho 5th, 2009
Amigo, faça um if para que a sensibilidade do mouse só funcione em determinado espaço do palco.
Att.
#13 por Weverton Naves em Outubro 27th, 2009
renato, mande-me o arquivo.