diff --git a/bi/base.css b/bi/base.css
index e30476362..8f015cc20 100644
--- a/bi/base.css
+++ b/bi/base.css
@@ -6,6 +6,9 @@
   -webkit-box-shadow: 0px 0px 2px 1px #d4dadd inset;
   -moz-box-shadow: 0px 0px 2px 1px #d4dadd inset;
 }
+.bi-color-chooser-trigger .color-chooser-trigger-content.none-color {
+  background-image: url('data:image/svg+xml;utf8,<svg xmlns= "http://www.w3.org/2000/svg" width= "100%" height= "100%" ><line x1= "100%" y1= "0" x2= "0" y2= "100%" stroke= "#f07d0a" stroke-width= "2" /></svg>');
+}
 .bi-color-picker-button .color-picker-button-mask {
   border: 1px solid #1a1a1a;
 }
diff --git a/bi/case.js b/bi/case.js
index f32acbb04..d6234e665 100644
--- a/bi/case.js
+++ b/bi/case.js
@@ -3949,7 +3949,7 @@ BI.ColorChooserTrigger = BI.inherit(BI.Trigger, {
         BI.ColorChooserTrigger.superclass._init.apply(this, arguments);
         this.colorContainer = BI.createWidget({
             type: "bi.layout",
-            cls: "bi-card"
+            cls: "bi-card color-chooser-trigger-content"
         });
 
         var down = BI.createWidget({
@@ -3982,7 +3982,11 @@ BI.ColorChooserTrigger = BI.inherit(BI.Trigger, {
 
     setValue: function (color) {
         BI.ColorChooserTrigger.superclass.setValue.apply(this, arguments);
-        this.colorContainer.element.css("background-color", color);
+        if (color === "") {
+            this.colorContainer.element.css("background-color", "").addClass("none-color")
+        } else {
+            this.colorContainer.element.css({"background-color": color}).removeClass("none-color");
+        }
     }
 });
 BI.ColorChooserTrigger.EVENT_CHANGE = "ColorChooserTrigger.EVENT_CHANGE";
diff --git a/bi/widget.js b/bi/widget.js
index d0803edfb..f39e8eade 100644
--- a/bi/widget.js
+++ b/bi/widget.js
@@ -983,9 +983,9 @@ BI.Arrangement = BI.inherit(BI.Widget, {
             case BI.Arrangement.LAYOUT_TYPE.FREE:
                 return true;
             case BI.Arrangement.LAYOUT_TYPE.GRID:
-                // if (this._isRegionOverlay()) {
-                //     return false;
-                // }
+                if (this._isRegionOverlay()) {
+                    return false;
+                }
         }
         return true;
     },
@@ -1416,9 +1416,10 @@ BI.Arrangement = BI.inherit(BI.Widget, {
     },
 
     _start: function () {
-        this.arrangement.setVisible(true);
         if (this.options.layoutType === BI.Arrangement.LAYOUT_TYPE.GRID) {
             this.block.setVisible(true);
+        } else {
+            this.arrangement.setVisible(true);
         }
     },
 
diff --git a/docs/base.css b/docs/base.css
index e30476362..8f015cc20 100644
--- a/docs/base.css
+++ b/docs/base.css
@@ -6,6 +6,9 @@
   -webkit-box-shadow: 0px 0px 2px 1px #d4dadd inset;
   -moz-box-shadow: 0px 0px 2px 1px #d4dadd inset;
 }
+.bi-color-chooser-trigger .color-chooser-trigger-content.none-color {
+  background-image: url('data:image/svg+xml;utf8,<svg xmlns= "http://www.w3.org/2000/svg" width= "100%" height= "100%" ><line x1= "100%" y1= "0" x2= "0" y2= "100%" stroke= "#f07d0a" stroke-width= "2" /></svg>');
+}
 .bi-color-picker-button .color-picker-button-mask {
   border: 1px solid #1a1a1a;
 }
diff --git a/docs/case.js b/docs/case.js
index f32acbb04..d6234e665 100644
--- a/docs/case.js
+++ b/docs/case.js
@@ -3949,7 +3949,7 @@ BI.ColorChooserTrigger = BI.inherit(BI.Trigger, {
         BI.ColorChooserTrigger.superclass._init.apply(this, arguments);
         this.colorContainer = BI.createWidget({
             type: "bi.layout",
-            cls: "bi-card"
+            cls: "bi-card color-chooser-trigger-content"
         });
 
         var down = BI.createWidget({
@@ -3982,7 +3982,11 @@ BI.ColorChooserTrigger = BI.inherit(BI.Trigger, {
 
     setValue: function (color) {
         BI.ColorChooserTrigger.superclass.setValue.apply(this, arguments);
-        this.colorContainer.element.css("background-color", color);
+        if (color === "") {
+            this.colorContainer.element.css("background-color", "").addClass("none-color")
+        } else {
+            this.colorContainer.element.css({"background-color": color}).removeClass("none-color");
+        }
     }
 });
 BI.ColorChooserTrigger.EVENT_CHANGE = "ColorChooserTrigger.EVENT_CHANGE";
diff --git a/docs/widget.js b/docs/widget.js
index d0803edfb..f39e8eade 100644
--- a/docs/widget.js
+++ b/docs/widget.js
@@ -983,9 +983,9 @@ BI.Arrangement = BI.inherit(BI.Widget, {
             case BI.Arrangement.LAYOUT_TYPE.FREE:
                 return true;
             case BI.Arrangement.LAYOUT_TYPE.GRID:
-                // if (this._isRegionOverlay()) {
-                //     return false;
-                // }
+                if (this._isRegionOverlay()) {
+                    return false;
+                }
         }
         return true;
     },
@@ -1416,9 +1416,10 @@ BI.Arrangement = BI.inherit(BI.Widget, {
     },
 
     _start: function () {
-        this.arrangement.setVisible(true);
         if (this.options.layoutType === BI.Arrangement.LAYOUT_TYPE.GRID) {
             this.block.setVisible(true);
+        } else {
+            this.arrangement.setVisible(true);
         }
     },
 
diff --git a/src/case/colorchooser/colorchooser.trigger.js b/src/case/colorchooser/colorchooser.trigger.js
index 93e1c3583..4b61bd908 100644
--- a/src/case/colorchooser/colorchooser.trigger.js
+++ b/src/case/colorchooser/colorchooser.trigger.js
@@ -19,7 +19,7 @@ BI.ColorChooserTrigger = BI.inherit(BI.Trigger, {
         BI.ColorChooserTrigger.superclass._init.apply(this, arguments);
         this.colorContainer = BI.createWidget({
             type: "bi.layout",
-            cls: "bi-card"
+            cls: "bi-card color-chooser-trigger-content"
         });
 
         var down = BI.createWidget({
@@ -52,7 +52,11 @@ BI.ColorChooserTrigger = BI.inherit(BI.Trigger, {
 
     setValue: function (color) {
         BI.ColorChooserTrigger.superclass.setValue.apply(this, arguments);
-        this.colorContainer.element.css("background-color", color);
+        if (color === "") {
+            this.colorContainer.element.css("background-color", "").addClass("none-color")
+        } else {
+            this.colorContainer.element.css({"background-color": color}).removeClass("none-color");
+        }
     }
 });
 BI.ColorChooserTrigger.EVENT_CHANGE = "ColorChooserTrigger.EVENT_CHANGE";
diff --git a/src/css/base/colorchooser/colorchooser.trigger.css b/src/css/base/colorchooser/colorchooser.trigger.css
index 7e07cb515..9b56fc3ce 100644
--- a/src/css/base/colorchooser/colorchooser.trigger.css
+++ b/src/css/base/colorchooser/colorchooser.trigger.css
@@ -6,3 +6,6 @@
   -webkit-box-shadow: 0px 0px 2px 1px #d4dadd inset;
   -moz-box-shadow: 0px 0px 2px 1px #d4dadd inset;
 }
+.bi-color-chooser-trigger .color-chooser-trigger-content.none-color {
+  background-image: url('data:image/svg+xml;utf8,<svg xmlns= "http://www.w3.org/2000/svg" width= "100%" height= "100%" ><line x1= "100%" y1= "0" x2= "0" y2= "100%" stroke= "#f07d0a" stroke-width= "2" /></svg>');
+}
diff --git a/src/less/base/colorchooser/colorchooser.trigger.less b/src/less/base/colorchooser/colorchooser.trigger.less
index 7823f5ee0..45a74746e 100644
--- a/src/less/base/colorchooser/colorchooser.trigger.less
+++ b/src/less/base/colorchooser/colorchooser.trigger.less
@@ -1,6 +1,11 @@
 @import "../../bibase";
 
-.bi-color-chooser-trigger{
+.bi-color-chooser-trigger {
+  & .color-chooser-trigger-content {
+    &.none-color {
+      background-image: url('data:image/svg+xml;utf8,<svg xmlns= "http://www.w3.org/2000/svg" width= "100%" height= "100%" ><line x1= "100%" y1= "0" x2= "0" y2= "100%" stroke= "#f07d0a" stroke-width= "2" /></svg>')
+    }
+  }
   .border-radius(2px);
-  .box-shadow(0px,0px,2px,1px, @color-bi-background-dark, inset);
+  .box-shadow(0px, 0px, 2px, 1px, @color-bi-background-dark, inset);
 }
\ No newline at end of file
diff --git a/src/widget/arrangement/arrangement.js b/src/widget/arrangement/arrangement.js
index e61c66df3..2a3b271bc 100644
--- a/src/widget/arrangement/arrangement.js
+++ b/src/widget/arrangement/arrangement.js
@@ -189,9 +189,9 @@ BI.Arrangement = BI.inherit(BI.Widget, {
             case BI.Arrangement.LAYOUT_TYPE.FREE:
                 return true;
             case BI.Arrangement.LAYOUT_TYPE.GRID:
-                // if (this._isRegionOverlay()) {
-                //     return false;
-                // }
+                if (this._isRegionOverlay()) {
+                    return false;
+                }
         }
         return true;
     },
@@ -622,9 +622,10 @@ BI.Arrangement = BI.inherit(BI.Widget, {
     },
 
     _start: function () {
-        this.arrangement.setVisible(true);
         if (this.options.layoutType === BI.Arrangement.LAYOUT_TYPE.GRID) {
             this.block.setVisible(true);
+        } else {
+            this.arrangement.setVisible(true);
         }
     },