Merge pull request #2454 from musikov/develop

Scale9Sprite size, RenderTexture size, colorized progress timer fix on canvas renderer

Author: dingpinglv

cocos2d/core/renderer/RendererCanvas.js

@@ -54,15 +54,19 @@ if (cc._renderType === cc._RENDER_TYPE_CANVAS) {
          * drawing all renderer command to cache canvas' context
          * @param {CanvasRenderingContext2D} ctx
          * @param {Number} [instanceID]
+         * @param {Number} [scaleX]
+         * @param {Number} [scaleY]
          */
-        _renderingToCacheCanvas: function (ctx, instanceID) {
+        _renderingToCacheCanvas: function (ctx, instanceID, scaleX, scaleY) {
             if (!ctx)
                 cc.log("The context of RenderTexture is invalid.");
 
+            scaleX = cc.isUndefined(scaleX) ? 1 : scaleX;
+            scaleY = cc.isUndefined(scaleY) ? 1 : scaleY;
             instanceID = instanceID || this._currentID;
             var locCmds = this._cacheToCanvasCmds[instanceID], i, len;
             for (i = 0, len = locCmds.length; i < len; i++) {
-                locCmds[i].rendering(ctx, 1, 1);
+                locCmds[i].rendering(ctx, scaleX, scaleY);
             }
             locCmds.length = 0;
             var locIDs = this._cacheInstanceIds;
@@ -530,15 +534,27 @@ if (cc._renderType === cc._RENDER_TYPE_CANVAS) {
 
         //draw sprite
         var image = locSprite._texture.getHtmlElementObj();
-        context.drawImage(image,
-            locTextureCoord.renderX,
-            locTextureCoord.renderY,
-            locTextureCoord.width,
-            locTextureCoord.height,
-            flipXOffset, flipYOffset,
-            locDrawSizeCanvas.width,
-            locDrawSizeCanvas.height
-        );
+        if (locSprite._colorized) {
+            context.drawImage(image,
+                0,
+                0,
+                locTextureCoord.width,
+                locTextureCoord.height,
+                flipXOffset, flipYOffset,
+                locDrawSizeCanvas.width,
+                locDrawSizeCanvas.height
+            );
+        } else {
+            context.drawImage(image,
+                locTextureCoord.renderX,
+                locTextureCoord.renderY,
+                locTextureCoord.width,
+                locTextureCoord.height,
+                flipXOffset, flipYOffset,
+                locDrawSizeCanvas.width,
+                locDrawSizeCanvas.height
+            );
+        }
 
         context.restore();
         cc.g_NumberOfDraws++;

cocos2d/render-texture/CCRenderTexture.js

@@ -495,7 +495,8 @@ cc.RenderTexture = cc.Node.extend(/** @lends cc.RenderTexture# */{
         //cc._renderContext = cc._mainRenderContextBackup;
         //cc.view._resetScale();
 
-        cc.renderer._renderingToCacheCanvas(this._cacheContext, this.__instanceId);
+        var scale = cc.contentScaleFactor();
+        cc.renderer._renderingToCacheCanvas(this._cacheContext, this.__instanceId, scale, scale);
 
         //TODO
         /*//restore viewport

extensions/ccui/base-classes/UIScale9Sprite.js

@@ -203,12 +203,17 @@ ccui.Scale9Sprite = cc.Node.extend(/** @lends ccui.Scale9Sprite# */{
     _cacheScale9Sprite: function(){
         if(!this._scale9Image)
             return;
-        var size = this._contentSize, locCanvas = this._cacheCanvas;
+
+        var locScaleFactor = cc.contentScaleFactor();
+        var size = this._contentSize;
+        var sizeInPixels = cc.size(size.width * locScaleFactor, size.height * locScaleFactor);
+
+        var locCanvas = this._cacheCanvas;
         var contentSizeChanged = false;
-        if(locCanvas.width != size.width || locCanvas.height != size.height){
-            locCanvas.width = size.width;
-            locCanvas.height = size.height;
-            this._cacheContext.translate(0, size.height);
+        if(locCanvas.width != sizeInPixels.width || locCanvas.height != sizeInPixels.height){
+            locCanvas.width = sizeInPixels.width;
+            locCanvas.height = sizeInPixels.height;
+            this._cacheContext.translate(0, sizeInPixels.height);
             contentSizeChanged = true;
         }
 
@@ -217,8 +222,8 @@ ccui.Scale9Sprite = cc.Node.extend(/** @lends ccui.Scale9Sprite# */{
         this._scale9Image.visit();
 
         //draw to cache canvas
-        this._cacheContext.clearRect(0, 0, size.width, -size.height);
-        cc.renderer._renderingToCacheCanvas(this._cacheContext, this.__instanceId);
+        this._cacheContext.clearRect(0, 0, sizeInPixels.width, -sizeInPixels.height);
+        cc.renderer._renderingToCacheCanvas(this._cacheContext, this.__instanceId, locScaleFactor, locScaleFactor);
 
         if(contentSizeChanged)
             this._cacheSprite.setTextureRect(cc.rect(0,0, size.width, size.height));

extensions/gui/control-extension/CCScale9Sprite.js

@@ -218,7 +218,7 @@ cc.Scale9Sprite = cc.Node.extend(/** @lends cc.Scale9Sprite# */{
 
         //draw to cache canvas
         this._cacheContext.clearRect(0, 0, sizeInPixels.width, -sizeInPixels.height);
-        cc.renderer._renderingToCacheCanvas(this._cacheContext, this.__instanceId);
+        cc.renderer._renderingToCacheCanvas(this._cacheContext, this.__instanceId, locScaleFactor, locScaleFactor);
 
         if(contentSizeChanged)
             this._cacheSprite.setTextureRect(cc.rect(0,0, size.width, size.height));