s26

as3.0でscriptのみでスクロールバー実装(フルサイズのみ対応)

まぁ、簡単に指定するだけで、スクロールできるものを作成します。

以下に完成をアップしておきました
http://prfry.net/practice/slider/sb.zip

//ステージの中にコンテナを作成して、スクロールバーを作成します。
//最初は四角を作成してスクロールの形を作成します。
public function Scrollbar():void {
	container = new MovieClip();
	scroll_bg = new Sprite();
	scroll_bg.graphics.beginFill(0xcccccc);
	scroll_bg.graphics.drawRect(-12,0,12,200);
	scroll_bg.graphics.endFill();
	grab = new Sprite();
	grab.graphics.beginFill(0x666666);
	grab.graphics.drawRect(-12,0,12,30);
	grab.graphics.endFill();
	container.addChild(scroll_bg);
	container.addChild(grab);
}

スクロールバーに関しては、何を対象にするかが必要なので、置いただけででは少し無理なので、
何を対象にするか指定する部分を作ります。
サイズが小さい時など必要がなかったりするので、addChildを行うかなどの条件を分岐します。

public function init(t:MovieClip):void {
	//スクローラーの高さを設定します。
	scroll_bg.height=stage.stageHeight;
	target = t;
	//ステージの横によせる
	container.x=stage.stageWidth;
	container.y=0;
	
	if (target.height<=scroll_bg.height) {
		change_flag = false
	}else {
		addChild(container);
		change_flag = true
		//イベントの設定
		event_make();
	}
	stage.align = StageAlign.TOP_LEFT;
	stage.scaleMode = StageScaleMode.NO_SCALE;
	stage.addEventListener(Event.RESIZE, _resize);
}
private function _resize(e:Event):void {
	scroll_bg.height=stage.stageHeight;
	//ステージの横によせる
	container.x=stage.stageWidth;
	container.y = 0;
	
	if (target.height <= scroll_bg.height) {
		if(change_flag ==true){
            //イベント削除
			event_remove();
			removeChild(container);
		}
		change_flag = false
	}else {
		if(change_flag==false){
            //イベント作成
			event_make();
			addChild(container);
		}
		change_flag = true
	}
	grab.y=0;
	if (!hasEventListener(Event.ENTER_FRAME)) {
		addEventListener(Event.ENTER_FRAME, scrollenterframe);
	}
}

イベント自体は3つだけです。マウスホイールと、マウスのドラッグの設定を行います。

private function event_make():void {
	grab.addEventListener(MouseEvent.MOUSE_DOWN, dragScroll);
	stage.addEventListener(MouseEvent.MOUSE_UP, stopScroll);
	stage.addEventListener(MouseEvent.MOUSE_WHEEL, mouseWheelHandler);
}
		
private function event_remove():void {
	grab.removeEventListener(MouseEvent.MOUSE_DOWN, dragScroll);
	stage.removeEventListener(MouseEvent.MOUSE_UP, stopScroll);
	stage.removeEventListener(MouseEvent.MOUSE_WHEEL, mouseWheelHandler);
}

イベントの時はスクロールを始めたいのですが、少し軽くできるようにします。(詳しく見てくださいー。)

//ドラッグの開始の瞬間からステージの方に関してはエンターフレームで現在のグラブの位置に観応して移動をする。
private function dragScroll(event:MouseEvent):void {
	//グラブに関しては、上から下まで動く。
	var sRect:Rectangle=new Rectangle(0,0,0,stage.stageHeight-grab.height);
	grab.startDrag(false, sRect);
	addEventListener(MouseEvent.MOUSE_MOVE, _mousemove);
}

マウスが動いた時と、きちんと動く場合だけ、うまくスクロールに準じてエンターフレームが発動するようにしてあります。

private function _mousemove(e:MouseEvent):void {
	if (!hasEventListener(Event.ENTER_FRAME)) {
		addEventListener(Event.ENTER_FRAME, scrollenterframe);
	}
}
//
private function mouseWheelHandler(event:MouseEvent):void {
	if (event.delta<0) {
		grab.y += 10;
		if (grab.y>stage.stageHeight-grab.height) {
			grab.y=stage.stageHeight-grab.height;
		}
		if (!hasEventListener(Event.ENTER_FRAME)) {
			addEventListener(Event.ENTER_FRAME, scrollenterframe);
		}
	} else {
		grab.y -= 10;
		if (grab.y<0) {
			grab.y=0;
		}
		if (!hasEventListener(Event.ENTER_FRAME)) {
			addEventListener(Event.ENTER_FRAME, scrollenterframe);
		}
	}
}

//ステージの外にマウスが移動した場合には、ドラッグが終了
private function stopScroll(event:MouseEvent):void {
	removeEventListener(MouseEvent.MOUSE_MOVE, _mousemove);
	grab.stopDrag();
}
	private function scrollenterframe(evt:Event):void {
	var op:Number = (-1)*grab.y/(stage.stageHeight-grab.height)*(target.height-stage.stageHeight)
	target.y += (op-target.y)/10
	if (Math.abs(target.y-op)<0.1) {
		removeEventListener(Event.ENTER_FRAME,scrollenterframe);
	}
}

アップしておきました
http://prfry.net/practice/slider/sb.zip