smooth scrollbar, horizontal und mit mousewheel scrollbar

[flabastler]

Hey,

ich habe bereits einige nützliche Dinge aus diesem guten Forum entnehmen können, jedoch komme ich bei folgendem Vorhaben nicht sonderlich weiterauch google konnte mir hier nicht viel weiterhelfen)

ich möchte eine horizontale smooth scrollbar erstellen die ich mit Hilfe des Mausrads scrollen kann. Zudem sollen die mc´s, die dann auf der Bühne sind skalieren werden, so dass ich diese an die Bildschirmgröße anpassen kann( ist das dann noch einfach mit der Funktion MC.width = stage.stageWidth/1 möglich?).

Ich habe bereits dazu vergeblich mit einer class-Lösung gearbeitet.

Ich freue mich über jede Hilfe, vielleicht habt ihr auch Tipps wie mein Vorhaben evtl. besser lösbar ist (außer mit as3). Vielen Dank im Vorraus!

Gruß Simon

[milchreis]

willkommen im Flashforum

Zitat von flabastler

MC.width = stage.stageWidth/1 möglich?).

Bei der Division mit 1 kommt selten etwas neues raus.

Zitat von flabastler

Ich habe bereits dazu vergeblich mit einer class-Lösung gearbeitet.

Dann zeig doch mal, was du bisher hast.

[flabastler]

Danke für die schnelle Antwort

mit dem folgenden Code habe ich bereits versucht die class Lösung umsetzen:

die main-Datei:

import flash.display.MovieClip;
import classes.Scroller.*;

public class main extends MovieClip
{
function main()
{

var myPane = new sampleMC();
addChild(myPane);
myPane.x = myPane.y = 10;

var myScroller = new Scroller(myPane, myPane.width, 400, new scrollerFace(),"horizontal");
}

}

-------und die scroller-Datei:----------

import flash.display.MovieClip;
import flash.events.MouseEvent;
import flash.geom.Rectangle;
import fl.transitions.easing.*;
import classes.TweenLite;

public class Scroller extends MovieClip
{
private const MIN_FACE_SIZE:int = 25;
private const MOUSE_WHEEL_PRECENTAGE:Number = 0.5;
private const gap:int = 0;

private var ScrollerPane:MovieClip;
private var PaneMask:MovieClip;
private var ScrollerFace:MovieClip;


function Scroller(pane:MovieClip, w:int, h:int,FaceMC:MovieClip,align:String):void
{
ScrollerPane = pane;
ScrollerFace = FaceMC;

PaneMask = createMask(ScrollerPane, w, h);
PaneMask.x = ScrollerPane.x;
PaneMask.y = ScrollerPane.y;
pane.parent.addChild(PaneMask);
pane.mask = PaneMask;


ScrollerPane.addEventListener(MouseEvent.MOUSE_WHE EL, mouseWheelHandler);

createScroller(ScrollerPane,w,h,FaceMC,align);
}



private function createScroller(ScrollerPane, w, h, FaceMC:MovieClip, align) {
ScrollerPane.parent.addChild(FaceMC);
FaceMC.x = ScrollerPane.x + w + gap;
FaceMC.y = ScrollerPane.y;
var FaceSize = (PaneMask.width / ScrollerPane.width) * PaneMask.width ;
if (FaceSize>MIN_FACE_SIZE) FaceMC.width = FaceSize;

FaceMC.buttonMode = true;
FaceMC.addEventListener(MouseEvent.MOUSE_DOWN,Scro llFaceDown)
FaceMC.addEventListener(MouseEvent.MOUSE_UP,Scroll FaceUp);
}


private function StageMouseUP(event:*)
{
ScrollFaceUp(event);
}


private function ScrollFaceDown(event:*)
{
ScrollerPane.stage.addEventListener(MouseEvent.MOU SE_UP, StageMouseUP);
ScrollerPane.stage.addEventListener(MouseEvent.MOU SE_MOVE, mouseMoveHandler);

var bounds:Rectangle = new Rectangle(PaneMask.x+PaneMask.width+gap, PaneMask.x, 0 , PaneMask.width-ScrollerFace.width);


ScrollerFace.startDrag(false,bounds);

}


private function ScrollFaceUp(event:*)
{
ScrollerPane.stage.removeEventListener(MouseEvent. MOUSE_UP, ScrollFaceUp);
ScrollerPane.stage.removeEventListener(MouseEvent. MOUSE_MOVE, mouseMoveHandler);
ScrollerFace.stopDrag();

}


private function updatePanePosition()
{
var precentage = (ScrollerFace.x- PaneMask.x)/ ( PaneMask.width - ScrollerFace.width);
var myMovingArea = ScrollerPane.width - PaneMask.width;
var moveTo = myMovingArea * precentage;

TweenLite.to(ScrollerPane,.6, { x:PaneMask.x-moveTo, ease:Regular.easeOut});
}

private function mouseMoveHandler(event:*)
{
updatePanePosition();
}


private function mouseWheelHandler(event:*)
{
var moveMent = MOUSE_WHEEL_PRECENTAGE * (PaneMask.x + PaneMask.width - ScrollerFace.width);

var newPos:int;

if (event.delta > 0)
newPos = Math.max(ScrollerFace.x - moveMent,PaneMask.x);
else
newPos = Math.min (ScrollerFace.x + moveMent,PaneMask.x + PaneMask.width - ScrollerFace.width);

TweenLite.to(ScrollerFace, .6, { x:newPos, ease:Regular.easeOut } );

var precentage = (newPos- PaneMask.x) / ( PaneMask.width - ScrollerFace.width);
var myMovingArea = ScrollerPane.width - PaneMask.width;
var moveTo = myMovingArea * precentage;
TweenLite.to(ScrollerPane,.6, { x:PaneMask.x-moveTo, ease:Regular.easeOut});
}


private function createMask(Pane,panelW, panelH):MovieClip
{
var cont:MovieClip = new MovieClip();
var color = Math.round(Math.random()*0x000);
cont.graphics.beginFill(color,1);
cont.graphics.drawRect(0,0,panelW,panelH);
cont.graphics.endFill();
return cont;
}

}


Gibt es evtl. eine bessere Alternative zu dieser um ein horizontale smooth scrollbar, skalierbar in die stage einzubauen?

Gruß Simon