Masking
Janne

Is there any way to mask objects? I have plan to make scrollable textarea that show content in masked box , then user can scroll text to see more.

Or is there any other way to make large textareas to scroll? Thanks.

All 3 Comments
Gio

Hi

Off the top of my head, the easiest thing you could do would be using drawToImage() to draw your (text) sprite to an image that can only contain part of it.

You would first draw an empty sprite to the image, with the "replace" flag (the second argument) set to true:

var empty = new Sprite();
empty.setDrawFunction(wade.doNothing);
empty.setSize(200, 200);
empty.drawToImage('myImage', true);

Basically this creates an empty image that is 200x200 in size, and is called myImage.

You would then draw your text sprite (or whatever you like) into it, with the second parameter set to "false" and with the 3rd parameter specifying the offset:

var offset = {x:0, y:-55};
mySprite.drawToImage('myImage', false, offset);

By doing this, you are effectively creating a masked version of your sprite. You can then create a new sprite that uses this image, and put it in the scene:

var s = new Sprite('myImage', layerId);
var obj = new SceneObject(s);
wade.addSceneObject(obj);

Of course you could do this in the editor too, no need to create the new sprite and scene object in code. The point is, the sprite that is in the scene uses 'myImage' as a source. Whenever you change 'myImage' by writing to it, the sprite that is in the scene should auto-update to display the new image.

In your case, when the user scrolls, you would change the offset and repeat the process of creating an empty image and drawing the text sprite into it.

I hope this makes sense :)

Janne

Thanks for reply, I try that :) Have to say, this Wade Engine is GREAT! :)

Janne

Hi, thanks a lot :) That do the trick!

Post a reply
Add Attachment
Submit Reply
Login to Reply