fix fireball/issues/7969 (cocos#3010)

* fix fireball/issues/7969 * add test color
987690183 · Jul 24, 2018 · d6ea17f · d6ea17f
1 parent c4593dd
commit d6ea17f
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 8 deletions.
diff --git a/cocos2d/core/renderer/canvas/canvas-render-walker.js b/cocos2d/core/renderer/canvas/canvas-render-walker.js
@@ -56,14 +56,13 @@ RenderComponentWalker.prototype = {
     visit (scene) {
         let ctx = this._device._ctx;
         let canvas = this._device._canvas;
-        let background = cc.Camera.main.backgroundColor;
-        ctx.fillStyle = 'rgba(' + background.r + ', ' + background.g + ', ' + background.b + ', ' + background.a + ')';
+        ctx.fillStyle = cc.Camera.main.backgroundColor.toHEX("#rrggbbaa");
         ctx.setTransform(1, 0, 0, 1, 0, 0);
         ctx.fillRect(0, 0, canvas.width, canvas.height);
         this._device._stats.drawcalls = 0;
 
         RenderFlow.render(scene);
     }
-}
+};
 
 module.exports = RenderComponentWalker;
diff --git a/cocos2d/core/value-types/color.js b/cocos2d/core/value-types/color.js
@@ -396,7 +396,7 @@ var Color = (function () {
      * e.g.  cc.color(255,6,255)  to : "#ff06ff"
      * !#zh 转换为 16 进制。
      * @method toHEX
-     * @param {String} fmt - "#rgb" or "#rrggbb".
+     * @param {String} fmt - "#rgb", "#rrggbb" or "#rrggbbaa".
      * @return {String}
      * @example
      * var color = cc.Color.BLACK;
@@ -407,7 +407,7 @@ var Color = (function () {
         var hex = [
             (this.r | 0 ).toString(16),
             (this.g | 0 ).toString(16),
-            (this.b | 0 ).toString(16),
+            (this.b | 0 ).toString(16)
         ];
         var i = -1;
         if ( fmt === '#rgb' ) {
@@ -424,6 +424,14 @@ var Color = (function () {
                 }
             }
         }
+        else if ( fmt === '#rrggbbaa' ) {
+            hex.push((this.a | 0 ).toString(16));
+            for ( i = 0; i < hex.length; ++i ) {
+                if ( hex[i].length === 1 ) {
+                    hex[i] = '0' + hex[i];
+                }
+            }
+        }
         return hex.join('');
     };
 

diff --git a/test/qunit/unit-es5/test-color.js b/test/qunit/unit-es5/test-color.js
@@ -2,16 +2,20 @@ module('color');
 
 test('basic test', function() {
     var testColor = new cc.Color( 255, 255, 0, 127.5 );
+    equal ( testColor.toHEX('#rrggbbaa'), "ffff007f", "The value must be ffff007f" );
     equal ( testColor.toHEX('#rrggbb'), "ffff00", "The value must be ffff00" );
     equal ( testColor.toHEX('#rgb'), "ff0", "The value must be ff0" );
+    equal ( testColor.toCSS('#rrggbbaa'), "#ffff007f", "The value must be ffff007f" );
     equal ( testColor.toCSS('#rrggbb'), "#ffff00", "The value must be #ffff00" );
     equal ( testColor.toCSS('#rgb'), "#ff0", "The value must be #ff0" );
 
     testColor = new cc.Color( 0.3 * 255, 255, 0, 127.5 );
-    equal ( testColor.toHEX('#rrggbb'), "4cff00", "The value must be ffff00" );
+    equal ( testColor.toHEX('#rrggbbaa'), "4cff007f", "The value must be 4cff007f" );
+    equal ( testColor.toHEX('#rrggbb'), "4cff00", "The value must be 4cff00" );
     equal ( testColor.toHEX('#rgb'), "4f0", "The value must be ff0" );
-    equal ( testColor.toCSS('#rrggbb'), "#4cff00", "The value must be #ffff00" );
-    equal ( testColor.toCSS('#rgb'), "#4f0", "The value must be #ff0" );
+    equal ( testColor.toCSS('#rrggbbaa'), "#4cff007f", "The value must be #4cff007f" );
+    equal ( testColor.toCSS('#rrggbb'), "#4cff00", "The value must be #4cff00" );
+    equal ( testColor.toCSS('#rgb'), "#4f0", "The value must be #4f0" );
 
     testColor = new cc.Color( 255, 0, 0, 255 );
     deepEqual ( testColor.toHSV(), { h: 0, s: 1, v: 1 }, "The value must be { h:0, s:1, v:1 }" );