BI-32702 布局

dist/bundle.ie.js

@@ -19023,7 +19023,19 @@ BI.prepares.push(function () {
         return _isSupprtFlex;
     };
     BI.Plugin.registerWidget("bi.horizontal", function (ob) {
-        if (!BI.isIE() && isSupportFlex() && ob.items && ob.items.length <= 1) {
+        // center_adapt
+        if (ob.verticalAlign === BI.VerticalAlign.Middle && ob.horizontalAlign === BI.HorizontalAlign.Center) {
+            return ob;
+        }
+        // vertical_adapt
+        if (ob.verticalAlign === BI.VerticalAlign.Middle && ob.horizontalAlign === BI.HorizontalAlign.Left) {
+            return ob;
+        }
+        // horizontal_adapt
+        if (ob.verticalAlign === BI.VerticalAlign.Top && ob.horizontalAlign === BI.HorizontalAlign.Center) {
+            return ob;
+        }
+        if (!BI.isIE() && isSupportFlex()) {
             return BI.extend(ob, {type: "bi.flex_horizontal"});
         }
         return ob;
@@ -19050,6 +19062,12 @@ BI.prepares.push(function () {
         }
         return ob;
     });
+    BI.Plugin.registerWidget("bi.horizontal_adapt", function (ob) {
+        if (ob.items && ob.items.length <= 1) {
+            return BI.extend(ob, {type: "bi.horizontal_auto"});
+        }
+        return ob;
+    });
     BI.Plugin.registerWidget("bi.float_center_adapt", function (ob) {
         if (!BI.isIE() && isSupportFlex()) {
             // 有滚动条的情况下需要用到flex_wrapper_center布局
@@ -30465,6 +30483,7 @@ BI.HorizontalAdaptLayout = BI.inherit(BI.Layout, {
             baseCls: "bi-horizontal-adapt-layout",
             verticalAlign: BI.VerticalAlign.Top,
             columnSize: [],
+            scrollx: false,
             hgap: 0,
             vgap: 0,
             lgap: 0,
@@ -30474,90 +30493,33 @@ BI.HorizontalAdaptLayout = BI.inherit(BI.Layout, {
         });
     },
     render: function () {
+        var self = this, o = this.options;
         BI.HorizontalAdaptLayout.superclass.render.apply(this, arguments);
-        this.$table = BI.Widget._renderEngine.createElement("<table>").attr({cellspacing: 0, cellpadding: 0}).css({
+        return {
-            position: "relative",
+            type: "bi.horizontal",
-            width: "100%",
+            verticalAlign: BI.VerticalAlign.Top,
-            "white-space": "nowrap",
+            horizontalAlign: BI.HorizontalAlign.Center,
-            "border-spacing": "0px",
+            columnSize: o.columnSize,
-            border: "none",
+            items: o.items,
-            "border-collapse": "separate"
+            scrollx: o.scrollx,
-        });
+            ref: function (_ref) {
-        this.$tr = BI.Widget._renderEngine.createElement("<tr>");
+                self.layout = _ref;
-        this.$tr.appendTo(this.$table);
-        this.populate(this.options.items);
-    },
-
-    _addElement: function (i, item) {
-        var o = this.options;
-        var td;
-        var width = o.columnSize[i] <= 1 ? (o.columnSize[i] * 100 + "%") : o.columnSize[i];
-        if (!this.hasWidget(this._getChildName(i))) {
-            var w = BI.createWidget(item);
-            w.element.css({position: "relative", top: "0", left: "0", margin: "0px auto"});
-            td = BI.createWidget({
-                type: "bi.default",
-                tagName: "td",
-                attributes: {
-                    width: width
-                },
-                items: [w]
-            });
-            this.addWidget(this._getChildName(i), td);
-        } else {
-            td = this.getWidgetByName(this._getChildName(i));
-            td.element.attr("width", width);
-        }
-        td.element.css({"max-width": o.columnSize[i] + "px"});
-        if (i === 0) {
-            td.element.addClass("first-element");
-        }
-        td.element.css({
-            position: "relative",
-            "vertical-align": o.verticalAlign,
-            margin: "0",
-            padding: "0",
-            border: "none"
-        });
-        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) + "px"
-            });
-        }
-        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) +"px"
-            });
-        }
-        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) + "px"
-            });
-        }
-        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) + "px"
-            });
-        }
-        return td;
             },
-
+            hgap: o.hgap,
-    appendFragment: function (frag) {
+            vgap: o.vgap,
-        this.$tr.append(frag);
+            lgap: o.lgap,
-        this.element.append(this.$table);
+            rgap: o.rgap,
+            tgap: o.tgap,
+            bgap: o.bgap
+        };
     },
 
     resize: function () {
         // console.log("horizontal_adapt布局不需要resize");
     },
 
-    _getWrapper: function () {
-        return this.$tr;
-    },
-
     populate: function (items) {
-        BI.HorizontalAdaptLayout.superclass.populate.apply(this, arguments);
+        this.layout.populate.apply(this, arguments);
-        this._mount();
     }
 });
 BI.shortcut("bi.horizontal_adapt", BI.HorizontalAdaptLayout);/**

dist/bundle.js

@@ -19023,7 +19023,19 @@ BI.prepares.push(function () {
         return _isSupprtFlex;
     };
     BI.Plugin.registerWidget("bi.horizontal", function (ob) {
-        if (!BI.isIE() && isSupportFlex() && ob.items && ob.items.length <= 1) {
+        // center_adapt
+        if (ob.verticalAlign === BI.VerticalAlign.Middle && ob.horizontalAlign === BI.HorizontalAlign.Center) {
+            return ob;
+        }
+        // vertical_adapt
+        if (ob.verticalAlign === BI.VerticalAlign.Middle && ob.horizontalAlign === BI.HorizontalAlign.Left) {
+            return ob;
+        }
+        // horizontal_adapt
+        if (ob.verticalAlign === BI.VerticalAlign.Top && ob.horizontalAlign === BI.HorizontalAlign.Center) {
+            return ob;
+        }
+        if (!BI.isIE() && isSupportFlex()) {
             return BI.extend(ob, {type: "bi.flex_horizontal"});
         }
         return ob;
@@ -19050,6 +19062,12 @@ BI.prepares.push(function () {
         }
         return ob;
     });
+    BI.Plugin.registerWidget("bi.horizontal_adapt", function (ob) {
+        if (ob.items && ob.items.length <= 1) {
+            return BI.extend(ob, {type: "bi.horizontal_auto"});
+        }
+        return ob;
+    });
     BI.Plugin.registerWidget("bi.float_center_adapt", function (ob) {
         if (!BI.isIE() && isSupportFlex()) {
             // 有滚动条的情况下需要用到flex_wrapper_center布局
@@ -30465,6 +30483,7 @@ BI.HorizontalAdaptLayout = BI.inherit(BI.Layout, {
             baseCls: "bi-horizontal-adapt-layout",
             verticalAlign: BI.VerticalAlign.Top,
             columnSize: [],
+            scrollx: false,
             hgap: 0,
             vgap: 0,
             lgap: 0,
@@ -30474,90 +30493,33 @@ BI.HorizontalAdaptLayout = BI.inherit(BI.Layout, {
         });
     },
     render: function () {
+        var self = this, o = this.options;
         BI.HorizontalAdaptLayout.superclass.render.apply(this, arguments);
-        this.$table = BI.Widget._renderEngine.createElement("<table>").attr({cellspacing: 0, cellpadding: 0}).css({
+        return {
-            position: "relative",
+            type: "bi.horizontal",
-            width: "100%",
+            verticalAlign: BI.VerticalAlign.Top,
-            "white-space": "nowrap",
+            horizontalAlign: BI.HorizontalAlign.Center,
-            "border-spacing": "0px",
+            columnSize: o.columnSize,
-            border: "none",
+            items: o.items,
-            "border-collapse": "separate"
+            scrollx: o.scrollx,
-        });
+            ref: function (_ref) {
-        this.$tr = BI.Widget._renderEngine.createElement("<tr>");
+                self.layout = _ref;
-        this.$tr.appendTo(this.$table);
-        this.populate(this.options.items);
-    },
-
-    _addElement: function (i, item) {
-        var o = this.options;
-        var td;
-        var width = o.columnSize[i] <= 1 ? (o.columnSize[i] * 100 + "%") : o.columnSize[i];
-        if (!this.hasWidget(this._getChildName(i))) {
-            var w = BI.createWidget(item);
-            w.element.css({position: "relative", top: "0", left: "0", margin: "0px auto"});
-            td = BI.createWidget({
-                type: "bi.default",
-                tagName: "td",
-                attributes: {
-                    width: width
-                },
-                items: [w]
-            });
-            this.addWidget(this._getChildName(i), td);
-        } else {
-            td = this.getWidgetByName(this._getChildName(i));
-            td.element.attr("width", width);
-        }
-        td.element.css({"max-width": o.columnSize[i] + "px"});
-        if (i === 0) {
-            td.element.addClass("first-element");
-        }
-        td.element.css({
-            position: "relative",
-            "vertical-align": o.verticalAlign,
-            margin: "0",
-            padding: "0",
-            border: "none"
-        });
-        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) + "px"
-            });
-        }
-        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) +"px"
-            });
-        }
-        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) + "px"
-            });
-        }
-        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) + "px"
-            });
-        }
-        return td;
             },
-
+            hgap: o.hgap,
-    appendFragment: function (frag) {
+            vgap: o.vgap,
-        this.$tr.append(frag);
+            lgap: o.lgap,
-        this.element.append(this.$table);
+            rgap: o.rgap,
+            tgap: o.tgap,
+            bgap: o.bgap
+        };
     },
 
     resize: function () {
         // console.log("horizontal_adapt布局不需要resize");
     },
 
-    _getWrapper: function () {
-        return this.$tr;
-    },
-
     populate: function (items) {
-        BI.HorizontalAdaptLayout.superclass.populate.apply(this, arguments);
+        this.layout.populate.apply(this, arguments);
-        this._mount();
     }
 });
 BI.shortcut("bi.horizontal_adapt", BI.HorizontalAdaptLayout);/**

dist/core.js

@@ -19023,7 +19023,19 @@ BI.prepares.push(function () {
         return _isSupprtFlex;
     };
     BI.Plugin.registerWidget("bi.horizontal", function (ob) {
-        if (!BI.isIE() && isSupportFlex() && ob.items && ob.items.length <= 1) {
+        // center_adapt
+        if (ob.verticalAlign === BI.VerticalAlign.Middle && ob.horizontalAlign === BI.HorizontalAlign.Center) {
+            return ob;
+        }
+        // vertical_adapt
+        if (ob.verticalAlign === BI.VerticalAlign.Middle && ob.horizontalAlign === BI.HorizontalAlign.Left) {
+            return ob;
+        }
+        // horizontal_adapt
+        if (ob.verticalAlign === BI.VerticalAlign.Top && ob.horizontalAlign === BI.HorizontalAlign.Center) {
+            return ob;
+        }
+        if (!BI.isIE() && isSupportFlex()) {
             return BI.extend(ob, {type: "bi.flex_horizontal"});
         }
         return ob;
@@ -19050,6 +19062,12 @@ BI.prepares.push(function () {
         }
         return ob;
     });
+    BI.Plugin.registerWidget("bi.horizontal_adapt", function (ob) {
+        if (ob.items && ob.items.length <= 1) {
+            return BI.extend(ob, {type: "bi.horizontal_auto"});
+        }
+        return ob;
+    });
     BI.Plugin.registerWidget("bi.float_center_adapt", function (ob) {
         if (!BI.isIE() && isSupportFlex()) {
             // 有滚动条的情况下需要用到flex_wrapper_center布局
@@ -30465,6 +30483,7 @@ BI.HorizontalAdaptLayout = BI.inherit(BI.Layout, {
             baseCls: "bi-horizontal-adapt-layout",
             verticalAlign: BI.VerticalAlign.Top,
             columnSize: [],
+            scrollx: false,
             hgap: 0,
             vgap: 0,
             lgap: 0,
@@ -30474,90 +30493,33 @@ BI.HorizontalAdaptLayout = BI.inherit(BI.Layout, {
         });
     },
     render: function () {
+        var self = this, o = this.options;
         BI.HorizontalAdaptLayout.superclass.render.apply(this, arguments);
-        this.$table = BI.Widget._renderEngine.createElement("<table>").attr({cellspacing: 0, cellpadding: 0}).css({
+        return {
-            position: "relative",
+            type: "bi.horizontal",
-            width: "100%",
+            verticalAlign: BI.VerticalAlign.Top,
-            "white-space": "nowrap",
+            horizontalAlign: BI.HorizontalAlign.Center,
-            "border-spacing": "0px",
+            columnSize: o.columnSize,
-            border: "none",
+            items: o.items,
-            "border-collapse": "separate"
+            scrollx: o.scrollx,
-        });
+            ref: function (_ref) {
-        this.$tr = BI.Widget._renderEngine.createElement("<tr>");
+                self.layout = _ref;
-        this.$tr.appendTo(this.$table);
-        this.populate(this.options.items);
-    },
-
-    _addElement: function (i, item) {
-        var o = this.options;
-        var td;
-        var width = o.columnSize[i] <= 1 ? (o.columnSize[i] * 100 + "%") : o.columnSize[i];
-        if (!this.hasWidget(this._getChildName(i))) {
-            var w = BI.createWidget(item);
-            w.element.css({position: "relative", top: "0", left: "0", margin: "0px auto"});
-            td = BI.createWidget({
-                type: "bi.default",
-                tagName: "td",
-                attributes: {
-                    width: width
-                },
-                items: [w]
-            });
-            this.addWidget(this._getChildName(i), td);
-        } else {
-            td = this.getWidgetByName(this._getChildName(i));
-            td.element.attr("width", width);
-        }
-        td.element.css({"max-width": o.columnSize[i] + "px"});
-        if (i === 0) {
-            td.element.addClass("first-element");
-        }
-        td.element.css({
-            position: "relative",
-            "vertical-align": o.verticalAlign,
-            margin: "0",
-            padding: "0",
-            border: "none"
-        });
-        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) + "px"
-            });
-        }
-        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) +"px"
-            });
-        }
-        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) + "px"
-            });
-        }
-        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) + "px"
-            });
-        }
-        return td;
             },
-
+            hgap: o.hgap,
-    appendFragment: function (frag) {
+            vgap: o.vgap,
-        this.$tr.append(frag);
+            lgap: o.lgap,
-        this.element.append(this.$table);
+            rgap: o.rgap,
+            tgap: o.tgap,
+            bgap: o.bgap
+        };
     },
 
     resize: function () {
         // console.log("horizontal_adapt布局不需要resize");
     },
 
-    _getWrapper: function () {
-        return this.$tr;
-    },
-
     populate: function (items) {
-        BI.HorizontalAdaptLayout.superclass.populate.apply(this, arguments);
+        this.layout.populate.apply(this, arguments);
-        this._mount();
     }
 });
 BI.shortcut("bi.horizontal_adapt", BI.HorizontalAdaptLayout);/**

dist/fineui.ie.js

@@ -19265,7 +19265,19 @@ BI.prepares.push(function () {
         return _isSupprtFlex;
     };
     BI.Plugin.registerWidget("bi.horizontal", function (ob) {
-        if (!BI.isIE() && isSupportFlex() && ob.items && ob.items.length <= 1) {
+        // center_adapt
+        if (ob.verticalAlign === BI.VerticalAlign.Middle && ob.horizontalAlign === BI.HorizontalAlign.Center) {
+            return ob;
+        }
+        // vertical_adapt
+        if (ob.verticalAlign === BI.VerticalAlign.Middle && ob.horizontalAlign === BI.HorizontalAlign.Left) {
+            return ob;
+        }
+        // horizontal_adapt
+        if (ob.verticalAlign === BI.VerticalAlign.Top && ob.horizontalAlign === BI.HorizontalAlign.Center) {
+            return ob;
+        }
+        if (!BI.isIE() && isSupportFlex()) {
             return BI.extend(ob, {type: "bi.flex_horizontal"});
         }
         return ob;
@@ -19292,6 +19304,12 @@ BI.prepares.push(function () {
         }
         return ob;
     });
+    BI.Plugin.registerWidget("bi.horizontal_adapt", function (ob) {
+        if (ob.items && ob.items.length <= 1) {
+            return BI.extend(ob, {type: "bi.horizontal_auto"});
+        }
+        return ob;
+    });
     BI.Plugin.registerWidget("bi.float_center_adapt", function (ob) {
         if (!BI.isIE() && isSupportFlex()) {
             // 有滚动条的情况下需要用到flex_wrapper_center布局
@@ -30707,6 +30725,7 @@ BI.HorizontalAdaptLayout = BI.inherit(BI.Layout, {
             baseCls: "bi-horizontal-adapt-layout",
             verticalAlign: BI.VerticalAlign.Top,
             columnSize: [],
+            scrollx: false,
             hgap: 0,
             vgap: 0,
             lgap: 0,
@@ -30716,90 +30735,33 @@ BI.HorizontalAdaptLayout = BI.inherit(BI.Layout, {
         });
     },
     render: function () {
+        var self = this, o = this.options;
         BI.HorizontalAdaptLayout.superclass.render.apply(this, arguments);
-        this.$table = BI.Widget._renderEngine.createElement("<table>").attr({cellspacing: 0, cellpadding: 0}).css({
+        return {
-            position: "relative",
+            type: "bi.horizontal",
-            width: "100%",
+            verticalAlign: BI.VerticalAlign.Top,
-            "white-space": "nowrap",
+            horizontalAlign: BI.HorizontalAlign.Center,
-            "border-spacing": "0px",
+            columnSize: o.columnSize,
-            border: "none",
+            items: o.items,
-            "border-collapse": "separate"
+            scrollx: o.scrollx,
-        });
+            ref: function (_ref) {
-        this.$tr = BI.Widget._renderEngine.createElement("<tr>");
+                self.layout = _ref;
-        this.$tr.appendTo(this.$table);
-        this.populate(this.options.items);
-    },
-
-    _addElement: function (i, item) {
-        var o = this.options;
-        var td;
-        var width = o.columnSize[i] <= 1 ? (o.columnSize[i] * 100 + "%") : o.columnSize[i];
-        if (!this.hasWidget(this._getChildName(i))) {
-            var w = BI.createWidget(item);
-            w.element.css({position: "relative", top: "0", left: "0", margin: "0px auto"});
-            td = BI.createWidget({
-                type: "bi.default",
-                tagName: "td",
-                attributes: {
-                    width: width
-                },
-                items: [w]
-            });
-            this.addWidget(this._getChildName(i), td);
-        } else {
-            td = this.getWidgetByName(this._getChildName(i));
-            td.element.attr("width", width);
-        }
-        td.element.css({"max-width": o.columnSize[i] + "px"});
-        if (i === 0) {
-            td.element.addClass("first-element");
-        }
-        td.element.css({
-            position: "relative",
-            "vertical-align": o.verticalAlign,
-            margin: "0",
-            padding: "0",
-            border: "none"
-        });
-        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) + "px"
-            });
-        }
-        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) +"px"
-            });
-        }
-        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) + "px"
-            });
-        }
-        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) + "px"
-            });
-        }
-        return td;
             },
-
+            hgap: o.hgap,
-    appendFragment: function (frag) {
+            vgap: o.vgap,
-        this.$tr.append(frag);
+            lgap: o.lgap,
-        this.element.append(this.$table);
+            rgap: o.rgap,
+            tgap: o.tgap,
+            bgap: o.bgap
+        };
     },
 
     resize: function () {
         // console.log("horizontal_adapt布局不需要resize");
     },
 
-    _getWrapper: function () {
-        return this.$tr;
-    },
-
     populate: function (items) {
-        BI.HorizontalAdaptLayout.superclass.populate.apply(this, arguments);
+        this.layout.populate.apply(this, arguments);
-        this._mount();
     }
 });
 BI.shortcut("bi.horizontal_adapt", BI.HorizontalAdaptLayout);/**

dist/fineui.js

@@ -19265,7 +19265,19 @@ BI.prepares.push(function () {
         return _isSupprtFlex;
     };
     BI.Plugin.registerWidget("bi.horizontal", function (ob) {
-        if (!BI.isIE() && isSupportFlex() && ob.items && ob.items.length <= 1) {
+        // center_adapt
+        if (ob.verticalAlign === BI.VerticalAlign.Middle && ob.horizontalAlign === BI.HorizontalAlign.Center) {
+            return ob;
+        }
+        // vertical_adapt
+        if (ob.verticalAlign === BI.VerticalAlign.Middle && ob.horizontalAlign === BI.HorizontalAlign.Left) {
+            return ob;
+        }
+        // horizontal_adapt
+        if (ob.verticalAlign === BI.VerticalAlign.Top && ob.horizontalAlign === BI.HorizontalAlign.Center) {
+            return ob;
+        }
+        if (!BI.isIE() && isSupportFlex()) {
             return BI.extend(ob, {type: "bi.flex_horizontal"});
         }
         return ob;
@@ -19292,6 +19304,12 @@ BI.prepares.push(function () {
         }
         return ob;
     });
+    BI.Plugin.registerWidget("bi.horizontal_adapt", function (ob) {
+        if (ob.items && ob.items.length <= 1) {
+            return BI.extend(ob, {type: "bi.horizontal_auto"});
+        }
+        return ob;
+    });
     BI.Plugin.registerWidget("bi.float_center_adapt", function (ob) {
         if (!BI.isIE() && isSupportFlex()) {
             // 有滚动条的情况下需要用到flex_wrapper_center布局
@@ -30707,6 +30725,7 @@ BI.HorizontalAdaptLayout = BI.inherit(BI.Layout, {
             baseCls: "bi-horizontal-adapt-layout",
             verticalAlign: BI.VerticalAlign.Top,
             columnSize: [],
+            scrollx: false,
             hgap: 0,
             vgap: 0,
             lgap: 0,
@@ -30716,90 +30735,33 @@ BI.HorizontalAdaptLayout = BI.inherit(BI.Layout, {
         });
     },
     render: function () {
+        var self = this, o = this.options;
         BI.HorizontalAdaptLayout.superclass.render.apply(this, arguments);
-        this.$table = BI.Widget._renderEngine.createElement("<table>").attr({cellspacing: 0, cellpadding: 0}).css({
+        return {
-            position: "relative",
+            type: "bi.horizontal",
-            width: "100%",
+            verticalAlign: BI.VerticalAlign.Top,
-            "white-space": "nowrap",
+            horizontalAlign: BI.HorizontalAlign.Center,
-            "border-spacing": "0px",
+            columnSize: o.columnSize,
-            border: "none",
+            items: o.items,
-            "border-collapse": "separate"
+            scrollx: o.scrollx,
-        });
+            ref: function (_ref) {
-        this.$tr = BI.Widget._renderEngine.createElement("<tr>");
+                self.layout = _ref;
-        this.$tr.appendTo(this.$table);
-        this.populate(this.options.items);
-    },
-
-    _addElement: function (i, item) {
-        var o = this.options;
-        var td;
-        var width = o.columnSize[i] <= 1 ? (o.columnSize[i] * 100 + "%") : o.columnSize[i];
-        if (!this.hasWidget(this._getChildName(i))) {
-            var w = BI.createWidget(item);
-            w.element.css({position: "relative", top: "0", left: "0", margin: "0px auto"});
-            td = BI.createWidget({
-                type: "bi.default",
-                tagName: "td",
-                attributes: {
-                    width: width
-                },
-                items: [w]
-            });
-            this.addWidget(this._getChildName(i), td);
-        } else {
-            td = this.getWidgetByName(this._getChildName(i));
-            td.element.attr("width", width);
-        }
-        td.element.css({"max-width": o.columnSize[i] + "px"});
-        if (i === 0) {
-            td.element.addClass("first-element");
-        }
-        td.element.css({
-            position: "relative",
-            "vertical-align": o.verticalAlign,
-            margin: "0",
-            padding: "0",
-            border: "none"
-        });
-        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) + "px"
-            });
-        }
-        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) +"px"
-            });
-        }
-        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) + "px"
-            });
-        }
-        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) + "px"
-            });
-        }
-        return td;
             },
-
+            hgap: o.hgap,
-    appendFragment: function (frag) {
+            vgap: o.vgap,
-        this.$tr.append(frag);
+            lgap: o.lgap,
-        this.element.append(this.$table);
+            rgap: o.rgap,
+            tgap: o.tgap,
+            bgap: o.bgap
+        };
     },
 
     resize: function () {
         // console.log("horizontal_adapt布局不需要resize");
     },
 
-    _getWrapper: function () {
-        return this.$tr;
-    },
-
     populate: function (items) {
-        BI.HorizontalAdaptLayout.superclass.populate.apply(this, arguments);
+        this.layout.populate.apply(this, arguments);
-        this._mount();
     }
 });
 BI.shortcut("bi.horizontal_adapt", BI.HorizontalAdaptLayout);/**

dist/fineui_without_jquery_polyfill.js

@@ -19476,6 +19476,7 @@ BI.HorizontalAdaptLayout = BI.inherit(BI.Layout, {
             baseCls: "bi-horizontal-adapt-layout",
             verticalAlign: BI.VerticalAlign.Top,
             columnSize: [],
+            scrollx: false,
             hgap: 0,
             vgap: 0,
             lgap: 0,
@@ -19485,90 +19486,33 @@ BI.HorizontalAdaptLayout = BI.inherit(BI.Layout, {
         });
     },
     render: function () {
+        var self = this, o = this.options;
         BI.HorizontalAdaptLayout.superclass.render.apply(this, arguments);
-        this.$table = BI.Widget._renderEngine.createElement("<table>").attr({cellspacing: 0, cellpadding: 0}).css({
+        return {
-            position: "relative",
+            type: "bi.horizontal",
-            width: "100%",
+            verticalAlign: BI.VerticalAlign.Top,
-            "white-space": "nowrap",
+            horizontalAlign: BI.HorizontalAlign.Center,
-            "border-spacing": "0px",
+            columnSize: o.columnSize,
-            border: "none",
+            items: o.items,
-            "border-collapse": "separate"
+            scrollx: o.scrollx,
-        });
+            ref: function (_ref) {
-        this.$tr = BI.Widget._renderEngine.createElement("<tr>");
+                self.layout = _ref;
-        this.$tr.appendTo(this.$table);
-        this.populate(this.options.items);
-    },
-
-    _addElement: function (i, item) {
-        var o = this.options;
-        var td;
-        var width = o.columnSize[i] <= 1 ? (o.columnSize[i] * 100 + "%") : o.columnSize[i];
-        if (!this.hasWidget(this._getChildName(i))) {
-            var w = BI.createWidget(item);
-            w.element.css({position: "relative", top: "0", left: "0", margin: "0px auto"});
-            td = BI.createWidget({
-                type: "bi.default",
-                tagName: "td",
-                attributes: {
-                    width: width
-                },
-                items: [w]
-            });
-            this.addWidget(this._getChildName(i), td);
-        } else {
-            td = this.getWidgetByName(this._getChildName(i));
-            td.element.attr("width", width);
-        }
-        td.element.css({"max-width": o.columnSize[i] + "px"});
-        if (i === 0) {
-            td.element.addClass("first-element");
-        }
-        td.element.css({
-            position: "relative",
-            "vertical-align": o.verticalAlign,
-            margin: "0",
-            padding: "0",
-            border: "none"
-        });
-        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) + "px"
-            });
-        }
-        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) +"px"
-            });
-        }
-        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) + "px"
-            });
-        }
-        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) + "px"
-            });
-        }
-        return td;
             },
-
+            hgap: o.hgap,
-    appendFragment: function (frag) {
+            vgap: o.vgap,
-        this.$tr.append(frag);
+            lgap: o.lgap,
-        this.element.append(this.$table);
+            rgap: o.rgap,
+            tgap: o.tgap,
+            bgap: o.bgap
+        };
     },
 
     resize: function () {
         // console.log("horizontal_adapt布局不需要resize");
     },
 
-    _getWrapper: function () {
-        return this.$tr;
-    },
-
     populate: function (items) {
-        BI.HorizontalAdaptLayout.superclass.populate.apply(this, arguments);
+        this.layout.populate.apply(this, arguments);
-        this._mount();
     }
 });
 BI.shortcut("bi.horizontal_adapt", BI.HorizontalAdaptLayout);/**

src/core/platform/web/config.js

@@ -9,7 +9,19 @@ BI.prepares.push(function () {
         return _isSupprtFlex;
     };
     BI.Plugin.registerWidget("bi.horizontal", function (ob) {
-        if (!BI.isIE() && isSupportFlex() && ob.items && ob.items.length <= 1) {
+        // center_adapt
+        if (ob.verticalAlign === BI.VerticalAlign.Middle && ob.horizontalAlign === BI.HorizontalAlign.Center) {
+            return ob;
+        }
+        // vertical_adapt
+        if (ob.verticalAlign === BI.VerticalAlign.Middle && ob.horizontalAlign === BI.HorizontalAlign.Left) {
+            return ob;
+        }
+        // horizontal_adapt
+        if (ob.verticalAlign === BI.VerticalAlign.Top && ob.horizontalAlign === BI.HorizontalAlign.Center) {
+            return ob;
+        }
+        if (!BI.isIE() && isSupportFlex()) {
             return BI.extend(ob, {type: "bi.flex_horizontal"});
         }
         return ob;
@@ -36,6 +48,12 @@ BI.prepares.push(function () {
         }
         return ob;
     });
+    BI.Plugin.registerWidget("bi.horizontal_adapt", function (ob) {
+        if (ob.items && ob.items.length <= 1) {
+            return BI.extend(ob, {type: "bi.horizontal_auto"});
+        }
+        return ob;
+    });
     BI.Plugin.registerWidget("bi.float_center_adapt", function (ob) {
         if (!BI.isIE() && isSupportFlex()) {
             // 有滚动条的情况下需要用到flex_wrapper_center布局

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

@@ -9,6 +9,7 @@ BI.HorizontalAdaptLayout = BI.inherit(BI.Layout, {
             baseCls: "bi-horizontal-adapt-layout",
             verticalAlign: BI.VerticalAlign.Top,
             columnSize: [],
+            scrollx: false,
             hgap: 0,
             vgap: 0,
             lgap: 0,
@@ -18,90 +19,33 @@ BI.HorizontalAdaptLayout = BI.inherit(BI.Layout, {
         });
     },
     render: function () {
+        var self = this, o = this.options;
         BI.HorizontalAdaptLayout.superclass.render.apply(this, arguments);
-        this.$table = BI.Widget._renderEngine.createElement("<table>").attr({cellspacing: 0, cellpadding: 0}).css({
+        return {
-            position: "relative",
+            type: "bi.horizontal",
-            width: "100%",
+            verticalAlign: BI.VerticalAlign.Top,
-            "white-space": "nowrap",
+            horizontalAlign: BI.HorizontalAlign.Center,
-            "border-spacing": "0px",
+            columnSize: o.columnSize,
-            border: "none",
+            items: o.items,
-            "border-collapse": "separate"
+            scrollx: o.scrollx,
-        });
+            ref: function (_ref) {
-        this.$tr = BI.Widget._renderEngine.createElement("<tr>");
+                self.layout = _ref;
-        this.$tr.appendTo(this.$table);
-        this.populate(this.options.items);
-    },
-
-    _addElement: function (i, item) {
-        var o = this.options;
-        var td;
-        var width = o.columnSize[i] <= 1 ? (o.columnSize[i] * 100 + "%") : o.columnSize[i];
-        if (!this.hasWidget(this._getChildName(i))) {
-            var w = BI.createWidget(item);
-            w.element.css({position: "relative", top: "0", left: "0", margin: "0px auto"});
-            td = BI.createWidget({
-                type: "bi.default",
-                tagName: "td",
-                attributes: {
-                    width: width
-                },
-                items: [w]
-            });
-            this.addWidget(this._getChildName(i), td);
-        } else {
-            td = this.getWidgetByName(this._getChildName(i));
-            td.element.attr("width", width);
-        }
-        td.element.css({"max-width": o.columnSize[i] + "px"});
-        if (i === 0) {
-            td.element.addClass("first-element");
-        }
-        td.element.css({
-            position: "relative",
-            "vertical-align": o.verticalAlign,
-            margin: "0",
-            padding: "0",
-            border: "none"
-        });
-        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) + "px"
-            });
-        }
-        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) +"px"
-            });
-        }
-        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) + "px"
-            });
-        }
-        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) + "px"
-            });
-        }
-        return td;
             },
-
+            hgap: o.hgap,
-    appendFragment: function (frag) {
+            vgap: o.vgap,
-        this.$tr.append(frag);
+            lgap: o.lgap,
-        this.element.append(this.$table);
+            rgap: o.rgap,
+            tgap: o.tgap,
+            bgap: o.bgap
+        };
     },
 
     resize: function () {
         // console.log("horizontal_adapt布局不需要resize");
     },
 
-    _getWrapper: function () {
-        return this.$tr;
-    },
-
     populate: function (items) {
-        BI.HorizontalAdaptLayout.superclass.populate.apply(this, arguments);
+        this.layout.populate.apply(this, arguments);
-        this._mount();
     }
 });
 BI.shortcut("bi.horizontal_adapt", BI.HorizontalAdaptLayout);