Rolagem horizontal com cliques

[juniormatrix 2]

Olá pessoal!

 

Estou tentando fazer isso funcionar, mas ta dificil.

 

Gostaria de saber se alguém conhece um tutorial que faça o seguinte: clicar nos botões de seta e mover a barra de botoes de cores para a direita e esquerda, segue imagem de modelo:

 

 

Já procurei na web, inclusive em sites estrangeiros, mas a única coisa que achei foi com rolagem horizontal movendo o mouse de um lado para o outro, mas eu preciso que o movimento seja clicando nas setas laterais.

 

Se alguém puder ajudar, fico grato.

[Public2004 79]

Então amigo eu não sei qual a versão do AS está utilizando, mas para o que quer a lógica é bem simples, ex:

A barra de cores é um objeto (MovieClip) assim como as setas (esquerda e direita) mas independentes então, basta criar para as setas um evento para o click do mouse com a função de mover o objeto (MC barra de cores) para esquerda ou direita no eixo "x" (horizontal) com valores definidos, ex:

mc_barra.x += 20; // mover para direita

mc_barra.x -= 20 // mover para esquerda

E aí para não sair da área visível (entre as setas), crie uma condição para verificar a posição da barra a cada movimento e travar nos limites.

 

Espero que ajude.

Att.

[juniormatrix 2]

Olá Public 2004

 

Então, estou usando AS3. Até eu mesmo tentei fazer algo parecido, como pode observar abaixo:

 

//TWEENMAX

import com.greensock.*;

import com.greensock.easing.*;

//SETAS NAVEGAÇÃO CORES

painel_mc.seta1_mc.buttonMode = true;

painel_mc.seta2_mc.buttonMode = true;

painel_mc.seta1_mc.addEventListener(MouseEvent.CLICK, seta1);

function seta1(e:MouseEvent):void

{

TweenMax.to(painel_mc.cores_Camisa_mc, 1, {x:"174"});

}

painel_mc.seta2_mc.addEventListener(MouseEvent.CLICK, seta2);

function seta2(e:MouseEvent):void

{

TweenMax.to(painel_mc.cores_Camisa_mc, 1, {x:"-174"});

}

A questão é que funciona, mas não sei se é a forma correta e mais adequada para tal.

E eu me deparei com outro detalhe: ao passar todas as cores, o botão - seta1_mc ou seta2_mc - teria que ficar desabilitado, e não sei como fazer isso.

Se me der uma dica, fico grato!

[Public2004 79]

Sim é basicamente isso, fazer os movimentos esquerda ou direita no eixo "x" de acordo com o clique na referida seta, no seu caso aplicou o Twenn para dar um efeito mais chic...

 

Se a sua barra tem tamanho definido é mais fácil criar a condição para verificar os limites, basta a cada clique e movimento checar a posição "x" do objeto, se for igual ou maior q o limte, desabilita o botão, tipo:

if(seu_mc.x >= valor_limite) {

//desabilita o botão

} else {

// habilita o botao

}

 

Não me recordo se é possível fazer isso diretamente com os métodos do Tween...

 

Att.

[juniormatrix 2]

Blz, vou testar e postar o código em seguida.

[juniormatrix 2]

Fiz desta forma e funcionou. Se é a forma mais correta ou adequada, não sei dizer, mas funcionou:

 

//SETA 1

stage.addEventListener(Event.ENTER_FRAME, ocultarSeta);

function ocultarSeta(e:Event):void

{

if (cores_Camisa_mc.x >= -140)

{

seta1_mc.visible = false;

}

else

{

seta1_mc.visible = true;

}

}

//SETA 2

stage.addEventListener(Event.ENTER_FRAME, ocultarSeta2);

function ocultarSeta2(e:Event):void

{

if (cores_Camisa_mc.x <= -400)

{

seta2_mc.visible = false;

}

else

{

seta2_mc.visible = true;

}

}