Skip to main content
Inspiring
April 23, 2015
Question

help with sub movieclips appear/disappear

  • April 23, 2015
  • 1 reply
  • 429 views

Hey folks, looking for some early feedback. So in a large movieclip that I drag, I have sub movieclips. Due to them being large they cause the drag/flick/scroll get clunky at times. So I thought about dynamically loading them depending on where the main movieclip is based on a Y state. So this seems to work BUT before I go down this long road, there has to be a better way do this. I've bolded the way I'm planning to go about it.

function mouseDownHandler(event: MouseEvent): void {

  TweenLite.killTweensOf(main);

  y1 = y2 = main.y;

  yOffset = this.mouseY - main.y;

  yOverlap = Math.max(0, main.height - bounds.height);

  t1 = t2 = getTimer();

  main.stage.addEventListener(MouseEvent.MOUSE_MOVE, mouseMoveHandler);

  main.stage.addEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);

}

function mouseMoveHandler(event: MouseEvent): void {

  var y: Number = this.mouseY - yOffset;

  //if main's position exceeds the bounds, make it drag only half as far with each mouse movement (like iPhone/iPad behavior)

  if (y > bounds.top) {

  main.y = (y + bounds.top) * 0.5;

  } else if (y < bounds.top - yOverlap) {

  main.y = (y + bounds.top - yOverlap) * 0.5;

  } else {

  main.y = y;

  }

  blitMask.update();

  var t: uint = getTimer();

  //if the frame rate is too high, we won't be able to track the velocity as well, so only update the values 20 times per second

  if (t - t2 > 50) {

  y2 = y1;

  t2 = t1;

  y1 = main.y;

  t1 = t;

  }

  event.updateAfterEvent();

  if (main.y < 30) {

  main.OFbandTWO.visible = true;

  } else if (main.y < 20) {

  main.OFbandTWO.visible = true;

  main.OFbandTHREE.visible = true;

  } else if (main.y < 0) {

  main.OFbandTWO.visible = true;

  main.OFbandTHREE.visible = true;

  main.OFbandFOUR.visible = true;

  } else {

  main.OFbandTWO.visible = false;

  main.OFbandTHREE.visible = false;

  main.OFbandFOUR.visible = false;

  }

}

function mouseUpHandler(event: MouseEvent): void {

  blitMask.bitmapMode = true;

  main.stage.removeEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);

  main.stage.removeEventListener(MouseEvent.MOUSE_MOVE, mouseMoveHandler);

  var time: Number = (getTimer() - t2) / 1000;

  var yVelocity: Number = (main.y - y2) / time;

  ThrowPropsPlugin.to(main, {

  throwProps: {

  y: {

  velocity: yVelocity,

  max: bounds.top,

  min: bounds.top - yOverlap,

  resistance: 50

  }

  },

  onUpdate: blitMask.update,

  ease: Strong.easeOut

  }, 2, 0.3, 0.5);

  blitMask.bitmapMode = false;

}

This topic has been closed for replies.

1 reply

kglad
Community Expert
April 23, 2015
main.OFbandTWO.visible = false;

  main.OFbandTHREE.visible = false;

  main.OFbandFOUR.visible = false;

 

  if (main.y < 30) {

  main.OFbandTWO.visible = true;

  }

  if (main.y < 20) {

  main.OFbandTHREE.visible = true;

  }

   if (main.y < 0) {

  main.OFbandFOUR.visible = true;

  }

Inspiring
April 24, 2015

thanks for the response kglad. now I've got 20 of these bands. So by making them not visible it should kick the smoothness into gear. But if I have 20 "if" statements in the mouse move state (which is for the dragging), will this cause any issues with smoothness as it's computing the drag AND these functions?

Inspiring
April 24, 2015

also if I want to have the item only appear when it's on the stage and be not visible when off it, I figured i'd use a set of y coordinates that when it's between them, change vis to true, when not, change vis to false. But the logic is escaping me. So if I want band "two" only visible when on the stage, would this work?

  if (main.y < 30 || main.y > -400) {

  main.OFbandTWO.visible = true;

  }