Usage of CreateJS in Adobe Animate CC for adding image on Canvas


#1

I would like to ask community how to implement addChild function in HTML5 Canvas type in Animate CC.
Here is a very simple scenario:
On the Canvas there are a MovieClip container (by name “imageContainer”) and button (by name “getContent_btn”). The code listed below doesn’t work?

Here is defined functions for image loading using CreateJS

function loadImage() {
  var preload = new createjs.LoadQueue();
  preload.addEventListener("fileload", handleFileComplete);
  preload.loadFile("someimage.png");
}

function handleFileComplete(event) {
	this.imageContainer.addChild(event.result);
}

And here is button function and listener

this.getContent_btn.addEventListener("click", fl_MouseClickHandler.bind(this));

function fl_MouseClickHandler()
{
   loadImage();
}

Thanks in advance!


#2

I found solution in other forum.


#3

What was it?


#4

Looks like the solution was from here:
https://forums.adobe.com/thread/2409963


#5

Yes, prg9 is right.
I found solution in adobe forum but i will place it here:

var this_var = this;
var preload = new createjs.LoadQueue();

function loadImage() {
preload.addEventListener(“fileload”, handleFileComplete);
preload.loadFile({
src: “someimage”,
id: ‘someid’
});
}

function handleFileComplete(event) {
var someid = preload.getResult(“someid”);
var bmp = new createjs.Bitmap(someid);
this_var.container.addChild(bmp);
}

this.getContent_btn.addEventListener(“click”, fl_MouseClickHandler.bind(this));

function fl_MouseClickHandler() {
loadImage();
}

But there is one more detail here. I found that it is possible to use exportRoot instead of this_var.
So this_var.container.addChild(bmp); goes into exportRoot.container.addChild(bmp);

By the way
in respect to You Senocular