2014-10-31 3 views
0

Я извиняюсь за продвинутый, если это немного сложно понять, но я сделаю все возможное, чтобы объяснить это.Прокрутка прокрутки прокрутки прокрутки до прокрутки контента - AS3

В основном я создал прокручиваемую страницу, которая позволяет иметь контент, который выходит за рамки сцены и прокручивать вверх или вниз, чтобы просмотреть его.

В данном случае мувиклип размером с стадию маскирует объект под ним (выше сцены) и прокручивание вверх/вниз влияет на положение объекта y, раскрывая его больше.

Часть, на которую я застрял, получает объект «прокрутка» на стороне, чтобы соответствовать положению верхней и нижней части объекта переполнения;

Поскольку полоса прокрутки должна оставаться на сцене, когда нижняя часть объекта достигнута, полоса прокрутки заканчивается тем, что она перемещается с той же скоростью, поэтому в этом случае полоса прокрутки должна двигайтесь медленнее, чтобы быть внизу, когда находится другой объект.

Как это закодировано сейчас я могу только показаться, чтобы соответствовать либо вершину с

scrollbar.y = (e.target.y - barY); 

противоположностью достигается

scrollbar.y = (e.target.y + barY); 

, но я не могу показаться, чтобы достичь обеих целей одновременно.

Я кодирую это в AS3 (flash CC), при этом мобильным устройством является моя желаемая платформа для публикации, и я добавлю свой код, а также некоторые скриншоты ниже.

var ease:int = 6; 
var targY:int = dragMe.y; 
var barY:int = scrollbar.y; 

var drag:Boolean = false; 
var pos:Number = 0; 

var minY:Number = 0 + dragMe.height/2; // how low the top can go 
var maxY:Number = stage.stageHeight - dragMe.height/2; // how high the bottom can go 

var barMax:Number = 0 + scrollbar.height; // how high the bar can go 
var barMin:Number = stage.stageHeight - scrollbar.height; // how low the bar can go 

dragMe.mask = mcMask; 
mcMask.visible = false; 

dragMe.addEventListener(Event.ENTER_FRAME, dragging); 
dragMe.addEventListener(MouseEvent.MOUSE_DOWN, mouseDown); 
stage.addEventListener(MouseEvent.MOUSE_UP, mouseUp); 

function dragging(e:Event):void { 
    if (drag) { 
     targY = mouseY + pos; 
    } 
    // restrict scrolling to stage 
    targY = Math.min(targY, minY); // how low the top can go 
    targY = Math.max(targY, maxY); // how high the bottom can go 

    barY = Math.min(barY, barMin); // how low the bar can go 
    barY = Math.max(barY, barMax); // how high the bar can go 

    // Movement of the text 
    e.target.y += (targY - e.currentTarget.y)/ease; 
    // Movement of the bar 
    scrollbar.y = (e.target.y - barY); 

} 

function mouseUp(e:MouseEvent):void { 
    drag = false; 
} 

function mouseDown(e:MouseEvent):void { 
    pos = e.currentTarget.y - mouseY; 
    drag = true; 
} 

Любая помощь будет очень оценили!

Серый = ступень Black = вне стадии

Хорошо: http://i.stack.imgur.com/qvAoz.png

Bad: http://i.stack.imgur.com/FvHIm.png

+0

Где вы установили высоту ScrollBar в? – BadFeelingAboutThis

+0

Полоса прокрутки уже находится на сцене, но ** barMin ** и ** barMax ** управляют тем, как высоко на сцене должна идти панель. Если события касания помещаются на планку, вы не можете перетащить его выше верхнего/нижнего уровня сцены – shaneparsons

ответ

0

Часть я застрял на это получаю "прокрутки" объект на сторона, соответствующая положению верхней и нижней части объекта переполнения;

Ну, нет необходимости, чтобы объект полосы прокрутки соответствовал положению объекта переполнения, вы должны привязать его к координатам объекта-маскиратора. Кстати, я обычно собираю все элементы пользовательского интерфейса прямо в среде IDE, а затем разбираю их. Например, если мне нужно добавить полосу прокрутки, мне нужны только три элемента:

  1. контейнер - все содержимое будет добавлено прямо в него;
  2. masker
  3. Прокрутка movieclip, состоящая из двух MC: bg и бара.

В этом случае мне не нужно размещать эти элементы в коде, а просто вызывать функцию для обработки этих элементов. Сам код достаточно прост.Вы знаете высоту маскира, высоту и положение контейнера, а также высоту фона полосы прокрутки и текущего положения панели. Все, что вам нужно, - это обработать события и соответствующим образом отреагировать.

E.g. в случае прокрутки с помощью полосы прокрутки, просто переведите текущие координаты панели и обновите позицию контейнера. Если вы перетаскиваете свой контент, обновите позицию своего бара соответствующим образом.

Кроме того, есть лучший способ перетащить панель:

private static function drag(e:MouseEvent):void 
{ 
    var myBounds:Rectangle = new Rectangle(bar.x, 0, 0, barBg.height-bar.height+8); 
    bar.startDrag(false, myBounds); 
    bar.addEventListener(Event.ENTER_FRAME, update); 
} 

static private function stopdrag(e:*):void 
    { 
     bar.stopDrag(); 
     update(null); 
     bar.removeEventListener(Event.ENTER_FRAME, update); 

    } 

    static private function update(e:Event):void 
    { 
     var scroll_run_length:Number = barBg.height - bar.height + 8; 
     var modificator:Number = (content.height-masker.height)/scroll_run_length; 
     content.y = startContY -(bar.y * modificator); 

    } 
Смежные вопросы