布局

src/core/wrapper/layout/adapt/adapt.table.js

@@ -4,9 +4,9 @@
  * @extends BI.Layout
  */
 BI.TableAdaptLayout = BI.inherit(BI.Layout, {
-    props: function (props) {
+    props: function () {
         return BI.extend(BI.TableAdaptLayout.superclass.props.apply(this, arguments), {
-            baseCls: "bi-t-a" + (props.verticalAlign === BI.VerticalAlign.Stretch ? " bi-h-fill" : ""),
+            baseCls: "bi-t-a",
             columnSize: [],
             verticalAlign: BI.VerticalAlign.Top,
             horizontalAlign: BI.HorizontalAlign.Left,
@@ -57,7 +57,9 @@ BI.TableAdaptLayout = BI.inherit(BI.Layout, {
             var w = BI._lazyCreateWidget(item);
             w.element.css({position: "relative", top: "0", left: "0", margin: "0px auto"});
             if (o.verticalAlign === BI.VerticalAlign.Stretch) {
-                w.element.addClass("h-fill-item");
+                var top = o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0),
+                    bottom = o.vgap + o.bgap + (item.bgap || 0) + (item.vgap || 0);
+                w.element.css("height", "calc(100% - " + ((top + bottom) / BI.pixRatio + BI.pixUnit) + ")");
             }
             td = BI._lazyCreateWidget({
                 type: "bi.default",

src/core/wrapper/layout/fill/float.fill.horizontal.js

@@ -1,7 +1,7 @@
 BI.FloatHorizontalFillLayout = BI.inherit(BI.Layout, {
     props: function () {
         return BI.extend(BI.FloatHorizontalFillLayout.superclass.props.apply(this, arguments), {
-            baseCls: "bi-h-float-fill bi-h-fill",
+            baseCls: "bi-h-float-fill",
             horizontalAlign: BI.HorizontalAlign.Stretch,
             verticalAlign: BI.VerticalAlign.Stretch,
             hgap: 0,
@@ -77,6 +77,12 @@ BI.FloatHorizontalFillLayout = BI.inherit(BI.Layout, {
                     "margin-bottom": (o.vgap + o.bgap + (item.bgap || 0) + (item.vgap || 0)) / BI.pixRatio + BI.pixUnit
                 });
             }
+            var top = o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0),
+                bottom = o.vgap + o.bgap + (item.bgap || 0) + (item.vgap || 0);
+            w.element.css({
+                height: "calc(100% - " + ((top + bottom) / BI.pixRatio + BI.pixUnit) + ")",
+                position: "relative"
+            });
             return w;
         }
 
@@ -90,10 +96,8 @@ BI.FloatHorizontalFillLayout = BI.inherit(BI.Layout, {
             }
             var w = createWidget(i, item);
             self.addWidget(self._getChildName(rank++), w);
-            w.element.addClass("h-fill-item");
             w.element.css({
-                float: "left",
+                float: "left"
-                position: "relative"
             });
         });
         BI.backAny(items, function (i, item) {
@@ -106,10 +110,8 @@ BI.FloatHorizontalFillLayout = BI.inherit(BI.Layout, {
             }
             var w = createWidget(i, item, true);
             self.addWidget(self._getChildName(rank++), w);
-            w.element.addClass("h-fill-item");
             w.element.css({
-                float: "right",
+                float: "right"
-                position: "relative"
             });
         });
         BI.each(items, function (i, item) {
@@ -117,9 +119,6 @@ BI.FloatHorizontalFillLayout = BI.inherit(BI.Layout, {
             if (columnSize === "fill") {
                 var w = createWidget(i, item);
                 self.addWidget(self._getChildName(rank++), w);
-                w.element.addClass("h-fill-item").css({
-                    position: "relative"
-                });
             }
         });
     },

src/core/wrapper/layout/flex/flex.leftrightvertical.center.js

@@ -57,7 +57,9 @@ BI.FlexLeftRightVerticalAdaptLayout = BI.inherit(BI.Layout, {
         return leftItems.concat({
             el: {
                 type: "bi.flex_vertical_adapt",
-                cls: "flex-left-auto",
+                css: {
+                    "margin-left": "auto"
+                },
                 hgap: o.rhgap,
                 vgap: o.rvgap,
                 lgap: o.rlgap,

src/core/wrapper/layout/layout.inline.js

@@ -52,13 +52,13 @@ BI.InlineLayout = BI.inherit(BI.Layout, {
         });
         w.element.addClass("i-item");
         if (columnSize === "fill" || columnSize === "") {
-            var left = o.hgap + (item.lgap || 0) + (item.hgap || 0),
+            var left = o.hgap + o.lgap + (item.lgap || 0) + (item.hgap || 0),
-                right = o.hgap + (item.rgap || 0) + (item.hgap || 0);
+                right = o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0);
             for (var k = 0; k < i; k++) {
-                left += o.hgap + o.lgap + o.rgap + (o.columnSize[k] || o.items[k].width);
+                left += o.hgap + o.lgap + o.rgap + (o.items[k].lgap || 0) + (o.items[k].rgap || 0) + (o.items[k].hgap || 0) + (o.columnSize[k] || o.items[k].width);
             }
             for (var k = i + 1, len = o.columnSize.length || o.items.length; k < len; k++) {
-                right += o.hgap + o.lgap + o.rgap + (o.columnSize[k] || o.items[k].width);
+                right += o.hgap + o.lgap + o.rgap + (o.items[k].lgap || 0) + (o.items[k].rgap || 0) + (o.items[k].hgap || 0) + (o.columnSize[k] || o.items[k].width);
             }
             if (columnSize === "fill") {
                 w.element.css("min-width", "calc(100% - " + ((left + right) / BI.pixRatio + BI.pixUnit) + ")");
@@ -68,8 +68,8 @@ BI.InlineLayout = BI.inherit(BI.Layout, {
             }
         }
         if (o.verticalAlign === BI.VerticalAlign.Stretch) {
-            var top = o.vgap + (item.tgap || 0) + (item.vgap || 0),
+            var top = o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0),
-                bottom = o.vgap + (item.bgap || 0) + (item.vgap || 0);
+                bottom = o.vgap + o.bgap + (item.bgap || 0) + (item.vgap || 0);
             w.element.css("height", "calc(100% - " + ((top + bottom) / BI.pixRatio + BI.pixUnit) + ")");
         }
         if (o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0) !== 0) {

src/core/wrapper/layout/layout.td.js

@@ -4,9 +4,9 @@
  * @extends BI.Layout
  */
 BI.TdLayout = BI.inherit(BI.Layout, {
-    props: function (props) {
+    props: function () {
         return BI.extend(BI.TdLayout.superclass.props.apply(this, arguments), {
-            baseCls: "bi-td" + (props.verticalAlign === BI.VerticalAlign.Stretch ? " bi-h-fill" : ""),
+            baseCls: "bi-td",
             columnSize: [],
             rowSize: [],
             verticalAlign: BI.VerticalAlign.Middle,
@@ -90,7 +90,9 @@ BI.TdLayout = BI.inherit(BI.Layout, {
         for (var i = 0; i < arr.length; i++) {
             var w = BI._lazyCreateWidget(arr[i]);
             if (o.verticalAlign === BI.VerticalAlign.Stretch) {
-                w.element.addClass("h-fill-item");
+                var top = o.vgap + o.tgap + (arr[i].tgap || 0) + (arr[i].vgap || 0),
+                    bottom = o.vgap + o.bgap + (arr[i].bgap || 0) + (arr[i].vgap || 0);
+                w.element.css("height", "calc(100% - " + ((top + bottom) / BI.pixRatio + BI.pixUnit) + ")");
             }
             w.element.css({position: "relative", top: "0", left: "0", margin: "0px auto"});
             var item = arr[i];

src/less/core/wrapper/fill.horizontal.less

@@ -1,5 +0,0 @@
-.bi-h-fill {
-  .h-fill-item {
-    height: 100%;
-  }
-}

src/less/core/wrapper/flex.leftrightvertical.center.less

@@ -1,5 +0,0 @@
-.bi-f-lr-v-c {
-  > .flex-left-auto {
-    margin-left: auto;
-  }
-}

src/less/core/wrapper/inline.center.less

@@ -1,23 +0,0 @@
-.bi-inline-center-adapt-layout {
-  &:after {
-    display: inline-block;
-    width: 0;
-    min-height: 100%;
-    vertical-align: middle;
-    content: ' ';
-  }
-
-  & > .inline-center-adapt-item {
-    display: inline-block;
-
-    &.x-icon {
-      display: inline-block !important;
-    }
-  }
-
-  & > .bi-combo {
-    &.bi-combo-popup {
-      display: inline-block !important;
-    }
-  }
-}

src/less/core/wrapper/inline.horizontal.less

@@ -1,23 +0,0 @@
-.bi-inline-horizontal-adapt-layout {
-  &:after {
-    display: inline-block;
-    width: 0;
-    min-height: 100%;
-    vertical-align: middle;
-    content: ' ';
-  }
-
-  & > .inline-horizontal-adapt-item {
-    display: inline-block;
-
-    &.x-icon {
-      display: inline-block !important;
-    }
-  }
-
-  & > .bi-combo {
-    &.bi-combo-popup {
-      display: inline-block !important;
-    }
-  }
-}

src/less/core/wrapper/inline.old.less

@@ -0,0 +1,71 @@
+.bi-inline-center-adapt-layout {
+  &:after {
+    display: inline-block;
+    width: 0;
+    min-height: 100%;
+    vertical-align: middle;
+    content: ' ';
+  }
+
+  & > .inline-center-adapt-item {
+    display: inline-block;
+
+    &.x-icon {
+      display: inline-block !important;
+    }
+  }
+
+  & > .bi-combo {
+    &.bi-combo-popup {
+      display: inline-block !important;
+    }
+  }
+}
+
+.bi-inline-horizontal-adapt-layout {
+  &:after {
+    display: inline-block;
+    width: 0;
+    min-height: 100%;
+    vertical-align: middle;
+    content: ' ';
+  }
+
+  & > .inline-horizontal-adapt-item {
+    display: inline-block;
+
+    &.x-icon {
+      display: inline-block !important;
+    }
+  }
+
+  & > .bi-combo {
+    &.bi-combo-popup {
+      display: inline-block !important;
+    }
+  }
+}
+
+.bi-inline-vertical-adapt-layout {
+  &:after {
+    display: inline-block;
+    width: 0;
+    min-height: 100%;
+    vertical-align: middle;
+    content: ' ';
+  }
+
+  & > .inline-vertical-adapt-item {
+    display: inline-block;
+
+    &.x-icon {
+      display: inline-block !important;
+    }
+  }
+
+  & > .bi-combo {
+    &.bi-combo-popup {
+      display: inline-block !important;
+    }
+  }
+}

src/less/core/wrapper/inline.vertical.less

@@ -1,23 +0,0 @@
-.bi-inline-vertical-adapt-layout {
-  &:after {
-    display: inline-block;
-    width: 0;
-    min-height: 100%;
-    vertical-align: middle;
-    content: ' ';
-  }
-
-  & > .inline-vertical-adapt-item {
-    display: inline-block;
-
-    &.x-icon {
-      display: inline-block !important;
-    }
-  }
-
-  & > .bi-combo {
-    &.bi-combo-popup {
-      display: inline-block !important;
-    }
-  }
-}