优化布局

src/core/platform/web/config.js

@@ -29,7 +29,26 @@ BI.prepares.push(function () {
     });
     BI.Plugin.configWidget("bi.inline", function (ob) {
         // 当列宽既需要自动列宽又需要自适应列宽时，inline布局也处理不了了，降级table处理吧
+        var hasAutoAndFillColumnSize;
         if (ob.columnSize && ob.columnSize.indexOf("") >= 0 && ob.columnSize.indexOf("fill") >= 0) {
+            hasAutoAndFillColumnSize = true;
+        } else {
+            var hasAuto = false, hasFill = false;
+            BI.each(ob.items, function (i, item) {
+                if (item.width === "fill") {
+                    hasFill = true;
+                } else if (BI.isNull(item.width) || item.width === "") {
+                    hasAuto = true;
+                }
+            });
+            hasAutoAndFillColumnSize = hasAuto && hasFill;
+        }
+
+        if (hasAutoAndFillColumnSize) {
+            // 宽度是不是受限
+            if ((ob.scrollable !== true && ob.scrollx !== true) || ob.horizontalAlign === BI.HorizontalAlign.Stretch) {
+                return BI.extend({}, ob, {type: "bi.horizontal_float_fill"});
+            }
             return BI.extend({
                 horizontalAlign: BI.HorizontalAlign.Stretch
             }, ob, {type: "bi.table_adapt"});
@@ -98,6 +117,12 @@ BI.prepares.push(function () {
                 scrollx: false
             }, ob, {type: "bi.flex_horizontal"});
         }
+        if ((ob.horizontalAlign && ob.horizontalAlign !== BI.HorizontalAlign.Stretch) || (ob.scrollable === true || ob.scrollx === true)) {
+            // 宽度不受限，要用table布局
+            return BI.extend({
+                horizontalAlign: BI.HorizontalAlign.Stretch
+            }, ob, {type: "bi.table_adapt"});
+        }
         return BI.extend({}, ob, {type: "bi.horizontal_float_fill"});
     });
     BI.Plugin.configWidget("bi.vertical_fill", function (ob) {

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

@@ -4,9 +4,9 @@
  * @extends BI.Layout
  */
 BI.TableAdaptLayout = BI.inherit(BI.Layout, {
-    props: function () {
+    props: function (props) {
         return BI.extend(BI.TableAdaptLayout.superclass.props.apply(this, arguments), {
-            baseCls: "bi-t-a",
+            baseCls: "bi-t-a" + (props.verticalAlign === BI.VerticalAlign.Stretch ? " bi-h-fill" : ""),
             columnSize: [],
             verticalAlign: BI.VerticalAlign.Top,
             horizontalAlign: BI.HorizontalAlign.Left,
@@ -46,6 +46,9 @@ BI.TableAdaptLayout = BI.inherit(BI.Layout, {
         if (!this.hasWidget(this._getChildName(i))) {
             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");
+            }
             td = BI._lazyCreateWidget({
                 type: "bi.default",
                 width: width,

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

@@ -1,8 +1,9 @@
 BI.FloatHorizontalFillLayout = BI.inherit(BI.Layout, {
     props: function () {
         return BI.extend(BI.FloatHorizontalFillLayout.superclass.props.apply(this, arguments), {
-            baseCls: "bi-h-float-fill",
+            baseCls: "bi-h-float-fill bi-h-fill",
-            verticalAlign: BI.VerticalAlign.Top,
+            horizontalAlign: BI.HorizontalAlign.Stretch,
+            verticalAlign: BI.VerticalAlign.Stretch,
             hgap: 0,
             vgap: 0,
             lgap: 0,
@@ -30,6 +31,54 @@ BI.FloatHorizontalFillLayout = BI.inherit(BI.Layout, {
         var self = this, o = this.options;
         items = BI.compact(items);
         var rank = 0;
+
+        function createWidget (i, item, desc) {
+            if (o.verticalAlign !== BI.VerticalAlign.Stretch) {
+                var w = BI._lazyCreateWidget({
+                    type: "bi.vertical_adapt",
+                    horizontalAlign: BI.HorizontalAlign.Stretch,
+                    verticalAlign: o.verticalAlign,
+                    items: [item]
+                });
+            } else {
+                var w = BI._lazyCreateWidget(item);
+            }
+            if (o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0) !== 0) {
+                w.element.css({
+                    "margin-top": (o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0)) / BI.pixRatio + BI.pixUnit
+                });
+            }
+            if (desc) {
+                if (o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0) !== 0) {
+                    w.element.css({
+                        "margin-right": ((i === o.items.length - 1 ? o.hgap : 0) + o.rgap + (item.rgap || 0) + (item.hgap || 0)) / BI.pixRatio + BI.pixUnit
+                    });
+                }
+                if (o.hgap + o.lgap + (item.lgap || 0) + (item.hgap || 0) !== 0) {
+                    w.element.css({
+                        "margin-left": (o.hgap + o.lgap + (item.lgap || 0) + (item.hgap || 0)) / BI.pixRatio + BI.pixUnit
+                    });
+                }
+            } else {
+                if (o.hgap + o.lgap + (item.lgap || 0) + (item.hgap || 0) !== 0) {
+                    w.element.css({
+                        "margin-left": ((i === 0 ? o.hgap : 0) + o.lgap + (item.lgap || 0) + (item.hgap || 0)) / BI.pixRatio + BI.pixUnit
+                    });
+                }
+                if (o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0) !== 0) {
+                    w.element.css({
+                        "margin-right": (o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0)) / BI.pixRatio + BI.pixUnit
+                    });
+                }
+            }
+            if (o.vgap + o.bgap + (item.bgap || 0) + (item.vgap || 0) !== 0) {
+                w.element.css({
+                    "margin-bottom": (o.vgap + o.bgap + (item.bgap || 0) + (item.vgap || 0)) / BI.pixRatio + BI.pixUnit
+                });
+            }
+            return w;
+        }
+
         BI.any(items, function (i, item) {
             if (BI.isEmptyObject(item)) {
                 return true;
@@ -38,9 +87,9 @@ BI.FloatHorizontalFillLayout = BI.inherit(BI.Layout, {
             if (columnSize === "fill") {
                 return true;
             }
-            var w = BI._lazyCreateWidget(item);
+            var w = createWidget(i, item);
             self.addWidget(self._getChildName(rank++), w);
-            w.element.addClass("h-float-fill-item");
+            w.element.addClass("h-fill-item");
             w.element.css({
                 float: "left",
                 position: "relative"
@@ -54,9 +103,9 @@ BI.FloatHorizontalFillLayout = BI.inherit(BI.Layout, {
             if (columnSize === "fill") {
                 return true;
             }
-            var w = BI._lazyCreateWidget(item);
+            var w = createWidget(i, item, true);
             self.addWidget(self._getChildName(rank++), w);
-            w.element.addClass("h-float-fill-item");
+            w.element.addClass("h-fill-item");
             w.element.css({
                 float: "right",
                 position: "relative"
@@ -65,9 +114,9 @@ BI.FloatHorizontalFillLayout = BI.inherit(BI.Layout, {
         BI.each(items, function (i, item) {
             var columnSize = o.columnSize.length > 0 ? o.columnSize[i] : item.width;
             if (columnSize === "fill") {
-                var w = BI._lazyCreateWidget(item);
+                var w = createWidget(i, item);
                 self.addWidget(self._getChildName(rank++), w);
-                w.element.addClass("h-float-fill-item").css({
+                w.element.addClass("h-fill-item").css({
                     position: "relative"
                 });
             }

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

@@ -4,9 +4,9 @@
  * @extends BI.Layout
  */
 BI.TdLayout = BI.inherit(BI.Layout, {
-    props: function () {
+    props: function (props) {
         return BI.extend(BI.TdLayout.superclass.props.apply(this, arguments), {
-            baseCls: "bi-td",
+            baseCls: "bi-td" + (props.verticalAlign === BI.VerticalAlign.Stretch ? " bi-h-fill" : ""),
             columnSize: [],
             rowSize: [],
             verticalAlign: BI.VerticalAlign.Middle,
@@ -89,6 +89,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");
+            }
             w.element.css({position: "relative", top: "0", left: "0", margin: "0px auto"});
             var item = arr[i];
             if (o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0) !== 0) {

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

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