Click to See Complete Forum and Search --> : Help!!! Make Items in a List Move Infinitely
anthonyv1121
03-11-2009, 10:33 PM
I have an MC that is a giant text box that contains 20 different items laid out vertically, like this for example:
A
B
C
D
E
etc
I want to make the list infinitely moveable/draggable on its y position, meaning the user can drag this list up and down but the list never ends.....In other words when the user drags to the last item in the list, the list, the list starts over again. And the same works in the reverse; if the user is dragging up and gets to the first item, the last item pops up after and then goes in reverse. In other words no ending. Think The Price Is Right Wheel or the alram clock on the iPhone or iPod touch.
Any help would be appreciated...Thanks
neznein9
03-12-2009, 01:19 PM
You need to triple your MC:
A1 stack.y=-300px
B1
C1 ________ stage.y = 0
A2
B2 viewable area
C2 ________
A3
B3
C3
(This is assuming your viewing window is only 3 high...you might have to duplicate further) - the goal is to always be looking at the center set. So, if you start with A2-C2 visible, you can drag fully up or fully down and only see up to A1 and down to C3 - when the user releases, you need to calculate whether they've moved up or down from the starting position, and then adjust for that.
For the sake of explanation, lets say each button is 100px tall - so the viewable window is 300px, the total stack is 900px. You start with the stack set to -300px - so A2 is right at the top of the window - the user then drags upward to reveal half of C3 and releases - the user released the stack at -550. The goal is to keep the stack centered so that means .y needs to be within 300px of -300: [-150 – -450]. To get back to center, shift the entire stack by 300 (the height of the base set of 3 buttons) - which puts things back at -250 - so instead of seeing half of C3 at the bottom, the user now sees half of C2 in exactly the same spot. Make sense?
anthonyv1121
03-12-2009, 01:51 PM
I'm using the code below and i got it to loop on its own based on mouse movement. I want the looping/movement to be activated by the user literally dragging up and down. Do you know how I can do that?
import flash.events.Event;
var ycenter:Number=300;
var speed:Number=.05;
slider_mc2.addEventListener(Event.ENTER_FRAME, doit);
function doit(event:Event):void
{
var distance:Number=mouseY-ycenter;
event.target.y+=(distance*speed);//or clip.y+=(distance*speed);
if (event.target.y > 110) {
event.target.y = -1074;
}
if (event.target.y < -1074) {
event.target.y = 110;
}
}
neznein9
03-12-2009, 01:59 PM
Should look something like this:
var ycenter:Number=300;
var speed:Number=.05;
slider_mc.addEventListener(MouseEvent.MOUSE_DOWN, function(e:MouseEvent):void{
slider_mc.startDrag();
_dragging = true;
stage.addEventListener(MouseEvent.MOUSE_MOVE, doit);
});
slider_mc.addEventListener(MouseEvent.MOUSE_UP, function(e:MouseEvent):void{
if(_dragging){
_dragging = false;
slider_mc.stopDrag();
stage.removeEventListener(MosueEvent.MOUSE_MOVE, doit);
}
});
function doit(e:MouseEvent):void{
slider_mc.y += (mouseY - ycenter) * speed;
if(slider_mc.y > 110) slider_mc.y -= 1184;
if(slider_mc.y < -1074) slider_mc.y += 1184;
}
flashkit.com
Copyright Internet.com Inc., All Rights Reserved.