This method performs the transition given the two snap shots.
function doTransition()
{
var box = scene.getBoxById("myImageBox");
if (box)
{
var snapshot1 = box.createSnapshot(false); // grab what's on the screen as our 1st snapshot
box.attachSourceSnapshot(snapshot1); // This box will now draw on-screen from the snapshot
var snapshot2 = box.createSnapshot(true); // create a blank snapshot object
box.attachTargetSnapshot(snapshot2); // now we are going to be drawing INTO the 2nd snapshot
// Update the box (which draws into the target snapshot - not the screen)
box.src = "../content/image/img2.png";
box.renderTargetSnapshot();
if (snapshot1 && snapshot2)
{
var transition = box.createTransition();
if (transition)
{
// Do the transition
transition.type = "slideCoverLeft";
transition.duration = 400;
transition.dynamicsType = "spring";
transition.perform(snapshot1, snapshot2);
}
}
// remove our attached snapshots
box.detachSourceSnapshot();
box.detachTargetSnapshot();
}
}