Note: Chrome does not allow this to run locally. I have not optimized the code for Chrome in this respect.
Tested and works with: Firefox, Safari
Link to Demo: https://www.dropbox.com/s/5w23sewbueak41t/scaling_v1r4.zip
I have modified the cocos2d-html5 library to support a psuedo-alias parameter.
[CCSprite Left: No Scaling] [CCSprite Right: x8 Psuedo-Alias Scaling]
Both CCSprites at setScale(1)
===================================
Both CCSprites at setScale(8)
===================================
Brief Explanation
* Images in resource.js
can be given a scale
parameter
e.g.
Default:
{type:"image", src:"res/myImage.png"}
With Pseudo-Alias Scaling:
{type:"image", src:"res/myImage.png", scale:"8"}
Detailed Explanation
When cocos2d launches the resources are preloaded. In the CCLoader.js
in the method preload()
if an image has the property βscaleβ (e.g. {type:"image", src:"res/myImage.png", scale:"8"}
) then it is sent to the instance of CCTextureCache()
in the (new) function called addImageAndScale()
. This is a modified version of addImage()
with functionality similar to addImageAsync()
. addImageAndScale()
loads the original image then after the original image has loaded it up-scales the image and sets the texture to the new scaled image and sets the size manually. (This is necessary for the first run of the code since it will normally register as 0 width and 0 height) CCSprite.js
is given a variable _pixelScalarModifier
which defaults to 1. If the the texture has been scaled then CCSprite._pixelScalarModifier
is modified to the value of the scale. CCNode.js
βs scaling methods (getScale(),setScale(),getScaleX(),setScaleX(),getScaleY(),setScaleY()
) are modified to make the node by default, the size of the original image.
Therefore, the image can be scaled larger and still retain a nearest-neighbor like appeareance.