Exit
  • Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
  • 한국 커뮤니티
0

Draggable mask in Canvas easljs

Community Beginner ,
Oct 09, 2017 Oct 09, 2017

I want to make a draggable mask inside Animate CC Canvas.

box is a movieClip that contains a vector black square.

bg is a movieClip that contains a bitmap that i want to apply the box as a mask to and drag around.

Both display on screen, but the dragBox is only draggable, but it won't mask the backgroundImage. What am I missing here?

var backgroundImage = new lib.bg();
backgroundImage.x = backgroundImage.y = 0;
stage.addChild(backgroundImage);

var dragBox = new lib.box();
dragBox.x = dragBox.y = 0;
stage.addChild(dragBox); 

backgroundImage.mask = dragBox;
stage.update(); 

dragBox.addEventListener("pressmove", dragMe.bind(this));
function dragMe(evt) {
  this.addChild(evt.currentTarget);
  var p = this.globalToLocal(evt.stageX, evt.stageY);
  evt.currentTarget.x = p.x;
  evt.currentTarget.y = p.y;
}

204
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
no replies

Have something to add?

Join the conversation