Pull request #2045: 无JIRA任务 布局

Merge in VISUAL/fineui from ~GUY/fineui:master to master

* commit '1a6bde32e4d211ba803ec47a03b48b8f70ba79e9':
  布局

src/core/wrapper/layout/float/float.absolute.center.js

@@ -0,0 +1,36 @@
+/**
+ * absolute实现的居中布局
+ * @class BI.FloatAbsoluteCenterLayout
+ * @extends BI.Layout
+ */
+BI.FloatAbsoluteCenterLayout = BI.inherit(BI.Layout, {
+    props: function () {
+        return BI.extend(BI.FloatAbsoluteCenterLayout.superclass.props.apply(this, arguments), {
+            baseCls: "bi-fl-abs-c-a",
+        });
+    },
+
+    render: function () {
+        BI.FloatAbsoluteCenterLayout.superclass.render.apply(this, arguments);
+        this.populate(this.options.items);
+    },
+
+    _addElement: function (i, item) {
+        var o = this.options;
+        var w = BI.FloatAbsoluteCenterLayout.superclass._addElement.apply(this, arguments);
+        w.element.addClass("bi-abs-c-item").css({
+            position: "absolute",
+        });
+        return w;
+    },
+
+    resize: function () {
+        // console.log("float_absolute_center_adapt布局不需要resize");
+    },
+
+    populate: function (items) {
+        BI.FloatAbsoluteCenterLayout.superclass.populate.apply(this, arguments);
+        this._mount();
+    }
+});
+BI.shortcut("bi.float_absolute_center_adapt", BI.FloatAbsoluteCenterLayout);

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

@@ -0,0 +1,64 @@
+/**
+ * absolute实现的居中布局
+ * @class BI.FloatAbsoluteHorizontalLayout
+ * @extends BI.Layout
+ */
+BI.FloatAbsoluteHorizontalLayout = BI.inherit(BI.Layout, {
+    props: function () {
+        return BI.extend(BI.FloatAbsoluteHorizontalLayout.superclass.props.apply(this, arguments), {
+            baseCls: "bi-abs-h-a",
+            horizontalAlign: BI.HorizontalAlign.Center,
+            rowSize: [],
+            vgap: 0,
+            tgap: 0,
+            bgap: 0
+        });
+    },
+
+    render: function () {
+        var self = this, o = this.options;
+        BI.FloatAbsoluteHorizontalLayout.superclass.render.apply(this, arguments);
+        return {
+            type: "bi.vtape",
+            horizontalAlign: o.horizontalAlign,
+            rowSize: o.rowSize,
+            items: this._formatItems(o.items),
+            scrollx: o.scrollx,
+            scrolly: o.scrolly,
+            scrollable: o.scrollable,
+            ref: function (_ref) {
+                self.layout = _ref;
+            },
+            hgap: "50%",
+            vgap: o.vgap,
+            lgap: o.lgap,
+            rgap: o.rgap,
+            tgap: o.tgap,
+            bgap: o.bgap
+        };
+    },
+
+    _formatItems: function (items) {
+        return BI.map(items, function (i, item) {
+            if(!item || BI.isEmptyObject(item)){
+                return item;
+            }
+            var el = BI.stripEL(item);
+            if(BI.isWidget(el)){
+                el.element.addClass("bi-abs-c-x-item");
+            } else {
+                el.cls = (el.cls || "") + "bi-abs-c-x-item";
+            }
+            return item;
+        });
+    },
+
+    resize: function () {
+        // console.log("float_absolute_horizontal_adapt布局不需要resize");
+    },
+
+    populate: function (items) {
+        this.layout.populate.apply(this, arguments);
+    }
+});
+BI.shortcut("bi.float_absolute_horizontal_adapt", BI.FloatAbsoluteHorizontalLayout);

src/core/wrapper/layout/float/float.absolute.vertical.js

@@ -0,0 +1,64 @@
+/**
+ * absolute实现的居中布局
+ * @class BI.FloatAbsoluteVerticalLayout
+ * @extends BI.Layout
+ */
+BI.FloatAbsoluteVerticalLayout = BI.inherit(BI.Layout, {
+    props: function () {
+        return BI.extend(BI.FloatAbsoluteVerticalLayout.superclass.props.apply(this, arguments), {
+            baseCls: "bi-abs-h-a",
+            verticalAlign: BI.VerticalAlign.Middle,
+            columnSize: [],
+            hgap: 0,
+            lgap: 0,
+            rgap: 0
+        });
+    },
+
+    render: function () {
+        var self = this, o = this.options;
+        BI.FloatAbsoluteVerticalLayout.superclass.render.apply(this, arguments);
+        return {
+            type: "bi.htape",
+            verticalAlign: o.verticalAlign,
+            columnSize: o.columnSize,
+            items: this._formatItems(o.items),
+            scrollx: o.scrollx,
+            scrolly: o.scrolly,
+            scrollable: o.scrollable,
+            ref: function (_ref) {
+                self.layout = _ref;
+            },
+            vgap: "50%",
+            hgap: o.hgap,
+            lgap: o.lgap,
+            rgap: o.rgap,
+            tgap: o.tgap,
+            bgap: o.bgap
+        };
+    },
+
+    _formatItems: function (items) {
+        return BI.map(items, function (i, item) {
+            if(!item || BI.isEmptyObject(item)){
+                return item;
+            }
+            var el = BI.stripEL(item);
+            if(BI.isWidget(el)){
+                el.element.addClass("bi-abs-c-y-item");
+            } else {
+                el.cls = (el.cls || "") + "bi-abs-c-y-item";
+            }
+            return item;
+        });
+    },
+
+    resize: function () {
+        // console.log("float_absolute_vertical_adapt布局不需要resize");
+    },
+
+    populate: function (items) {
+        this.layout.populate.apply(this, arguments);
+    }
+});
+BI.shortcut("bi.float_absolute_vertical_adapt", BI.FloatAbsoluteVerticalLayout);

src/less/core/wrapper/float.absolute.less

@@ -0,0 +1,27 @@
+.bi-abs-c-x-item {
+  left: 50%;
+  -ms-transform: translateX(-50%); 	/* IE 9 */
+  -moz-transform: translateX(-50%);	/* Firefox */
+  -webkit-transform: translateX(-50%); /* Safari 和 Chrome */
+  -o-transform: translateX(-50%); 	/* Opera */
+  transform: translateX(-50%);
+}
+
+.bi-abs-c-y-item {
+  top: 50%;
+  -ms-transform: translateY(-50%); 	/* IE 9 */
+  -moz-transform: translateY(-50%);	/* Firefox */
+  -webkit-transform: translateY(-50%); /* Safari 和 Chrome */
+  -o-transform: translateY(-50%); 	/* Opera */
+  transform: translateY(-50%);
+}
+
+.bi-abs-c-item {
+  top: 50%;
+  left: 50%;
+  -ms-transform: translate(-50%, -50%); 	/* IE 9 */
+  -moz-transform: translate(-50%, -50%);	/* Firefox */
+  -webkit-transform: translate(-50%, -50%); /* Safari 和 Chrome */
+  -o-transform: translate(-50%, -50%); 	/* Opera */
+  transform: translate(-50%, -50%);
+}