mascara do scroll se adaptar a altura das imagens.

[linoart 0]

Estou fazendo um scroll horizontal. Tá funcionando que uma beleza.

 

Vou explicar melhor o scroll pra entenderem o que preciso fazer: Tem uma mascara no palco e um mc 'fotos' também no palco; dentro de 'fotos' tem 4 (por enquanto) imagens com altura diferentes e uma mascara que mostra a imagem de acordo com a posição do scroll. E mais, quando a posição da próxima imagem chegar na metade da máscara a máscara se adapte a altura dessa proxima imagem.

 

Agora, não estou conseguindo fazer o seguinte: pra máscara se adaptar a altura da proxima imagem tive de pegar a posição x da próxima imagem pelo fla, arrastando o mc 'fotos.' Só que tenho que fazer isso pelo código e dinamicamente pq terão mais imagens e terão largura diferentes. Então será ruim arrastar imagem por imagem no fla e ver a posição dela se não for por código.

 

Aqui tá o link pra verem como está até agora:

http://www.skintec.com.br/teste/scroll/

 

Vou colocar as classes que usei abaixo (a classe que verifico a posição das fotos é a 'Fotos' - última classe abaixo):

 

(classe do barra de scroll)

package com
{
	import flash.display.MovieClip;
	import flash.events.MouseEvent;
	import caurina.transitions.*;
	
	
	public class Box extends MovieClip
	{
		
		private var xOffset:Number;
		private var xMin:Number;
		private var xMax:Number;

		
		public function Box()
		{
			xMin = 0;
			xMax = barra.width - pan.width;
			pan.addEventListener(MouseEvent.MOUSE_DOWN, panDown, false, 0, true);
			stage.addEventListener(MouseEvent.MOUSE_UP, panUp, false, 0, true);
		}
		
		private function panDown(evt:MouseEvent):void
		{
			stage.addEventListener(MouseEvent.MOUSE_MOVE, panMove, false, 0, true);
			xOffset = mouseX - pan.x
			trace(mouseX)
			
		}
		
		private function panUp(evt:MouseEvent):void
		{
			stage.removeEventListener(MouseEvent.MOUSE_MOVE, panMove);
		}
		
		private function panMove(evt:MouseEvent):void
		{			
			pan.x = mouseX - xOffset;			
			
			if(pan.x <= xMin)
			{
				pan.x = xMin;
			}
			
			if(pan.x >= xMax)
			{
				pan.x = xMax;
			}
			
			dispatchEvent(new MoverFotos((pan.x / xMax)));
			evt.updateAfterEvent();
		}
		
	}	
}

(classe do dispatchEvent)

package com
{
	import flash.events.*;
	
	public class MoverFotos extends Event
	{
		public static const VALUE_CHANGED = "valueChanged";		
		public var percentPos:Number;

		
		public function MoverFotos(num:Number)
		{			
			super(VALUE_CHANGED);
			percentPos = num;
		}	
		
	}	
}

 

(classe do mc que contem todos objetos - scroll, fotos e mascara)

package com
{
	import flash.display.*;
	import flash.events.*;
	import caurina.transitions.*;
	
	public class Fotos extends MovieClip
	{		
	
		private var wFoto:int;
	
		public function Fotos():void
		{
			scrollBar.addEventListener(MoverFotos.VALUE_CHANGED, fotosX);
			
		}
		
		private function fotosX(evt:MoverFotos):void
		{
			// aqui está a posição das fotos que verifico para aumentar a máscara
			[b]if(fotos.x <= -50)
			{
				//masker.height = fotos.img2.height;
				Tweener.addTween(masker, {height:fotos.img2.height, time:0.7});
			}
			
			if(fotos.x <= -400)
			{
				//masker.height = fotos.img2.height;
				Tweener.addTween(masker, {height:fotos.img3.height, time:0.7});
			}
			
			if(fotos.x <= -700)
			{
				//masker.height = fotos.img2.height;
				Tweener.addTween(masker, {height:fotos.img4.height, time:0.7});
			}[/b]
			Tweener.addTween(fotos, {x:(-evt.percentPos*(fotos.width- masker.width)), time:1});
			
		}
		
		public function posImagens(evt:Event):void
		{
			
		}
	}
}

Abraços,

[Michel Araújo 0]

uma ideia: você poderia adicionar as fotos à um Array, e a cada VALUE_CHANGED você percorre esse array comparando a posição x de cada foto, com as posições de marcação da mascara (os dois cantos)... você poderia criar uma variável, calculando a direção do scroll, precisando comparar só com o lado correspondente, ou então comparar a uma marcação só (o meio por exemplo).

 

Quando a posição x de uma determinada foto for igual à marcação, você muda a altura da mascara para a altura dessa foto...

 

é uma ideia =)

[linoart 0]

O problema é que as fotos estão dentro de um movieclip e a mascara não está dentro do movieclip das fotos. Então o que tá movendo é o mc das fotos.

 

Teria que pegar o proximo objeto do mc das fotos mas do lado de fora dele. Só não sei como.

 

Abraços,

[Michel Araújo 0]

sim, mas os as fotos são independentes, não?

 

basta que elas tenham um nome de instancia (seja colocado manualmente, ou o nome dado ao inseri-la no palco com AS), e você pega a posição delas usando:

 

movieClipQueMove.foto.x;

assim você pode acessar as informações da foto, mesmo estando 'do lado de fora dele'.

[linoart 0]

Elas não são independente. Elas estão dentro de um movieclip chamado 'fotos', dentro dele tem as imagens 'img1', 'img2','img3'... Então, qualquer uma das fotos não vai sair da sua posição; o que vai sair da posição é o mc 'fotos', que recebe a mascara.

 

Se fizer fotos.img1.x será sempre o mesmo valor. Isso pra todas 'img' dentro de 'fotos'.

 

Abraços,