Scroll bar

i’ve read the tutorial on making scrollable texts but i wannna know how to make a scroll BAR. instead of just the scroll buttons… can anyone help me? thanx

scroll bars are much more complicated.

the basic principle would be to have the scroll value of the text be set by the _y position of the bar.

if you make a button that looks like a scroll bar, and then make that button a movie, you can start with this…

in the button:
on(press){
mpress = 1;
}
on(release){
mpress = 0;
}

then in the movie:
onClipEvent(enterFrame){
if(mpress){
_parent.text.scroll = Math.round(this._y);
}
}

this is extremely rudimentary. you’ll want to make the bar’s starting _y value equal 1. for some reason, scrolls are not zero based.

this is missing all kinds of things. there are no limits on where you can drag the bar to. the bar is not sized according to content size. the bottom is not in the same place for different amounts of text. the bar doesn’t move if you scroll using the arrows (if they even exist), etc, etc.

say you wanted you scroll bar to be, say, 300 pixels tall (the whole scroll bar, not just the draggable bit). we could use some code that would make the text scroll proportionately rather than absolutely, like this:

onClipEvent(enterFrame){
if(mpress){
_parent.text.scroll = Math.round(this._y/300*_parent.text.maxscroll);
}
}

so in english, make text.scroll equal:
the position of the bar
divided by the the whole bar - so it were at 150 we would end up with .5
multiplied by the maxscroll. - .5 x the maxscroll will be halfway through the text, right?

you need to say Math.round because decimal numbers are not valid values for scroll, which is too bad, because then you could get a much smoother scroll.

we still haven’t limited the distance you’re allowed to drag the bar. i’d do that with more if statements in the onClipEvent:

if(this._y<300 and this._y> 0){

}

that should be enough to get you started.

good luck!

wow man… ur greek is superb… i understood all of that… NOT… funny… i need to go away now =[

whoops!

i’m missing a rather key piece of code.

in the button:

on(press){
mpress = 1;
startDrag(this,false,this._x,0,this._x,300); // dragging the bar is good. ; )
}

on(release){
mpress = 0;
stopDrag(); // i guess we’ll need this one too.
}

my apologies to anyone who tried to work that out.

as an added bonus, by using startDrag, we can spec the limits of the drag right in the command as above. i limited it’s horizontal movement to nothing, by setting the limits to equal where ever it is right now; and the verts to be 0 at the top and 300 at the bottom.

never mind that extra if statement i’d proposed earlier…