guy 5 years ago
parent
commit
535d82d426
  1. 241
      dist/2.0/fineui.css
  2. 354
      dist/2.0/fineui.ie.js
  3. 66
      dist/2.0/fineui.ie.min.js
  4. 354
      dist/2.0/fineui.js
  5. 2
      dist/2.0/fineui.min.css
  6. 66
      dist/2.0/fineui.min.js
  7. 241
      dist/bundle.css
  8. 354
      dist/bundle.ie.js
  9. 66
      dist/bundle.ie.min.js
  10. 354
      dist/bundle.js
  11. 2
      dist/bundle.min.css
  12. 66
      dist/bundle.min.js
  13. 241
      dist/core.css
  14. 354
      dist/core.js
  15. 241
      dist/core_without_normalize.css
  16. 241
      dist/fineui.css
  17. 354
      dist/fineui.ie.js
  18. 66
      dist/fineui.ie.min.js
  19. 354
      dist/fineui.js
  20. 2
      dist/fineui.min.css
  21. 66
      dist/fineui.min.js
  22. 330
      dist/fineui_without_jquery_polyfill.js
  23. 2
      dist/utils.min.js
  24. 24
      src/core/platform/web/config.js
  25. 6
      src/core/wrapper/layout/flex/flex.center.js
  26. 54
      src/core/wrapper/layout/flex/flex.horizontal.center.js
  27. 16
      src/core/wrapper/layout/flex/flex.horizontal.js
  28. 62
      src/core/wrapper/layout/flex/flex.vertical.center.js
  29. 75
      src/core/wrapper/layout/flex/flex.vertical.js
  30. 6
      src/core/wrapper/layout/flex/wrapper/flex.wrapper.center.js
  31. 52
      src/core/wrapper/layout/flex/wrapper/flex.wrapper.horizontal.center.js
  32. 30
      src/core/wrapper/layout/flex/wrapper/flex.wrapper.horizontal.js
  33. 80
      src/core/wrapper/layout/flex/wrapper/flex.wrapper.vertical.center.js
  34. 83
      src/core/wrapper/layout/flex/wrapper/flex.wrapper.vertical.js
  35. 241
      src/css/core/wrapper/flex.css
  36. 2
      src/less/core/wrapper/flex.center.less
  37. 45
      src/less/core/wrapper/flex.horizontal.less
  38. 76
      src/less/core/wrapper/flex.vertical.center.less
  39. 110
      src/less/core/wrapper/flex.vertical.less
  40. 4
      src/less/core/wrapper/flex.wrapper.center.less
  41. 43
      src/less/core/wrapper/flex.wrapper.horizontal.less
  42. 80
      src/less/core/wrapper/flex.wrapper.vertical.center.less
  43. 113
      src/less/core/wrapper/flex.wrapper.vertical.less

241
dist/2.0/fineui.css vendored

@ -1602,7 +1602,7 @@ textarea {
box-sizing: content-box;
/*W3C标准(IE9+,Safari5.1+,Chrome10.0+,Opera10.6+都符合box-sizing的w3c标准语法)*/
}
.bi-flex-center-layout {
.bi-flex-center-adapt-layout {
display: box;
/* OLD - Android 4.4- */
display: -webkit-box;
@ -1691,7 +1691,7 @@ textarea {
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
}
.bi-flex-horizontal-layout.middle {
.bi-flex-horizontal-layout.v-middle {
/* 09版 */
-webkit-box-align: center;
/* 12版 */
@ -1702,7 +1702,7 @@ textarea {
-o-align-items: center;
align-items: center;
}
.bi-flex-horizontal-layout.bottom {
.bi-flex-horizontal-layout.v-bottom {
/* 09版 */
-webkit-box-align: flex-end;
/* 12版 */
@ -1713,8 +1713,47 @@ textarea {
-o-align-items: flex-end;
align-items: flex-end;
}
.bi-flex-horizontal-layout.v-stretch {
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-horizontal-layout.h-stretch {
/* 09版 */
-webkit-box-orient: vertical;
/* 12版 */
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
/* 09版 */
-webkit-box-pack: center;
/* 12版 */
-webkit-justify-content: center;
-moz-justify-content: center;
-ms-justify-content: center;
-ms-flex-pack: center;
-o-justify-content: center;
justify-content: center;
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-vertical-center {
.bi-flex-vertical-layout {
display: box;
/* OLD - Android 4.4- */
display: -webkit-box;
@ -1728,13 +1767,13 @@ textarea {
display: flex;
/* NEW, Spec - Opera 12.1, Firefox 20+ */
/* 09版 */
-webkit-box-orient: horizontal;
-webkit-box-orient: vertical;
/* 12版 */
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
-o-flex-direction: row;
flex-direction: row;
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
/* 09版 */
-webkit-box-pack: flex-start;
/* 12版 */
@ -1744,6 +1783,25 @@ textarea {
-o-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
/* 09版 */
-webkit-box-align: start;
/* 12版 */
-webkit-align-items: flex-start;
-moz-align-items: flex-start;
-ms-align-items: flex-start;
-ms-flex-align: start;
-o-align-items: flex-start;
align-items: flex-start;
/* 09版 */
/*-webkit-box-lines: multiple;*/
/* 12版 */
-webkit-flex-wrap: nowrap;
-moz-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
}
.bi-flex-vertical-layout.h-center {
/* 09版 */
-webkit-box-align: center;
/* 12版 */
@ -1753,24 +1811,38 @@ textarea {
-ms-flex-align: center;
-o-align-items: center;
align-items: center;
}
.bi-flex-vertical-layout.h-right {
/* 09版 */
/*-webkit-box-lines: multiple;*/
-webkit-box-align: flex-end;
/* 12版 */
-webkit-flex-wrap: nowrap;
-moz-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-align-items: flex-end;
-moz-align-items: flex-end;
-ms-align-items: flex-end;
-ms-flex-align: end;
-o-align-items: flex-end;
align-items: flex-end;
}
.bi-flex-vertical-center.stretch {
.bi-flex-vertical-layout.h-stretch {
/* 09版 */
-webkit-box-orient: vertical;
-webkit-box-align: stretch;
/* 12版 */
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-vertical-layout.v-stretch {
/* 09版 */
-webkit-box-orient: horizontal;
/* 12版 */
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
-o-flex-direction: row;
flex-direction: row;
/* 09版 */
-webkit-box-pack: center;
/* 12版 */
@ -1791,7 +1863,7 @@ textarea {
align-items: stretch;
}
.bi-flex-wrapper-center-layout .flex-wrapper-center-layout-wrapper {
.bi-flex-wrapper-center-adapt-layout .flex-wrapper-center-adapt-layout-wrapper {
display: box;
/* OLD - Android 4.4- */
display: -webkit-box;
@ -1884,7 +1956,7 @@ textarea {
flex-wrap: nowrap;
min-height: 100%;
}
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.middle {
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.v-middle {
/* 09版 */
-webkit-box-align: center;
/* 12版 */
@ -1894,7 +1966,7 @@ textarea {
-o-align-items: center;
align-items: center;
}
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.bottom {
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.v-bottom {
/* 09版 */
-webkit-box-align: flex-end;
/* 12版 */
@ -1904,8 +1976,46 @@ textarea {
-o-align-items: flex-end;
align-items: flex-end;
}
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.v-stretch {
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.h-stretch {
/* 09版 */
-webkit-box-orient: vertical;
/* 12版 */
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
/* 09版 */
-webkit-box-pack: center;
/* 12版 */
-webkit-justify-content: center;
-moz-justify-content: center;
-ms-justify-content: center;
-ms-flex-pack: center;
-o-justify-content: center;
justify-content: center;
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-wrapper-vertical-center .flex-wrapper-vertical-center-wrapper {
.bi-flex-wrapper-vertical-layout .flex-wrapper-vertical-layout-wrapper {
display: box;
/* OLD - Android 4.4- */
display: -webkit-box;
@ -1919,13 +2029,13 @@ textarea {
display: flex;
/* NEW, Spec - Opera 12.1, Firefox 20+ */
/* 09版 */
-webkit-box-orient: horizontal;
-webkit-box-orient: vertical;
/* 12版 */
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
-o-flex-direction: row;
flex-direction: row;
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
/* 09版 */
-webkit-box-pack: flex-start;
/* 12版 */
@ -1935,6 +2045,26 @@ textarea {
-ms-flex-pack: start;
-o-justify-content: flex-start;
justify-content: flex-start;
/* 09版 */
-webkit-box-align: flex-start;
/* 12版 */
-webkit-align-items: flex-start;
-moz-align-items: flex-start;
-ms-align-items: flex-start;
-ms-flex-align: start;
-o-align-items: flex-start;
align-items: flex-start;
/* 09版 */
/*-webkit-box-lines: multiple;*/
/* 12版 */
-webkit-flex-wrap: nowrap;
-moz-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
min-width: 100%;
}
.bi-flex-wrapper-vertical-layout .flex-wrapper-vertical-layout-wrapper.h-center {
/* 09版 */
-webkit-box-align: center;
/* 12版 */
@ -1944,33 +2074,45 @@ textarea {
-ms-flex-align: center;
-o-align-items: center;
align-items: center;
}
.bi-flex-wrapper-vertical-layout .flex-wrapper-vertical-layout-wrapper.h-right {
/* 09版 */
/*-webkit-box-lines: multiple;*/
-webkit-box-align: flex-end;
/* 12版 */
-webkit-flex-wrap: nowrap;
-moz-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
min-height: 100%;
float: left;
-webkit-align-items: flex-end;
-moz-align-items: flex-end;
-ms-align-items: flex-end;
-ms-flex-align: end;
-o-align-items: flex-end;
align-items: flex-end;
}
.bi-flex-wrapper-vertical-center .flex-wrapper-vertical-center-wrapper.stretch {
width: 100%;
.bi-flex-wrapper-vertical-layout .flex-wrapper-vertical-layout-wrapper.h-stretch {
/* 09版 */
-webkit-box-orient: vertical;
-webkit-box-align: stretch;
/* 12版 */
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-wrapper-vertical-layout .flex-wrapper-vertical-layout-wrapper.v-stretch {
/* 09版 */
-webkit-box-orient: horizontal;
/* 12版 */
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
-o-flex-direction: row;
flex-direction: row;
/* 09版 */
-webkit-box-pack: center;
/* 12版 */
-webkit-justify-content: center;
-moz-justify-content: center;
-ms-justify-content: center;
-ms-flex-pack: center;
-o-justify-content: center;
justify-content: center;
/* 09版 */
@ -1979,6 +2121,7 @@ textarea {
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}

354
dist/2.0/fineui.ie.js vendored

@ -19158,12 +19158,12 @@ BI.prepares.push(function () {
BI.Plugin.registerWidget("bi.center_adapt", function (ob) {
var isIE = BI.isIE(), supportFlex = isSupportFlex(), justOneItem = (ob.items && ob.items.length <= 1);
if (!isIE && supportFlex && justOneItem) {
// 有滚动条的情况下需要用到flex_wrapper_center布局
// 有滚动条的情况下需要用到flex_wrapper_center_adapt布局
if (ob.scrollable === true || ob.scrollx === true || ob.scrolly === true) {
// 不是IE用flex_wrapper_center布局
return BI.extend(ob, {type: "bi.flex_wrapper_center"});
// 不是IE用flex_wrapper_center_adapt布局
return BI.extend(ob, {type: "bi.flex_wrapper_center_adapt"});
}
return BI.extend(ob, {type: "bi.flex_center"});
return BI.extend(ob, {type: "bi.flex_center_adapt"});
}
// 一个item的情况下inline布局睥睨天下
if(justOneItem) {
@ -19174,12 +19174,12 @@ BI.prepares.push(function () {
BI.Plugin.registerWidget("bi.vertical_adapt", function (ob) {
var isIE = BI.isIE(), supportFlex = isSupportFlex();
if (!isIE && supportFlex) {
// 有滚动条的情况下需要用到flex_wrapper_center布局
// 有滚动条的情况下需要用到flex_wrapper_center_adapt布局
if (ob.scrollable === true || ob.scrollx === true || ob.scrolly === true) {
// 不是IE用flex_wrapper_center布局
return BI.extend({}, ob, {type: "bi.flex_wrapper_vertical_center"});
// 不是IE用flex_wrapper_center_adapt布局
return BI.extend({}, ob, {type: "bi.flex_wrapper_vertical_center_adapt"});
}
return BI.extend(ob, {type: "bi.flex_vertical_center"});
return BI.extend(ob, {type: "bi.flex_vertical_center_adapt"});
}
return BI.extend(ob, {type: "bi.inline_vertical_adapt"});
});
@ -19191,12 +19191,12 @@ BI.prepares.push(function () {
});
BI.Plugin.registerWidget("bi.float_center_adapt", function (ob) {
if (!BI.isIE() && isSupportFlex()) {
// 有滚动条的情况下需要用到flex_wrapper_center布局
// 有滚动条的情况下需要用到flex_wrapper_center_adapt布局
if (ob.scrollable === true || ob.scrollx === true || ob.scrolly === true) {
// 不是IE用flex_wrapper_center布局
return BI.extend({}, ob, {type: "bi.flex_wrapper_center"});
// 不是IE用flex_wrapper_center_adapt布局
return BI.extend({}, ob, {type: "bi.flex_wrapper_center_adapt"});
}
return BI.extend(ob, {type: "bi.flex_center"});
return BI.extend(ob, {type: "bi.flex_center_adapt"});
}
return BI.extend(ob, {type: "bi.inline_center_adapt"});
});
@ -31299,7 +31299,7 @@ BI.shortcut("bi.inline_vertical_adapt", BI.InlineVerticalAdaptLayout);/**
BI.FlexCenterLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexCenterLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-center-layout"
baseCls: "bi-flex-center-adapt-layout"
});
},
render: function () {
@ -31315,7 +31315,7 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_center布局不需要resize");
// console.log("flex_center_adapt布局不需要resize");
},
populate: function (items) {
@ -31323,7 +31323,60 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
this._mount();
}
});
BI.shortcut("bi.flex_center", BI.FlexCenterLayout);/**
BI.shortcut("bi.flex_center_adapt", BI.FlexCenterLayout);/**
* Created by GUY on 2016/12/2.
*
* @class BI.FlexHorizontalCenter
* @extends BI.Layout
*/
BI.FlexHorizontalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexHorizontalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-horizontal-center-adapt-layout",
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrolly: false,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
var self = this, o = this.options;
return {
type: "bi.flex_vertical",
ref: function (_ref) {
self.wrapper = _ref;
},
horizontalAlign: BI.HorizontalAlign.Center,
verticalAlign: o.verticalAlign,
rowSize: o.rowSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
resize: function () {
// console.log("flex_vertical_center_adapt布局不需要resize");
},
populate: function (items) {
self.populate(items);
}
});
BI.shortcut("bi.flex_horizontal_adapt", BI.FlexHorizontalCenter);
BI.shortcut("bi.flex_horizontal_adapt", BI.FlexHorizontalCenter);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
@ -31335,6 +31388,7 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
return BI.extend(BI.FlexHorizontalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-horizontal-layout",
verticalAlign: BI.VerticalAlign.Top,
horizontalAlign: BI.HorizontalAlign.Left,// 如果只有一个子元素且想让该子元素横向撑满,设置成Stretch
columnSize: [],
scrollx: true,
hgap: 0,
@ -31348,14 +31402,23 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
render: function () {
BI.FlexHorizontalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.element.addClass(o.verticalAlign);
this.element.addClass("v-" + o.verticalAlign).addClass("h-" + o.horizontalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.FlexHorizontalLayout.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative", "flex-shrink": "0"});
w.element.css({
position: "relative",
"flex-shrink": "0"
});
if (o.columnSize[i] > 0) {
w.element.width(o.columnSize[i]);
}
if (o.columnSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
@ -31363,7 +31426,7 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
}
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"
"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) {
@ -31398,9 +31461,64 @@ BI.shortcut("bi.flex_horizontal", BI.FlexHorizontalLayout);/**
BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexVerticalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-vertical-center",
baseCls: "bi-flex-vertical-center-adapt-layout",
horizontalAlign: BI.HorizontalAlign.Left,
columnSize: [],
scrollx: false,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
var self = this, o = this.options;
return {
type: "bi.flex_horizontal",
ref: function (_ref) {
self.wrapper = _ref;
},
verticalAlign: BI.VerticalAlign.Middle,
horizontalAlign: o.horizontalAlign,
columnSize: o.columnSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
resize: function () {
// console.log("flex_vertical_center_adapt布局不需要resize");
},
populate: function (items) {
self.populate(items);
}
});
BI.shortcut("bi.flex_vertical_adapt", BI.FlexVerticalCenter);
BI.shortcut("bi.flex_vertical_center_adapt", BI.FlexVerticalCenter);/**
* Created by GUY on 2016/12/2.
*
* @class BI.FlexVerticalLayout
* @extends BI.Layout
*/
BI.FlexVerticalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexVerticalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-vertical-layout",
horizontalAlign: BI.HorizontalAlign.Left,
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrolly: true,
hgap: 0,
vgap: 0,
lgap: 0,
@ -31410,24 +31528,33 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
});
},
render: function () {
BI.FlexVerticalCenter.superclass.render.apply(this, arguments);
BI.FlexVerticalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.element.addClass(o.horizontalAlign);
this.element.addClass("h-" + o.horizontalAlign).addClass("v-" + o.verticalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var w = BI.FlexVerticalLayout.superclass._addElement.apply(this, arguments);
var o = this.options;
var w = BI.FlexVerticalCenter.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative", "flex-shrink": "0"});
w.element.css({
position: "relative",
"flex-shrink": "0"
});
if (o.rowSize[i] > 0) {
w.element.height(o.rowSize[i]);
}
if (o.rowSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
"margin-top": (i === 0 ? o.vgap : 0) + 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"
"margin-left": o.hgap + o.lgap + (item.lgap || 0) + (item.hgap || 0) + "px"
});
}
if (o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0) !== 0) {
@ -31444,15 +31571,15 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_vertical_center布局不需要resize");
// console.log("flex_vertical布局不需要resize");
},
populate: function (items) {
BI.FlexVerticalCenter.superclass.populate.apply(this, arguments);
BI.FlexVerticalLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.flex_vertical_center", BI.FlexVerticalCenter);/**
BI.shortcut("bi.flex_vertical", BI.FlexVerticalLayout);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
@ -31467,7 +31594,7 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
},
render: function () {
BI.FlexCenterLayout.superclass.render.apply(this, arguments);
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-center-layout-wrapper");
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-center-adapt-layout-wrapper");
this.populate(this.options.items);
},
@ -31488,7 +31615,7 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_center布局不需要resize");
// console.log("flex_center_adapt布局不需要resize");
},
populate: function (items) {
@ -31496,20 +31623,73 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
this._mount();
}
});
BI.shortcut("bi.flex_wrapper_center", BI.FlexCenterLayout);/**
BI.shortcut("bi.flex_wrapper_center_adapt", BI.FlexCenterLayout);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexVerticalCenter
* @extends BI.Layout
*/
BI.FlexWrapperHorizontalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexWrapperHorizontalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-center-adapt-layout clearfix",
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrollable: null,
scrolly: true,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
var self = this, o = this.options;
return {
type: "bi.flex_wrapper_vertical",
ref: function (_ref) {
self.wrapper = _ref;
},
horizontalAlign: BI.HorizontalAlign.Center,
verticalAlign: o.verticalAlign,
rowSize: o.rowSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
populate: function (items) {
this.wrapper.populate(items);
}
});
BI.shortcut("bi.flex_wrapper_horizontal_adapt", BI.FlexWrapperHorizontalCenter);
BI.shortcut("bi.flex_wrapper_horizontal_center_adapt", BI.FlexWrapperHorizontalCenter);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexHorizontalLayout
* @extends BI.Layout
*/
BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
BI.FlexWrapperHorizontalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexHorizontalLayout.superclass.props.apply(this, arguments), {
return BI.extend(BI.FlexWrapperHorizontalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-horizontal-layout clearfix",
verticalAlign: BI.VerticalAlign.Middle,
verticalAlign: BI.VerticalAlign.Top,
horizontalAlign: BI.HorizontalAlign.Left,
columnSize: [],
// scrollable: true,
scrollable: null,
scrollx: true,
hgap: 0,
vgap: 0,
lgap: 0,
@ -31519,16 +31699,22 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
});
},
render: function () {
BI.FlexHorizontalLayout.superclass.render.apply(this, arguments);
BI.FlexWrapperHorizontalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-horizontal-layout-wrapper " + o.verticalAlign);
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-horizontal-layout-wrapper v-" + o.verticalAlign).addClass("h-" + o.horizontalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.FlexHorizontalLayout.superclass._addElement.apply(this, arguments);
var w = BI.FlexWrapperHorizontalLayout.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative"});
if (o.columnSize[i] > 0) {
w.element.width(o.columnSize[i]);
}
if (o.columnSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
@ -31536,7 +31722,7 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
}
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"
"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) {
@ -31562,28 +31748,28 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_horizontal布局不需要resize");
// console.log("flex_wrapper_horizontal布局不需要resize");
},
populate: function (items) {
BI.FlexHorizontalLayout.superclass.populate.apply(this, arguments);
BI.FlexWrapperHorizontalLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.flex_wrapper_horizontal", BI.FlexHorizontalLayout);/**
BI.shortcut("bi.flex_wrapper_horizontal", BI.FlexWrapperHorizontalLayout);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexVerticalCenter
* @extends BI.Layout
*/
BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
BI.FlexWrapperVerticalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexVerticalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-center clearfix",
horizontalAlign: BI.HorizontalAlign.Middle,
return BI.extend(BI.FlexWrapperVerticalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-center-adapt-layout clearfix",
horizontalAlign: BI.HorizontalAlign.Left,
columnSize: [],
// scrollable: true,
scrollx: true,
hgap: 0,
vgap: 0,
lgap: 0,
@ -31593,24 +31779,82 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
});
},
render: function () {
BI.FlexVerticalCenter.superclass.render.apply(this, arguments);
var self = this, o = this.options;
return {
type: "bi.flex_wrapper_horizontal",
ref: function (_ref) {
self.wrapper = _ref;
},
verticalAlign: BI.VerticalAlign.Middle,
horizontalAlign: o.horizontalAlign,
columnSize: o.columnSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
populate: function (items) {
this.wrapper.populate(items);
}
});
BI.shortcut("bi.flex_wrapper_vertical_adapt", BI.FlexWrapperVerticalCenter);
BI.shortcut("bi.flex_wrapper_vertical_center_adapt", BI.FlexWrapperVerticalCenter);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexWrapperVerticalLayout
* @extends BI.Layout
*/
BI.FlexWrapperVerticalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexWrapperVerticalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-layout clearfix",
horizontalAlign: BI.HorizontalAlign.Left,
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrollable: null,
scrolly: true,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
BI.FlexWrapperVerticalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-vertical-center-wrapper " + o.horizontalAlign);
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-vertical-layout-wrapper h-" + o.horizontalAlign).addClass("v-" + o.verticalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.FlexVerticalCenter.superclass._addElement.apply(this, arguments);
var w = BI.FlexWrapperVerticalLayout.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative"});
if (o.rowSize[i] > 0) {
w.element.height(o.rowSize[i]);
}
if (o.rowSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
"margin-top": (i === 0 ? o.vgap : 0) + 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"
"margin-left": o.hgap + o.lgap + (item.lgap || 0) + (item.hgap || 0) + "px"
});
}
if (o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0) !== 0) {
@ -31636,15 +31880,15 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_vertical_center布局不需要resize");
// console.log("flex_wrapper_vertical布局不需要resize");
},
populate: function (items) {
BI.FlexVerticalCenter.superclass.populate.apply(this, arguments);
BI.FlexWrapperVerticalLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.flex_wrapper_vertical_center", BI.FlexVerticalCenter);/**
BI.shortcut("bi.flex_wrapper_vertical", BI.FlexWrapperVerticalLayout);/**
* 固定子组件上下左右的布局容器
* @class BI.AbsoluteLayout
* @extends BI.Layout

66
dist/2.0/fineui.ie.min.js vendored

File diff suppressed because one or more lines are too long

354
dist/2.0/fineui.js vendored

@ -19158,12 +19158,12 @@ BI.prepares.push(function () {
BI.Plugin.registerWidget("bi.center_adapt", function (ob) {
var isIE = BI.isIE(), supportFlex = isSupportFlex(), justOneItem = (ob.items && ob.items.length <= 1);
if (!isIE && supportFlex && justOneItem) {
// 有滚动条的情况下需要用到flex_wrapper_center布局
// 有滚动条的情况下需要用到flex_wrapper_center_adapt布局
if (ob.scrollable === true || ob.scrollx === true || ob.scrolly === true) {
// 不是IE用flex_wrapper_center布局
return BI.extend(ob, {type: "bi.flex_wrapper_center"});
// 不是IE用flex_wrapper_center_adapt布局
return BI.extend(ob, {type: "bi.flex_wrapper_center_adapt"});
}
return BI.extend(ob, {type: "bi.flex_center"});
return BI.extend(ob, {type: "bi.flex_center_adapt"});
}
// 一个item的情况下inline布局睥睨天下
if(justOneItem) {
@ -19174,12 +19174,12 @@ BI.prepares.push(function () {
BI.Plugin.registerWidget("bi.vertical_adapt", function (ob) {
var isIE = BI.isIE(), supportFlex = isSupportFlex();
if (!isIE && supportFlex) {
// 有滚动条的情况下需要用到flex_wrapper_center布局
// 有滚动条的情况下需要用到flex_wrapper_center_adapt布局
if (ob.scrollable === true || ob.scrollx === true || ob.scrolly === true) {
// 不是IE用flex_wrapper_center布局
return BI.extend({}, ob, {type: "bi.flex_wrapper_vertical_center"});
// 不是IE用flex_wrapper_center_adapt布局
return BI.extend({}, ob, {type: "bi.flex_wrapper_vertical_center_adapt"});
}
return BI.extend(ob, {type: "bi.flex_vertical_center"});
return BI.extend(ob, {type: "bi.flex_vertical_center_adapt"});
}
return BI.extend(ob, {type: "bi.inline_vertical_adapt"});
});
@ -19191,12 +19191,12 @@ BI.prepares.push(function () {
});
BI.Plugin.registerWidget("bi.float_center_adapt", function (ob) {
if (!BI.isIE() && isSupportFlex()) {
// 有滚动条的情况下需要用到flex_wrapper_center布局
// 有滚动条的情况下需要用到flex_wrapper_center_adapt布局
if (ob.scrollable === true || ob.scrollx === true || ob.scrolly === true) {
// 不是IE用flex_wrapper_center布局
return BI.extend({}, ob, {type: "bi.flex_wrapper_center"});
// 不是IE用flex_wrapper_center_adapt布局
return BI.extend({}, ob, {type: "bi.flex_wrapper_center_adapt"});
}
return BI.extend(ob, {type: "bi.flex_center"});
return BI.extend(ob, {type: "bi.flex_center_adapt"});
}
return BI.extend(ob, {type: "bi.inline_center_adapt"});
});
@ -31299,7 +31299,7 @@ BI.shortcut("bi.inline_vertical_adapt", BI.InlineVerticalAdaptLayout);/**
BI.FlexCenterLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexCenterLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-center-layout"
baseCls: "bi-flex-center-adapt-layout"
});
},
render: function () {
@ -31315,7 +31315,7 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_center布局不需要resize");
// console.log("flex_center_adapt布局不需要resize");
},
populate: function (items) {
@ -31323,7 +31323,60 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
this._mount();
}
});
BI.shortcut("bi.flex_center", BI.FlexCenterLayout);/**
BI.shortcut("bi.flex_center_adapt", BI.FlexCenterLayout);/**
* Created by GUY on 2016/12/2.
*
* @class BI.FlexHorizontalCenter
* @extends BI.Layout
*/
BI.FlexHorizontalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexHorizontalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-horizontal-center-adapt-layout",
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrolly: false,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
var self = this, o = this.options;
return {
type: "bi.flex_vertical",
ref: function (_ref) {
self.wrapper = _ref;
},
horizontalAlign: BI.HorizontalAlign.Center,
verticalAlign: o.verticalAlign,
rowSize: o.rowSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
resize: function () {
// console.log("flex_vertical_center_adapt布局不需要resize");
},
populate: function (items) {
self.populate(items);
}
});
BI.shortcut("bi.flex_horizontal_adapt", BI.FlexHorizontalCenter);
BI.shortcut("bi.flex_horizontal_adapt", BI.FlexHorizontalCenter);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
@ -31335,6 +31388,7 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
return BI.extend(BI.FlexHorizontalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-horizontal-layout",
verticalAlign: BI.VerticalAlign.Top,
horizontalAlign: BI.HorizontalAlign.Left,// 如果只有一个子元素且想让该子元素横向撑满,设置成Stretch
columnSize: [],
scrollx: true,
hgap: 0,
@ -31348,14 +31402,23 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
render: function () {
BI.FlexHorizontalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.element.addClass(o.verticalAlign);
this.element.addClass("v-" + o.verticalAlign).addClass("h-" + o.horizontalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.FlexHorizontalLayout.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative", "flex-shrink": "0"});
w.element.css({
position: "relative",
"flex-shrink": "0"
});
if (o.columnSize[i] > 0) {
w.element.width(o.columnSize[i]);
}
if (o.columnSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
@ -31363,7 +31426,7 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
}
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"
"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) {
@ -31398,9 +31461,64 @@ BI.shortcut("bi.flex_horizontal", BI.FlexHorizontalLayout);/**
BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexVerticalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-vertical-center",
baseCls: "bi-flex-vertical-center-adapt-layout",
horizontalAlign: BI.HorizontalAlign.Left,
columnSize: [],
scrollx: false,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
var self = this, o = this.options;
return {
type: "bi.flex_horizontal",
ref: function (_ref) {
self.wrapper = _ref;
},
verticalAlign: BI.VerticalAlign.Middle,
horizontalAlign: o.horizontalAlign,
columnSize: o.columnSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
resize: function () {
// console.log("flex_vertical_center_adapt布局不需要resize");
},
populate: function (items) {
self.populate(items);
}
});
BI.shortcut("bi.flex_vertical_adapt", BI.FlexVerticalCenter);
BI.shortcut("bi.flex_vertical_center_adapt", BI.FlexVerticalCenter);/**
* Created by GUY on 2016/12/2.
*
* @class BI.FlexVerticalLayout
* @extends BI.Layout
*/
BI.FlexVerticalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexVerticalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-vertical-layout",
horizontalAlign: BI.HorizontalAlign.Left,
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrolly: true,
hgap: 0,
vgap: 0,
lgap: 0,
@ -31410,24 +31528,33 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
});
},
render: function () {
BI.FlexVerticalCenter.superclass.render.apply(this, arguments);
BI.FlexVerticalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.element.addClass(o.horizontalAlign);
this.element.addClass("h-" + o.horizontalAlign).addClass("v-" + o.verticalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var w = BI.FlexVerticalLayout.superclass._addElement.apply(this, arguments);
var o = this.options;
var w = BI.FlexVerticalCenter.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative", "flex-shrink": "0"});
w.element.css({
position: "relative",
"flex-shrink": "0"
});
if (o.rowSize[i] > 0) {
w.element.height(o.rowSize[i]);
}
if (o.rowSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
"margin-top": (i === 0 ? o.vgap : 0) + 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"
"margin-left": o.hgap + o.lgap + (item.lgap || 0) + (item.hgap || 0) + "px"
});
}
if (o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0) !== 0) {
@ -31444,15 +31571,15 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_vertical_center布局不需要resize");
// console.log("flex_vertical布局不需要resize");
},
populate: function (items) {
BI.FlexVerticalCenter.superclass.populate.apply(this, arguments);
BI.FlexVerticalLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.flex_vertical_center", BI.FlexVerticalCenter);/**
BI.shortcut("bi.flex_vertical", BI.FlexVerticalLayout);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
@ -31467,7 +31594,7 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
},
render: function () {
BI.FlexCenterLayout.superclass.render.apply(this, arguments);
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-center-layout-wrapper");
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-center-adapt-layout-wrapper");
this.populate(this.options.items);
},
@ -31488,7 +31615,7 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_center布局不需要resize");
// console.log("flex_center_adapt布局不需要resize");
},
populate: function (items) {
@ -31496,20 +31623,73 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
this._mount();
}
});
BI.shortcut("bi.flex_wrapper_center", BI.FlexCenterLayout);/**
BI.shortcut("bi.flex_wrapper_center_adapt", BI.FlexCenterLayout);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexVerticalCenter
* @extends BI.Layout
*/
BI.FlexWrapperHorizontalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexWrapperHorizontalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-center-adapt-layout clearfix",
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrollable: null,
scrolly: true,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
var self = this, o = this.options;
return {
type: "bi.flex_wrapper_vertical",
ref: function (_ref) {
self.wrapper = _ref;
},
horizontalAlign: BI.HorizontalAlign.Center,
verticalAlign: o.verticalAlign,
rowSize: o.rowSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
populate: function (items) {
this.wrapper.populate(items);
}
});
BI.shortcut("bi.flex_wrapper_horizontal_adapt", BI.FlexWrapperHorizontalCenter);
BI.shortcut("bi.flex_wrapper_horizontal_center_adapt", BI.FlexWrapperHorizontalCenter);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexHorizontalLayout
* @extends BI.Layout
*/
BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
BI.FlexWrapperHorizontalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexHorizontalLayout.superclass.props.apply(this, arguments), {
return BI.extend(BI.FlexWrapperHorizontalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-horizontal-layout clearfix",
verticalAlign: BI.VerticalAlign.Middle,
verticalAlign: BI.VerticalAlign.Top,
horizontalAlign: BI.HorizontalAlign.Left,
columnSize: [],
// scrollable: true,
scrollable: null,
scrollx: true,
hgap: 0,
vgap: 0,
lgap: 0,
@ -31519,16 +31699,22 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
});
},
render: function () {
BI.FlexHorizontalLayout.superclass.render.apply(this, arguments);
BI.FlexWrapperHorizontalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-horizontal-layout-wrapper " + o.verticalAlign);
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-horizontal-layout-wrapper v-" + o.verticalAlign).addClass("h-" + o.horizontalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.FlexHorizontalLayout.superclass._addElement.apply(this, arguments);
var w = BI.FlexWrapperHorizontalLayout.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative"});
if (o.columnSize[i] > 0) {
w.element.width(o.columnSize[i]);
}
if (o.columnSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
@ -31536,7 +31722,7 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
}
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"
"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) {
@ -31562,28 +31748,28 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_horizontal布局不需要resize");
// console.log("flex_wrapper_horizontal布局不需要resize");
},
populate: function (items) {
BI.FlexHorizontalLayout.superclass.populate.apply(this, arguments);
BI.FlexWrapperHorizontalLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.flex_wrapper_horizontal", BI.FlexHorizontalLayout);/**
BI.shortcut("bi.flex_wrapper_horizontal", BI.FlexWrapperHorizontalLayout);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexVerticalCenter
* @extends BI.Layout
*/
BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
BI.FlexWrapperVerticalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexVerticalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-center clearfix",
horizontalAlign: BI.HorizontalAlign.Middle,
return BI.extend(BI.FlexWrapperVerticalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-center-adapt-layout clearfix",
horizontalAlign: BI.HorizontalAlign.Left,
columnSize: [],
// scrollable: true,
scrollx: true,
hgap: 0,
vgap: 0,
lgap: 0,
@ -31593,24 +31779,82 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
});
},
render: function () {
BI.FlexVerticalCenter.superclass.render.apply(this, arguments);
var self = this, o = this.options;
return {
type: "bi.flex_wrapper_horizontal",
ref: function (_ref) {
self.wrapper = _ref;
},
verticalAlign: BI.VerticalAlign.Middle,
horizontalAlign: o.horizontalAlign,
columnSize: o.columnSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
populate: function (items) {
this.wrapper.populate(items);
}
});
BI.shortcut("bi.flex_wrapper_vertical_adapt", BI.FlexWrapperVerticalCenter);
BI.shortcut("bi.flex_wrapper_vertical_center_adapt", BI.FlexWrapperVerticalCenter);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexWrapperVerticalLayout
* @extends BI.Layout
*/
BI.FlexWrapperVerticalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexWrapperVerticalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-layout clearfix",
horizontalAlign: BI.HorizontalAlign.Left,
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrollable: null,
scrolly: true,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
BI.FlexWrapperVerticalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-vertical-center-wrapper " + o.horizontalAlign);
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-vertical-layout-wrapper h-" + o.horizontalAlign).addClass("v-" + o.verticalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.FlexVerticalCenter.superclass._addElement.apply(this, arguments);
var w = BI.FlexWrapperVerticalLayout.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative"});
if (o.rowSize[i] > 0) {
w.element.height(o.rowSize[i]);
}
if (o.rowSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
"margin-top": (i === 0 ? o.vgap : 0) + 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"
"margin-left": o.hgap + o.lgap + (item.lgap || 0) + (item.hgap || 0) + "px"
});
}
if (o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0) !== 0) {
@ -31636,15 +31880,15 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_vertical_center布局不需要resize");
// console.log("flex_wrapper_vertical布局不需要resize");
},
populate: function (items) {
BI.FlexVerticalCenter.superclass.populate.apply(this, arguments);
BI.FlexWrapperVerticalLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.flex_wrapper_vertical_center", BI.FlexVerticalCenter);/**
BI.shortcut("bi.flex_wrapper_vertical", BI.FlexWrapperVerticalLayout);/**
* 固定子组件上下左右的布局容器
* @class BI.AbsoluteLayout
* @extends BI.Layout

2
dist/2.0/fineui.min.css vendored

File diff suppressed because one or more lines are too long

66
dist/2.0/fineui.min.js vendored

File diff suppressed because one or more lines are too long

241
dist/bundle.css vendored

@ -1602,7 +1602,7 @@ textarea {
box-sizing: content-box;
/*W3C标准(IE9+,Safari5.1+,Chrome10.0+,Opera10.6+都符合box-sizing的w3c标准语法)*/
}
.bi-flex-center-layout {
.bi-flex-center-adapt-layout {
display: box;
/* OLD - Android 4.4- */
display: -webkit-box;
@ -1691,7 +1691,7 @@ textarea {
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
}
.bi-flex-horizontal-layout.middle {
.bi-flex-horizontal-layout.v-middle {
/* 09版 */
-webkit-box-align: center;
/* 12版 */
@ -1702,7 +1702,7 @@ textarea {
-o-align-items: center;
align-items: center;
}
.bi-flex-horizontal-layout.bottom {
.bi-flex-horizontal-layout.v-bottom {
/* 09版 */
-webkit-box-align: flex-end;
/* 12版 */
@ -1713,8 +1713,47 @@ textarea {
-o-align-items: flex-end;
align-items: flex-end;
}
.bi-flex-horizontal-layout.v-stretch {
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-horizontal-layout.h-stretch {
/* 09版 */
-webkit-box-orient: vertical;
/* 12版 */
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
/* 09版 */
-webkit-box-pack: center;
/* 12版 */
-webkit-justify-content: center;
-moz-justify-content: center;
-ms-justify-content: center;
-ms-flex-pack: center;
-o-justify-content: center;
justify-content: center;
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-vertical-center {
.bi-flex-vertical-layout {
display: box;
/* OLD - Android 4.4- */
display: -webkit-box;
@ -1728,13 +1767,13 @@ textarea {
display: flex;
/* NEW, Spec - Opera 12.1, Firefox 20+ */
/* 09版 */
-webkit-box-orient: horizontal;
-webkit-box-orient: vertical;
/* 12版 */
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
-o-flex-direction: row;
flex-direction: row;
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
/* 09版 */
-webkit-box-pack: flex-start;
/* 12版 */
@ -1744,6 +1783,25 @@ textarea {
-o-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
/* 09版 */
-webkit-box-align: start;
/* 12版 */
-webkit-align-items: flex-start;
-moz-align-items: flex-start;
-ms-align-items: flex-start;
-ms-flex-align: start;
-o-align-items: flex-start;
align-items: flex-start;
/* 09版 */
/*-webkit-box-lines: multiple;*/
/* 12版 */
-webkit-flex-wrap: nowrap;
-moz-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
}
.bi-flex-vertical-layout.h-center {
/* 09版 */
-webkit-box-align: center;
/* 12版 */
@ -1753,24 +1811,38 @@ textarea {
-ms-flex-align: center;
-o-align-items: center;
align-items: center;
}
.bi-flex-vertical-layout.h-right {
/* 09版 */
/*-webkit-box-lines: multiple;*/
-webkit-box-align: flex-end;
/* 12版 */
-webkit-flex-wrap: nowrap;
-moz-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-align-items: flex-end;
-moz-align-items: flex-end;
-ms-align-items: flex-end;
-ms-flex-align: end;
-o-align-items: flex-end;
align-items: flex-end;
}
.bi-flex-vertical-center.stretch {
.bi-flex-vertical-layout.h-stretch {
/* 09版 */
-webkit-box-orient: vertical;
-webkit-box-align: stretch;
/* 12版 */
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-vertical-layout.v-stretch {
/* 09版 */
-webkit-box-orient: horizontal;
/* 12版 */
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
-o-flex-direction: row;
flex-direction: row;
/* 09版 */
-webkit-box-pack: center;
/* 12版 */
@ -1791,7 +1863,7 @@ textarea {
align-items: stretch;
}
.bi-flex-wrapper-center-layout .flex-wrapper-center-layout-wrapper {
.bi-flex-wrapper-center-adapt-layout .flex-wrapper-center-adapt-layout-wrapper {
display: box;
/* OLD - Android 4.4- */
display: -webkit-box;
@ -1884,7 +1956,7 @@ textarea {
flex-wrap: nowrap;
min-height: 100%;
}
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.middle {
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.v-middle {
/* 09版 */
-webkit-box-align: center;
/* 12版 */
@ -1894,7 +1966,7 @@ textarea {
-o-align-items: center;
align-items: center;
}
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.bottom {
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.v-bottom {
/* 09版 */
-webkit-box-align: flex-end;
/* 12版 */
@ -1904,8 +1976,46 @@ textarea {
-o-align-items: flex-end;
align-items: flex-end;
}
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.v-stretch {
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.h-stretch {
/* 09版 */
-webkit-box-orient: vertical;
/* 12版 */
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
/* 09版 */
-webkit-box-pack: center;
/* 12版 */
-webkit-justify-content: center;
-moz-justify-content: center;
-ms-justify-content: center;
-ms-flex-pack: center;
-o-justify-content: center;
justify-content: center;
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-wrapper-vertical-center .flex-wrapper-vertical-center-wrapper {
.bi-flex-wrapper-vertical-layout .flex-wrapper-vertical-layout-wrapper {
display: box;
/* OLD - Android 4.4- */
display: -webkit-box;
@ -1919,13 +2029,13 @@ textarea {
display: flex;
/* NEW, Spec - Opera 12.1, Firefox 20+ */
/* 09版 */
-webkit-box-orient: horizontal;
-webkit-box-orient: vertical;
/* 12版 */
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
-o-flex-direction: row;
flex-direction: row;
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
/* 09版 */
-webkit-box-pack: flex-start;
/* 12版 */
@ -1935,6 +2045,26 @@ textarea {
-ms-flex-pack: start;
-o-justify-content: flex-start;
justify-content: flex-start;
/* 09版 */
-webkit-box-align: flex-start;
/* 12版 */
-webkit-align-items: flex-start;
-moz-align-items: flex-start;
-ms-align-items: flex-start;
-ms-flex-align: start;
-o-align-items: flex-start;
align-items: flex-start;
/* 09版 */
/*-webkit-box-lines: multiple;*/
/* 12版 */
-webkit-flex-wrap: nowrap;
-moz-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
min-width: 100%;
}
.bi-flex-wrapper-vertical-layout .flex-wrapper-vertical-layout-wrapper.h-center {
/* 09版 */
-webkit-box-align: center;
/* 12版 */
@ -1944,33 +2074,45 @@ textarea {
-ms-flex-align: center;
-o-align-items: center;
align-items: center;
}
.bi-flex-wrapper-vertical-layout .flex-wrapper-vertical-layout-wrapper.h-right {
/* 09版 */
/*-webkit-box-lines: multiple;*/
-webkit-box-align: flex-end;
/* 12版 */
-webkit-flex-wrap: nowrap;
-moz-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
min-height: 100%;
float: left;
-webkit-align-items: flex-end;
-moz-align-items: flex-end;
-ms-align-items: flex-end;
-ms-flex-align: end;
-o-align-items: flex-end;
align-items: flex-end;
}
.bi-flex-wrapper-vertical-center .flex-wrapper-vertical-center-wrapper.stretch {
width: 100%;
.bi-flex-wrapper-vertical-layout .flex-wrapper-vertical-layout-wrapper.h-stretch {
/* 09版 */
-webkit-box-orient: vertical;
-webkit-box-align: stretch;
/* 12版 */
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-wrapper-vertical-layout .flex-wrapper-vertical-layout-wrapper.v-stretch {
/* 09版 */
-webkit-box-orient: horizontal;
/* 12版 */
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
-o-flex-direction: row;
flex-direction: row;
/* 09版 */
-webkit-box-pack: center;
/* 12版 */
-webkit-justify-content: center;
-moz-justify-content: center;
-ms-justify-content: center;
-ms-flex-pack: center;
-o-justify-content: center;
justify-content: center;
/* 09版 */
@ -1979,6 +2121,7 @@ textarea {
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}

354
dist/bundle.ie.js vendored

@ -19158,12 +19158,12 @@ BI.prepares.push(function () {
BI.Plugin.registerWidget("bi.center_adapt", function (ob) {
var isIE = BI.isIE(), supportFlex = isSupportFlex(), justOneItem = (ob.items && ob.items.length <= 1);
if (!isIE && supportFlex && justOneItem) {
// 有滚动条的情况下需要用到flex_wrapper_center布局
// 有滚动条的情况下需要用到flex_wrapper_center_adapt布局
if (ob.scrollable === true || ob.scrollx === true || ob.scrolly === true) {
// 不是IE用flex_wrapper_center布局
return BI.extend(ob, {type: "bi.flex_wrapper_center"});
// 不是IE用flex_wrapper_center_adapt布局
return BI.extend(ob, {type: "bi.flex_wrapper_center_adapt"});
}
return BI.extend(ob, {type: "bi.flex_center"});
return BI.extend(ob, {type: "bi.flex_center_adapt"});
}
// 一个item的情况下inline布局睥睨天下
if(justOneItem) {
@ -19174,12 +19174,12 @@ BI.prepares.push(function () {
BI.Plugin.registerWidget("bi.vertical_adapt", function (ob) {
var isIE = BI.isIE(), supportFlex = isSupportFlex();
if (!isIE && supportFlex) {
// 有滚动条的情况下需要用到flex_wrapper_center布局
// 有滚动条的情况下需要用到flex_wrapper_center_adapt布局
if (ob.scrollable === true || ob.scrollx === true || ob.scrolly === true) {
// 不是IE用flex_wrapper_center布局
return BI.extend({}, ob, {type: "bi.flex_wrapper_vertical_center"});
// 不是IE用flex_wrapper_center_adapt布局
return BI.extend({}, ob, {type: "bi.flex_wrapper_vertical_center_adapt"});
}
return BI.extend(ob, {type: "bi.flex_vertical_center"});
return BI.extend(ob, {type: "bi.flex_vertical_center_adapt"});
}
return BI.extend(ob, {type: "bi.inline_vertical_adapt"});
});
@ -19191,12 +19191,12 @@ BI.prepares.push(function () {
});
BI.Plugin.registerWidget("bi.float_center_adapt", function (ob) {
if (!BI.isIE() && isSupportFlex()) {
// 有滚动条的情况下需要用到flex_wrapper_center布局
// 有滚动条的情况下需要用到flex_wrapper_center_adapt布局
if (ob.scrollable === true || ob.scrollx === true || ob.scrolly === true) {
// 不是IE用flex_wrapper_center布局
return BI.extend({}, ob, {type: "bi.flex_wrapper_center"});
// 不是IE用flex_wrapper_center_adapt布局
return BI.extend({}, ob, {type: "bi.flex_wrapper_center_adapt"});
}
return BI.extend(ob, {type: "bi.flex_center"});
return BI.extend(ob, {type: "bi.flex_center_adapt"});
}
return BI.extend(ob, {type: "bi.inline_center_adapt"});
});
@ -31299,7 +31299,7 @@ BI.shortcut("bi.inline_vertical_adapt", BI.InlineVerticalAdaptLayout);/**
BI.FlexCenterLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexCenterLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-center-layout"
baseCls: "bi-flex-center-adapt-layout"
});
},
render: function () {
@ -31315,7 +31315,7 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_center布局不需要resize");
// console.log("flex_center_adapt布局不需要resize");
},
populate: function (items) {
@ -31323,7 +31323,60 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
this._mount();
}
});
BI.shortcut("bi.flex_center", BI.FlexCenterLayout);/**
BI.shortcut("bi.flex_center_adapt", BI.FlexCenterLayout);/**
* Created by GUY on 2016/12/2.
*
* @class BI.FlexHorizontalCenter
* @extends BI.Layout
*/
BI.FlexHorizontalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexHorizontalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-horizontal-center-adapt-layout",
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrolly: false,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
var self = this, o = this.options;
return {
type: "bi.flex_vertical",
ref: function (_ref) {
self.wrapper = _ref;
},
horizontalAlign: BI.HorizontalAlign.Center,
verticalAlign: o.verticalAlign,
rowSize: o.rowSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
resize: function () {
// console.log("flex_vertical_center_adapt布局不需要resize");
},
populate: function (items) {
self.populate(items);
}
});
BI.shortcut("bi.flex_horizontal_adapt", BI.FlexHorizontalCenter);
BI.shortcut("bi.flex_horizontal_adapt", BI.FlexHorizontalCenter);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
@ -31335,6 +31388,7 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
return BI.extend(BI.FlexHorizontalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-horizontal-layout",
verticalAlign: BI.VerticalAlign.Top,
horizontalAlign: BI.HorizontalAlign.Left,// 如果只有一个子元素且想让该子元素横向撑满,设置成Stretch
columnSize: [],
scrollx: true,
hgap: 0,
@ -31348,14 +31402,23 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
render: function () {
BI.FlexHorizontalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.element.addClass(o.verticalAlign);
this.element.addClass("v-" + o.verticalAlign).addClass("h-" + o.horizontalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.FlexHorizontalLayout.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative", "flex-shrink": "0"});
w.element.css({
position: "relative",
"flex-shrink": "0"
});
if (o.columnSize[i] > 0) {
w.element.width(o.columnSize[i]);
}
if (o.columnSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
@ -31363,7 +31426,7 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
}
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"
"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) {
@ -31398,9 +31461,64 @@ BI.shortcut("bi.flex_horizontal", BI.FlexHorizontalLayout);/**
BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexVerticalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-vertical-center",
baseCls: "bi-flex-vertical-center-adapt-layout",
horizontalAlign: BI.HorizontalAlign.Left,
columnSize: [],
scrollx: false,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
var self = this, o = this.options;
return {
type: "bi.flex_horizontal",
ref: function (_ref) {
self.wrapper = _ref;
},
verticalAlign: BI.VerticalAlign.Middle,
horizontalAlign: o.horizontalAlign,
columnSize: o.columnSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
resize: function () {
// console.log("flex_vertical_center_adapt布局不需要resize");
},
populate: function (items) {
self.populate(items);
}
});
BI.shortcut("bi.flex_vertical_adapt", BI.FlexVerticalCenter);
BI.shortcut("bi.flex_vertical_center_adapt", BI.FlexVerticalCenter);/**
* Created by GUY on 2016/12/2.
*
* @class BI.FlexVerticalLayout
* @extends BI.Layout
*/
BI.FlexVerticalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexVerticalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-vertical-layout",
horizontalAlign: BI.HorizontalAlign.Left,
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrolly: true,
hgap: 0,
vgap: 0,
lgap: 0,
@ -31410,24 +31528,33 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
});
},
render: function () {
BI.FlexVerticalCenter.superclass.render.apply(this, arguments);
BI.FlexVerticalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.element.addClass(o.horizontalAlign);
this.element.addClass("h-" + o.horizontalAlign).addClass("v-" + o.verticalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var w = BI.FlexVerticalLayout.superclass._addElement.apply(this, arguments);
var o = this.options;
var w = BI.FlexVerticalCenter.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative", "flex-shrink": "0"});
w.element.css({
position: "relative",
"flex-shrink": "0"
});
if (o.rowSize[i] > 0) {
w.element.height(o.rowSize[i]);
}
if (o.rowSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
"margin-top": (i === 0 ? o.vgap : 0) + 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"
"margin-left": o.hgap + o.lgap + (item.lgap || 0) + (item.hgap || 0) + "px"
});
}
if (o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0) !== 0) {
@ -31444,15 +31571,15 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_vertical_center布局不需要resize");
// console.log("flex_vertical布局不需要resize");
},
populate: function (items) {
BI.FlexVerticalCenter.superclass.populate.apply(this, arguments);
BI.FlexVerticalLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.flex_vertical_center", BI.FlexVerticalCenter);/**
BI.shortcut("bi.flex_vertical", BI.FlexVerticalLayout);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
@ -31467,7 +31594,7 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
},
render: function () {
BI.FlexCenterLayout.superclass.render.apply(this, arguments);
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-center-layout-wrapper");
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-center-adapt-layout-wrapper");
this.populate(this.options.items);
},
@ -31488,7 +31615,7 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_center布局不需要resize");
// console.log("flex_center_adapt布局不需要resize");
},
populate: function (items) {
@ -31496,20 +31623,73 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
this._mount();
}
});
BI.shortcut("bi.flex_wrapper_center", BI.FlexCenterLayout);/**
BI.shortcut("bi.flex_wrapper_center_adapt", BI.FlexCenterLayout);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexVerticalCenter
* @extends BI.Layout
*/
BI.FlexWrapperHorizontalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexWrapperHorizontalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-center-adapt-layout clearfix",
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrollable: null,
scrolly: true,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
var self = this, o = this.options;
return {
type: "bi.flex_wrapper_vertical",
ref: function (_ref) {
self.wrapper = _ref;
},
horizontalAlign: BI.HorizontalAlign.Center,
verticalAlign: o.verticalAlign,
rowSize: o.rowSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
populate: function (items) {
this.wrapper.populate(items);
}
});
BI.shortcut("bi.flex_wrapper_horizontal_adapt", BI.FlexWrapperHorizontalCenter);
BI.shortcut("bi.flex_wrapper_horizontal_center_adapt", BI.FlexWrapperHorizontalCenter);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexHorizontalLayout
* @extends BI.Layout
*/
BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
BI.FlexWrapperHorizontalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexHorizontalLayout.superclass.props.apply(this, arguments), {
return BI.extend(BI.FlexWrapperHorizontalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-horizontal-layout clearfix",
verticalAlign: BI.VerticalAlign.Middle,
verticalAlign: BI.VerticalAlign.Top,
horizontalAlign: BI.HorizontalAlign.Left,
columnSize: [],
// scrollable: true,
scrollable: null,
scrollx: true,
hgap: 0,
vgap: 0,
lgap: 0,
@ -31519,16 +31699,22 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
});
},
render: function () {
BI.FlexHorizontalLayout.superclass.render.apply(this, arguments);
BI.FlexWrapperHorizontalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-horizontal-layout-wrapper " + o.verticalAlign);
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-horizontal-layout-wrapper v-" + o.verticalAlign).addClass("h-" + o.horizontalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.FlexHorizontalLayout.superclass._addElement.apply(this, arguments);
var w = BI.FlexWrapperHorizontalLayout.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative"});
if (o.columnSize[i] > 0) {
w.element.width(o.columnSize[i]);
}
if (o.columnSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
@ -31536,7 +31722,7 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
}
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"
"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) {
@ -31562,28 +31748,28 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_horizontal布局不需要resize");
// console.log("flex_wrapper_horizontal布局不需要resize");
},
populate: function (items) {
BI.FlexHorizontalLayout.superclass.populate.apply(this, arguments);
BI.FlexWrapperHorizontalLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.flex_wrapper_horizontal", BI.FlexHorizontalLayout);/**
BI.shortcut("bi.flex_wrapper_horizontal", BI.FlexWrapperHorizontalLayout);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexVerticalCenter
* @extends BI.Layout
*/
BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
BI.FlexWrapperVerticalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexVerticalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-center clearfix",
horizontalAlign: BI.HorizontalAlign.Middle,
return BI.extend(BI.FlexWrapperVerticalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-center-adapt-layout clearfix",
horizontalAlign: BI.HorizontalAlign.Left,
columnSize: [],
// scrollable: true,
scrollx: true,
hgap: 0,
vgap: 0,
lgap: 0,
@ -31593,24 +31779,82 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
});
},
render: function () {
BI.FlexVerticalCenter.superclass.render.apply(this, arguments);
var self = this, o = this.options;
return {
type: "bi.flex_wrapper_horizontal",
ref: function (_ref) {
self.wrapper = _ref;
},
verticalAlign: BI.VerticalAlign.Middle,
horizontalAlign: o.horizontalAlign,
columnSize: o.columnSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
populate: function (items) {
this.wrapper.populate(items);
}
});
BI.shortcut("bi.flex_wrapper_vertical_adapt", BI.FlexWrapperVerticalCenter);
BI.shortcut("bi.flex_wrapper_vertical_center_adapt", BI.FlexWrapperVerticalCenter);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexWrapperVerticalLayout
* @extends BI.Layout
*/
BI.FlexWrapperVerticalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexWrapperVerticalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-layout clearfix",
horizontalAlign: BI.HorizontalAlign.Left,
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrollable: null,
scrolly: true,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
BI.FlexWrapperVerticalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-vertical-center-wrapper " + o.horizontalAlign);
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-vertical-layout-wrapper h-" + o.horizontalAlign).addClass("v-" + o.verticalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.FlexVerticalCenter.superclass._addElement.apply(this, arguments);
var w = BI.FlexWrapperVerticalLayout.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative"});
if (o.rowSize[i] > 0) {
w.element.height(o.rowSize[i]);
}
if (o.rowSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
"margin-top": (i === 0 ? o.vgap : 0) + 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"
"margin-left": o.hgap + o.lgap + (item.lgap || 0) + (item.hgap || 0) + "px"
});
}
if (o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0) !== 0) {
@ -31636,15 +31880,15 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_vertical_center布局不需要resize");
// console.log("flex_wrapper_vertical布局不需要resize");
},
populate: function (items) {
BI.FlexVerticalCenter.superclass.populate.apply(this, arguments);
BI.FlexWrapperVerticalLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.flex_wrapper_vertical_center", BI.FlexVerticalCenter);/**
BI.shortcut("bi.flex_wrapper_vertical", BI.FlexWrapperVerticalLayout);/**
* 固定子组件上下左右的布局容器
* @class BI.AbsoluteLayout
* @extends BI.Layout

66
dist/bundle.ie.min.js vendored

File diff suppressed because one or more lines are too long

354
dist/bundle.js vendored

@ -19158,12 +19158,12 @@ BI.prepares.push(function () {
BI.Plugin.registerWidget("bi.center_adapt", function (ob) {
var isIE = BI.isIE(), supportFlex = isSupportFlex(), justOneItem = (ob.items && ob.items.length <= 1);
if (!isIE && supportFlex && justOneItem) {
// 有滚动条的情况下需要用到flex_wrapper_center布局
// 有滚动条的情况下需要用到flex_wrapper_center_adapt布局
if (ob.scrollable === true || ob.scrollx === true || ob.scrolly === true) {
// 不是IE用flex_wrapper_center布局
return BI.extend(ob, {type: "bi.flex_wrapper_center"});
// 不是IE用flex_wrapper_center_adapt布局
return BI.extend(ob, {type: "bi.flex_wrapper_center_adapt"});
}
return BI.extend(ob, {type: "bi.flex_center"});
return BI.extend(ob, {type: "bi.flex_center_adapt"});
}
// 一个item的情况下inline布局睥睨天下
if(justOneItem) {
@ -19174,12 +19174,12 @@ BI.prepares.push(function () {
BI.Plugin.registerWidget("bi.vertical_adapt", function (ob) {
var isIE = BI.isIE(), supportFlex = isSupportFlex();
if (!isIE && supportFlex) {
// 有滚动条的情况下需要用到flex_wrapper_center布局
// 有滚动条的情况下需要用到flex_wrapper_center_adapt布局
if (ob.scrollable === true || ob.scrollx === true || ob.scrolly === true) {
// 不是IE用flex_wrapper_center布局
return BI.extend({}, ob, {type: "bi.flex_wrapper_vertical_center"});
// 不是IE用flex_wrapper_center_adapt布局
return BI.extend({}, ob, {type: "bi.flex_wrapper_vertical_center_adapt"});
}
return BI.extend(ob, {type: "bi.flex_vertical_center"});
return BI.extend(ob, {type: "bi.flex_vertical_center_adapt"});
}
return BI.extend(ob, {type: "bi.inline_vertical_adapt"});
});
@ -19191,12 +19191,12 @@ BI.prepares.push(function () {
});
BI.Plugin.registerWidget("bi.float_center_adapt", function (ob) {
if (!BI.isIE() && isSupportFlex()) {
// 有滚动条的情况下需要用到flex_wrapper_center布局
// 有滚动条的情况下需要用到flex_wrapper_center_adapt布局
if (ob.scrollable === true || ob.scrollx === true || ob.scrolly === true) {
// 不是IE用flex_wrapper_center布局
return BI.extend({}, ob, {type: "bi.flex_wrapper_center"});
// 不是IE用flex_wrapper_center_adapt布局
return BI.extend({}, ob, {type: "bi.flex_wrapper_center_adapt"});
}
return BI.extend(ob, {type: "bi.flex_center"});
return BI.extend(ob, {type: "bi.flex_center_adapt"});
}
return BI.extend(ob, {type: "bi.inline_center_adapt"});
});
@ -31299,7 +31299,7 @@ BI.shortcut("bi.inline_vertical_adapt", BI.InlineVerticalAdaptLayout);/**
BI.FlexCenterLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexCenterLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-center-layout"
baseCls: "bi-flex-center-adapt-layout"
});
},
render: function () {
@ -31315,7 +31315,7 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_center布局不需要resize");
// console.log("flex_center_adapt布局不需要resize");
},
populate: function (items) {
@ -31323,7 +31323,60 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
this._mount();
}
});
BI.shortcut("bi.flex_center", BI.FlexCenterLayout);/**
BI.shortcut("bi.flex_center_adapt", BI.FlexCenterLayout);/**
* Created by GUY on 2016/12/2.
*
* @class BI.FlexHorizontalCenter
* @extends BI.Layout
*/
BI.FlexHorizontalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexHorizontalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-horizontal-center-adapt-layout",
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrolly: false,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
var self = this, o = this.options;
return {
type: "bi.flex_vertical",
ref: function (_ref) {
self.wrapper = _ref;
},
horizontalAlign: BI.HorizontalAlign.Center,
verticalAlign: o.verticalAlign,
rowSize: o.rowSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
resize: function () {
// console.log("flex_vertical_center_adapt布局不需要resize");
},
populate: function (items) {
self.populate(items);
}
});
BI.shortcut("bi.flex_horizontal_adapt", BI.FlexHorizontalCenter);
BI.shortcut("bi.flex_horizontal_adapt", BI.FlexHorizontalCenter);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
@ -31335,6 +31388,7 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
return BI.extend(BI.FlexHorizontalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-horizontal-layout",
verticalAlign: BI.VerticalAlign.Top,
horizontalAlign: BI.HorizontalAlign.Left,// 如果只有一个子元素且想让该子元素横向撑满,设置成Stretch
columnSize: [],
scrollx: true,
hgap: 0,
@ -31348,14 +31402,23 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
render: function () {
BI.FlexHorizontalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.element.addClass(o.verticalAlign);
this.element.addClass("v-" + o.verticalAlign).addClass("h-" + o.horizontalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.FlexHorizontalLayout.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative", "flex-shrink": "0"});
w.element.css({
position: "relative",
"flex-shrink": "0"
});
if (o.columnSize[i] > 0) {
w.element.width(o.columnSize[i]);
}
if (o.columnSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
@ -31363,7 +31426,7 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
}
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"
"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) {
@ -31398,9 +31461,64 @@ BI.shortcut("bi.flex_horizontal", BI.FlexHorizontalLayout);/**
BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexVerticalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-vertical-center",
baseCls: "bi-flex-vertical-center-adapt-layout",
horizontalAlign: BI.HorizontalAlign.Left,
columnSize: [],
scrollx: false,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
var self = this, o = this.options;
return {
type: "bi.flex_horizontal",
ref: function (_ref) {
self.wrapper = _ref;
},
verticalAlign: BI.VerticalAlign.Middle,
horizontalAlign: o.horizontalAlign,
columnSize: o.columnSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
resize: function () {
// console.log("flex_vertical_center_adapt布局不需要resize");
},
populate: function (items) {
self.populate(items);
}
});
BI.shortcut("bi.flex_vertical_adapt", BI.FlexVerticalCenter);
BI.shortcut("bi.flex_vertical_center_adapt", BI.FlexVerticalCenter);/**
* Created by GUY on 2016/12/2.
*
* @class BI.FlexVerticalLayout
* @extends BI.Layout
*/
BI.FlexVerticalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexVerticalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-vertical-layout",
horizontalAlign: BI.HorizontalAlign.Left,
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrolly: true,
hgap: 0,
vgap: 0,
lgap: 0,
@ -31410,24 +31528,33 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
});
},
render: function () {
BI.FlexVerticalCenter.superclass.render.apply(this, arguments);
BI.FlexVerticalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.element.addClass(o.horizontalAlign);
this.element.addClass("h-" + o.horizontalAlign).addClass("v-" + o.verticalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var w = BI.FlexVerticalLayout.superclass._addElement.apply(this, arguments);
var o = this.options;
var w = BI.FlexVerticalCenter.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative", "flex-shrink": "0"});
w.element.css({
position: "relative",
"flex-shrink": "0"
});
if (o.rowSize[i] > 0) {
w.element.height(o.rowSize[i]);
}
if (o.rowSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
"margin-top": (i === 0 ? o.vgap : 0) + 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"
"margin-left": o.hgap + o.lgap + (item.lgap || 0) + (item.hgap || 0) + "px"
});
}
if (o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0) !== 0) {
@ -31444,15 +31571,15 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_vertical_center布局不需要resize");
// console.log("flex_vertical布局不需要resize");
},
populate: function (items) {
BI.FlexVerticalCenter.superclass.populate.apply(this, arguments);
BI.FlexVerticalLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.flex_vertical_center", BI.FlexVerticalCenter);/**
BI.shortcut("bi.flex_vertical", BI.FlexVerticalLayout);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
@ -31467,7 +31594,7 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
},
render: function () {
BI.FlexCenterLayout.superclass.render.apply(this, arguments);
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-center-layout-wrapper");
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-center-adapt-layout-wrapper");
this.populate(this.options.items);
},
@ -31488,7 +31615,7 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_center布局不需要resize");
// console.log("flex_center_adapt布局不需要resize");
},
populate: function (items) {
@ -31496,20 +31623,73 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
this._mount();
}
});
BI.shortcut("bi.flex_wrapper_center", BI.FlexCenterLayout);/**
BI.shortcut("bi.flex_wrapper_center_adapt", BI.FlexCenterLayout);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexVerticalCenter
* @extends BI.Layout
*/
BI.FlexWrapperHorizontalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexWrapperHorizontalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-center-adapt-layout clearfix",
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrollable: null,
scrolly: true,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
var self = this, o = this.options;
return {
type: "bi.flex_wrapper_vertical",
ref: function (_ref) {
self.wrapper = _ref;
},
horizontalAlign: BI.HorizontalAlign.Center,
verticalAlign: o.verticalAlign,
rowSize: o.rowSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
populate: function (items) {
this.wrapper.populate(items);
}
});
BI.shortcut("bi.flex_wrapper_horizontal_adapt", BI.FlexWrapperHorizontalCenter);
BI.shortcut("bi.flex_wrapper_horizontal_center_adapt", BI.FlexWrapperHorizontalCenter);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexHorizontalLayout
* @extends BI.Layout
*/
BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
BI.FlexWrapperHorizontalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexHorizontalLayout.superclass.props.apply(this, arguments), {
return BI.extend(BI.FlexWrapperHorizontalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-horizontal-layout clearfix",
verticalAlign: BI.VerticalAlign.Middle,
verticalAlign: BI.VerticalAlign.Top,
horizontalAlign: BI.HorizontalAlign.Left,
columnSize: [],
// scrollable: true,
scrollable: null,
scrollx: true,
hgap: 0,
vgap: 0,
lgap: 0,
@ -31519,16 +31699,22 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
});
},
render: function () {
BI.FlexHorizontalLayout.superclass.render.apply(this, arguments);
BI.FlexWrapperHorizontalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-horizontal-layout-wrapper " + o.verticalAlign);
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-horizontal-layout-wrapper v-" + o.verticalAlign).addClass("h-" + o.horizontalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.FlexHorizontalLayout.superclass._addElement.apply(this, arguments);
var w = BI.FlexWrapperHorizontalLayout.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative"});
if (o.columnSize[i] > 0) {
w.element.width(o.columnSize[i]);
}
if (o.columnSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
@ -31536,7 +31722,7 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
}
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"
"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) {
@ -31562,28 +31748,28 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_horizontal布局不需要resize");
// console.log("flex_wrapper_horizontal布局不需要resize");
},
populate: function (items) {
BI.FlexHorizontalLayout.superclass.populate.apply(this, arguments);
BI.FlexWrapperHorizontalLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.flex_wrapper_horizontal", BI.FlexHorizontalLayout);/**
BI.shortcut("bi.flex_wrapper_horizontal", BI.FlexWrapperHorizontalLayout);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexVerticalCenter
* @extends BI.Layout
*/
BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
BI.FlexWrapperVerticalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexVerticalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-center clearfix",
horizontalAlign: BI.HorizontalAlign.Middle,
return BI.extend(BI.FlexWrapperVerticalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-center-adapt-layout clearfix",
horizontalAlign: BI.HorizontalAlign.Left,
columnSize: [],
// scrollable: true,
scrollx: true,
hgap: 0,
vgap: 0,
lgap: 0,
@ -31593,24 +31779,82 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
});
},
render: function () {
BI.FlexVerticalCenter.superclass.render.apply(this, arguments);
var self = this, o = this.options;
return {
type: "bi.flex_wrapper_horizontal",
ref: function (_ref) {
self.wrapper = _ref;
},
verticalAlign: BI.VerticalAlign.Middle,
horizontalAlign: o.horizontalAlign,
columnSize: o.columnSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
populate: function (items) {
this.wrapper.populate(items);
}
});
BI.shortcut("bi.flex_wrapper_vertical_adapt", BI.FlexWrapperVerticalCenter);
BI.shortcut("bi.flex_wrapper_vertical_center_adapt", BI.FlexWrapperVerticalCenter);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexWrapperVerticalLayout
* @extends BI.Layout
*/
BI.FlexWrapperVerticalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexWrapperVerticalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-layout clearfix",
horizontalAlign: BI.HorizontalAlign.Left,
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrollable: null,
scrolly: true,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
BI.FlexWrapperVerticalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-vertical-center-wrapper " + o.horizontalAlign);
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-vertical-layout-wrapper h-" + o.horizontalAlign).addClass("v-" + o.verticalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.FlexVerticalCenter.superclass._addElement.apply(this, arguments);
var w = BI.FlexWrapperVerticalLayout.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative"});
if (o.rowSize[i] > 0) {
w.element.height(o.rowSize[i]);
}
if (o.rowSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
"margin-top": (i === 0 ? o.vgap : 0) + 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"
"margin-left": o.hgap + o.lgap + (item.lgap || 0) + (item.hgap || 0) + "px"
});
}
if (o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0) !== 0) {
@ -31636,15 +31880,15 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_vertical_center布局不需要resize");
// console.log("flex_wrapper_vertical布局不需要resize");
},
populate: function (items) {
BI.FlexVerticalCenter.superclass.populate.apply(this, arguments);
BI.FlexWrapperVerticalLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.flex_wrapper_vertical_center", BI.FlexVerticalCenter);/**
BI.shortcut("bi.flex_wrapper_vertical", BI.FlexWrapperVerticalLayout);/**
* 固定子组件上下左右的布局容器
* @class BI.AbsoluteLayout
* @extends BI.Layout

2
dist/bundle.min.css vendored

File diff suppressed because one or more lines are too long

66
dist/bundle.min.js vendored

File diff suppressed because one or more lines are too long

241
dist/core.css vendored

@ -1602,7 +1602,7 @@ textarea {
box-sizing: content-box;
/*W3C标准(IE9+,Safari5.1+,Chrome10.0+,Opera10.6+都符合box-sizing的w3c标准语法)*/
}
.bi-flex-center-layout {
.bi-flex-center-adapt-layout {
display: box;
/* OLD - Android 4.4- */
display: -webkit-box;
@ -1691,7 +1691,7 @@ textarea {
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
}
.bi-flex-horizontal-layout.middle {
.bi-flex-horizontal-layout.v-middle {
/* 09版 */
-webkit-box-align: center;
/* 12版 */
@ -1702,7 +1702,7 @@ textarea {
-o-align-items: center;
align-items: center;
}
.bi-flex-horizontal-layout.bottom {
.bi-flex-horizontal-layout.v-bottom {
/* 09版 */
-webkit-box-align: flex-end;
/* 12版 */
@ -1713,8 +1713,47 @@ textarea {
-o-align-items: flex-end;
align-items: flex-end;
}
.bi-flex-horizontal-layout.v-stretch {
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-horizontal-layout.h-stretch {
/* 09版 */
-webkit-box-orient: vertical;
/* 12版 */
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
/* 09版 */
-webkit-box-pack: center;
/* 12版 */
-webkit-justify-content: center;
-moz-justify-content: center;
-ms-justify-content: center;
-ms-flex-pack: center;
-o-justify-content: center;
justify-content: center;
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-vertical-center {
.bi-flex-vertical-layout {
display: box;
/* OLD - Android 4.4- */
display: -webkit-box;
@ -1728,13 +1767,13 @@ textarea {
display: flex;
/* NEW, Spec - Opera 12.1, Firefox 20+ */
/* 09版 */
-webkit-box-orient: horizontal;
-webkit-box-orient: vertical;
/* 12版 */
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
-o-flex-direction: row;
flex-direction: row;
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
/* 09版 */
-webkit-box-pack: flex-start;
/* 12版 */
@ -1744,6 +1783,25 @@ textarea {
-o-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
/* 09版 */
-webkit-box-align: start;
/* 12版 */
-webkit-align-items: flex-start;
-moz-align-items: flex-start;
-ms-align-items: flex-start;
-ms-flex-align: start;
-o-align-items: flex-start;
align-items: flex-start;
/* 09版 */
/*-webkit-box-lines: multiple;*/
/* 12版 */
-webkit-flex-wrap: nowrap;
-moz-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
}
.bi-flex-vertical-layout.h-center {
/* 09版 */
-webkit-box-align: center;
/* 12版 */
@ -1753,24 +1811,38 @@ textarea {
-ms-flex-align: center;
-o-align-items: center;
align-items: center;
}
.bi-flex-vertical-layout.h-right {
/* 09版 */
/*-webkit-box-lines: multiple;*/
-webkit-box-align: flex-end;
/* 12版 */
-webkit-flex-wrap: nowrap;
-moz-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-align-items: flex-end;
-moz-align-items: flex-end;
-ms-align-items: flex-end;
-ms-flex-align: end;
-o-align-items: flex-end;
align-items: flex-end;
}
.bi-flex-vertical-center.stretch {
.bi-flex-vertical-layout.h-stretch {
/* 09版 */
-webkit-box-orient: vertical;
-webkit-box-align: stretch;
/* 12版 */
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-vertical-layout.v-stretch {
/* 09版 */
-webkit-box-orient: horizontal;
/* 12版 */
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
-o-flex-direction: row;
flex-direction: row;
/* 09版 */
-webkit-box-pack: center;
/* 12版 */
@ -1791,7 +1863,7 @@ textarea {
align-items: stretch;
}
.bi-flex-wrapper-center-layout .flex-wrapper-center-layout-wrapper {
.bi-flex-wrapper-center-adapt-layout .flex-wrapper-center-adapt-layout-wrapper {
display: box;
/* OLD - Android 4.4- */
display: -webkit-box;
@ -1884,7 +1956,7 @@ textarea {
flex-wrap: nowrap;
min-height: 100%;
}
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.middle {
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.v-middle {
/* 09版 */
-webkit-box-align: center;
/* 12版 */
@ -1894,7 +1966,7 @@ textarea {
-o-align-items: center;
align-items: center;
}
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.bottom {
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.v-bottom {
/* 09版 */
-webkit-box-align: flex-end;
/* 12版 */
@ -1904,8 +1976,46 @@ textarea {
-o-align-items: flex-end;
align-items: flex-end;
}
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.v-stretch {
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.h-stretch {
/* 09版 */
-webkit-box-orient: vertical;
/* 12版 */
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
/* 09版 */
-webkit-box-pack: center;
/* 12版 */
-webkit-justify-content: center;
-moz-justify-content: center;
-ms-justify-content: center;
-ms-flex-pack: center;
-o-justify-content: center;
justify-content: center;
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-wrapper-vertical-center .flex-wrapper-vertical-center-wrapper {
.bi-flex-wrapper-vertical-layout .flex-wrapper-vertical-layout-wrapper {
display: box;
/* OLD - Android 4.4- */
display: -webkit-box;
@ -1919,13 +2029,13 @@ textarea {
display: flex;
/* NEW, Spec - Opera 12.1, Firefox 20+ */
/* 09版 */
-webkit-box-orient: horizontal;
-webkit-box-orient: vertical;
/* 12版 */
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
-o-flex-direction: row;
flex-direction: row;
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
/* 09版 */
-webkit-box-pack: flex-start;
/* 12版 */
@ -1935,6 +2045,26 @@ textarea {
-ms-flex-pack: start;
-o-justify-content: flex-start;
justify-content: flex-start;
/* 09版 */
-webkit-box-align: flex-start;
/* 12版 */
-webkit-align-items: flex-start;
-moz-align-items: flex-start;
-ms-align-items: flex-start;
-ms-flex-align: start;
-o-align-items: flex-start;
align-items: flex-start;
/* 09版 */
/*-webkit-box-lines: multiple;*/
/* 12版 */
-webkit-flex-wrap: nowrap;
-moz-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
min-width: 100%;
}
.bi-flex-wrapper-vertical-layout .flex-wrapper-vertical-layout-wrapper.h-center {
/* 09版 */
-webkit-box-align: center;
/* 12版 */
@ -1944,33 +2074,45 @@ textarea {
-ms-flex-align: center;
-o-align-items: center;
align-items: center;
}
.bi-flex-wrapper-vertical-layout .flex-wrapper-vertical-layout-wrapper.h-right {
/* 09版 */
/*-webkit-box-lines: multiple;*/
-webkit-box-align: flex-end;
/* 12版 */
-webkit-flex-wrap: nowrap;
-moz-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
min-height: 100%;
float: left;
-webkit-align-items: flex-end;
-moz-align-items: flex-end;
-ms-align-items: flex-end;
-ms-flex-align: end;
-o-align-items: flex-end;
align-items: flex-end;
}
.bi-flex-wrapper-vertical-center .flex-wrapper-vertical-center-wrapper.stretch {
width: 100%;
.bi-flex-wrapper-vertical-layout .flex-wrapper-vertical-layout-wrapper.h-stretch {
/* 09版 */
-webkit-box-orient: vertical;
-webkit-box-align: stretch;
/* 12版 */
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-wrapper-vertical-layout .flex-wrapper-vertical-layout-wrapper.v-stretch {
/* 09版 */
-webkit-box-orient: horizontal;
/* 12版 */
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
-o-flex-direction: row;
flex-direction: row;
/* 09版 */
-webkit-box-pack: center;
/* 12版 */
-webkit-justify-content: center;
-moz-justify-content: center;
-ms-justify-content: center;
-ms-flex-pack: center;
-o-justify-content: center;
justify-content: center;
/* 09版 */
@ -1979,6 +2121,7 @@ textarea {
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}

354
dist/core.js vendored

@ -19158,12 +19158,12 @@ BI.prepares.push(function () {
BI.Plugin.registerWidget("bi.center_adapt", function (ob) {
var isIE = BI.isIE(), supportFlex = isSupportFlex(), justOneItem = (ob.items && ob.items.length <= 1);
if (!isIE && supportFlex && justOneItem) {
// 有滚动条的情况下需要用到flex_wrapper_center布局
// 有滚动条的情况下需要用到flex_wrapper_center_adapt布局
if (ob.scrollable === true || ob.scrollx === true || ob.scrolly === true) {
// 不是IE用flex_wrapper_center布局
return BI.extend(ob, {type: "bi.flex_wrapper_center"});
// 不是IE用flex_wrapper_center_adapt布局
return BI.extend(ob, {type: "bi.flex_wrapper_center_adapt"});
}
return BI.extend(ob, {type: "bi.flex_center"});
return BI.extend(ob, {type: "bi.flex_center_adapt"});
}
// 一个item的情况下inline布局睥睨天下
if(justOneItem) {
@ -19174,12 +19174,12 @@ BI.prepares.push(function () {
BI.Plugin.registerWidget("bi.vertical_adapt", function (ob) {
var isIE = BI.isIE(), supportFlex = isSupportFlex();
if (!isIE && supportFlex) {
// 有滚动条的情况下需要用到flex_wrapper_center布局
// 有滚动条的情况下需要用到flex_wrapper_center_adapt布局
if (ob.scrollable === true || ob.scrollx === true || ob.scrolly === true) {
// 不是IE用flex_wrapper_center布局
return BI.extend({}, ob, {type: "bi.flex_wrapper_vertical_center"});
// 不是IE用flex_wrapper_center_adapt布局
return BI.extend({}, ob, {type: "bi.flex_wrapper_vertical_center_adapt"});
}
return BI.extend(ob, {type: "bi.flex_vertical_center"});
return BI.extend(ob, {type: "bi.flex_vertical_center_adapt"});
}
return BI.extend(ob, {type: "bi.inline_vertical_adapt"});
});
@ -19191,12 +19191,12 @@ BI.prepares.push(function () {
});
BI.Plugin.registerWidget("bi.float_center_adapt", function (ob) {
if (!BI.isIE() && isSupportFlex()) {
// 有滚动条的情况下需要用到flex_wrapper_center布局
// 有滚动条的情况下需要用到flex_wrapper_center_adapt布局
if (ob.scrollable === true || ob.scrollx === true || ob.scrolly === true) {
// 不是IE用flex_wrapper_center布局
return BI.extend({}, ob, {type: "bi.flex_wrapper_center"});
// 不是IE用flex_wrapper_center_adapt布局
return BI.extend({}, ob, {type: "bi.flex_wrapper_center_adapt"});
}
return BI.extend(ob, {type: "bi.flex_center"});
return BI.extend(ob, {type: "bi.flex_center_adapt"});
}
return BI.extend(ob, {type: "bi.inline_center_adapt"});
});
@ -31299,7 +31299,7 @@ BI.shortcut("bi.inline_vertical_adapt", BI.InlineVerticalAdaptLayout);/**
BI.FlexCenterLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexCenterLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-center-layout"
baseCls: "bi-flex-center-adapt-layout"
});
},
render: function () {
@ -31315,7 +31315,7 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_center布局不需要resize");
// console.log("flex_center_adapt布局不需要resize");
},
populate: function (items) {
@ -31323,7 +31323,60 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
this._mount();
}
});
BI.shortcut("bi.flex_center", BI.FlexCenterLayout);/**
BI.shortcut("bi.flex_center_adapt", BI.FlexCenterLayout);/**
* Created by GUY on 2016/12/2.
*
* @class BI.FlexHorizontalCenter
* @extends BI.Layout
*/
BI.FlexHorizontalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexHorizontalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-horizontal-center-adapt-layout",
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrolly: false,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
var self = this, o = this.options;
return {
type: "bi.flex_vertical",
ref: function (_ref) {
self.wrapper = _ref;
},
horizontalAlign: BI.HorizontalAlign.Center,
verticalAlign: o.verticalAlign,
rowSize: o.rowSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
resize: function () {
// console.log("flex_vertical_center_adapt布局不需要resize");
},
populate: function (items) {
self.populate(items);
}
});
BI.shortcut("bi.flex_horizontal_adapt", BI.FlexHorizontalCenter);
BI.shortcut("bi.flex_horizontal_adapt", BI.FlexHorizontalCenter);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
@ -31335,6 +31388,7 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
return BI.extend(BI.FlexHorizontalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-horizontal-layout",
verticalAlign: BI.VerticalAlign.Top,
horizontalAlign: BI.HorizontalAlign.Left,// 如果只有一个子元素且想让该子元素横向撑满,设置成Stretch
columnSize: [],
scrollx: true,
hgap: 0,
@ -31348,14 +31402,23 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
render: function () {
BI.FlexHorizontalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.element.addClass(o.verticalAlign);
this.element.addClass("v-" + o.verticalAlign).addClass("h-" + o.horizontalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.FlexHorizontalLayout.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative", "flex-shrink": "0"});
w.element.css({
position: "relative",
"flex-shrink": "0"
});
if (o.columnSize[i] > 0) {
w.element.width(o.columnSize[i]);
}
if (o.columnSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
@ -31363,7 +31426,7 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
}
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"
"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) {
@ -31398,9 +31461,64 @@ BI.shortcut("bi.flex_horizontal", BI.FlexHorizontalLayout);/**
BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexVerticalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-vertical-center",
baseCls: "bi-flex-vertical-center-adapt-layout",
horizontalAlign: BI.HorizontalAlign.Left,
columnSize: [],
scrollx: false,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
var self = this, o = this.options;
return {
type: "bi.flex_horizontal",
ref: function (_ref) {
self.wrapper = _ref;
},
verticalAlign: BI.VerticalAlign.Middle,
horizontalAlign: o.horizontalAlign,
columnSize: o.columnSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
resize: function () {
// console.log("flex_vertical_center_adapt布局不需要resize");
},
populate: function (items) {
self.populate(items);
}
});
BI.shortcut("bi.flex_vertical_adapt", BI.FlexVerticalCenter);
BI.shortcut("bi.flex_vertical_center_adapt", BI.FlexVerticalCenter);/**
* Created by GUY on 2016/12/2.
*
* @class BI.FlexVerticalLayout
* @extends BI.Layout
*/
BI.FlexVerticalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexVerticalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-vertical-layout",
horizontalAlign: BI.HorizontalAlign.Left,
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrolly: true,
hgap: 0,
vgap: 0,
lgap: 0,
@ -31410,24 +31528,33 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
});
},
render: function () {
BI.FlexVerticalCenter.superclass.render.apply(this, arguments);
BI.FlexVerticalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.element.addClass(o.horizontalAlign);
this.element.addClass("h-" + o.horizontalAlign).addClass("v-" + o.verticalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var w = BI.FlexVerticalLayout.superclass._addElement.apply(this, arguments);
var o = this.options;
var w = BI.FlexVerticalCenter.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative", "flex-shrink": "0"});
w.element.css({
position: "relative",
"flex-shrink": "0"
});
if (o.rowSize[i] > 0) {
w.element.height(o.rowSize[i]);
}
if (o.rowSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
"margin-top": (i === 0 ? o.vgap : 0) + 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"
"margin-left": o.hgap + o.lgap + (item.lgap || 0) + (item.hgap || 0) + "px"
});
}
if (o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0) !== 0) {
@ -31444,15 +31571,15 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_vertical_center布局不需要resize");
// console.log("flex_vertical布局不需要resize");
},
populate: function (items) {
BI.FlexVerticalCenter.superclass.populate.apply(this, arguments);
BI.FlexVerticalLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.flex_vertical_center", BI.FlexVerticalCenter);/**
BI.shortcut("bi.flex_vertical", BI.FlexVerticalLayout);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
@ -31467,7 +31594,7 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
},
render: function () {
BI.FlexCenterLayout.superclass.render.apply(this, arguments);
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-center-layout-wrapper");
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-center-adapt-layout-wrapper");
this.populate(this.options.items);
},
@ -31488,7 +31615,7 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_center布局不需要resize");
// console.log("flex_center_adapt布局不需要resize");
},
populate: function (items) {
@ -31496,20 +31623,73 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
this._mount();
}
});
BI.shortcut("bi.flex_wrapper_center", BI.FlexCenterLayout);/**
BI.shortcut("bi.flex_wrapper_center_adapt", BI.FlexCenterLayout);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexVerticalCenter
* @extends BI.Layout
*/
BI.FlexWrapperHorizontalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexWrapperHorizontalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-center-adapt-layout clearfix",
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrollable: null,
scrolly: true,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
var self = this, o = this.options;
return {
type: "bi.flex_wrapper_vertical",
ref: function (_ref) {
self.wrapper = _ref;
},
horizontalAlign: BI.HorizontalAlign.Center,
verticalAlign: o.verticalAlign,
rowSize: o.rowSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
populate: function (items) {
this.wrapper.populate(items);
}
});
BI.shortcut("bi.flex_wrapper_horizontal_adapt", BI.FlexWrapperHorizontalCenter);
BI.shortcut("bi.flex_wrapper_horizontal_center_adapt", BI.FlexWrapperHorizontalCenter);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexHorizontalLayout
* @extends BI.Layout
*/
BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
BI.FlexWrapperHorizontalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexHorizontalLayout.superclass.props.apply(this, arguments), {
return BI.extend(BI.FlexWrapperHorizontalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-horizontal-layout clearfix",
verticalAlign: BI.VerticalAlign.Middle,
verticalAlign: BI.VerticalAlign.Top,
horizontalAlign: BI.HorizontalAlign.Left,
columnSize: [],
// scrollable: true,
scrollable: null,
scrollx: true,
hgap: 0,
vgap: 0,
lgap: 0,
@ -31519,16 +31699,22 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
});
},
render: function () {
BI.FlexHorizontalLayout.superclass.render.apply(this, arguments);
BI.FlexWrapperHorizontalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-horizontal-layout-wrapper " + o.verticalAlign);
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-horizontal-layout-wrapper v-" + o.verticalAlign).addClass("h-" + o.horizontalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.FlexHorizontalLayout.superclass._addElement.apply(this, arguments);
var w = BI.FlexWrapperHorizontalLayout.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative"});
if (o.columnSize[i] > 0) {
w.element.width(o.columnSize[i]);
}
if (o.columnSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
@ -31536,7 +31722,7 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
}
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"
"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) {
@ -31562,28 +31748,80 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_horizontal布局不需要resize");
// console.log("flex_wrapper_horizontal布局不需要resize");
},
populate: function (items) {
BI.FlexHorizontalLayout.superclass.populate.apply(this, arguments);
BI.FlexWrapperHorizontalLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.flex_wrapper_horizontal", BI.FlexHorizontalLayout);/**
BI.shortcut("bi.flex_wrapper_horizontal", BI.FlexWrapperHorizontalLayout);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexVerticalCenter
* @extends BI.Layout
*/
BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
BI.FlexWrapperVerticalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexVerticalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-center clearfix",
horizontalAlign: BI.HorizontalAlign.Middle,
return BI.extend(BI.FlexWrapperVerticalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-center-adapt-layout clearfix",
horizontalAlign: BI.HorizontalAlign.Left,
columnSize: [],
// scrollable: true,
scrollx: true,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
var self = this, o = this.options;
return {
type: "bi.flex_wrapper_horizontal",
ref: function (_ref) {
self.wrapper = _ref;
},
verticalAlign: BI.VerticalAlign.Middle,
horizontalAlign: o.horizontalAlign,
columnSize: o.columnSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
populate: function (items) {
this.wrapper.populate(items);
}
});
BI.shortcut("bi.flex_wrapper_vertical_adapt", BI.FlexWrapperVerticalCenter);
BI.shortcut("bi.flex_wrapper_vertical_center_adapt", BI.FlexWrapperVerticalCenter);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexWrapperVerticalLayout
* @extends BI.Layout
*/
BI.FlexWrapperVerticalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexWrapperVerticalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-layout clearfix",
horizontalAlign: BI.HorizontalAlign.Left,
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrollable: null,
scrolly: true,
hgap: 0,
vgap: 0,
lgap: 0,
@ -31593,24 +31831,30 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
});
},
render: function () {
BI.FlexVerticalCenter.superclass.render.apply(this, arguments);
BI.FlexWrapperVerticalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-vertical-center-wrapper " + o.horizontalAlign);
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-vertical-layout-wrapper h-" + o.horizontalAlign).addClass("v-" + o.verticalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.FlexVerticalCenter.superclass._addElement.apply(this, arguments);
var w = BI.FlexWrapperVerticalLayout.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative"});
if (o.rowSize[i] > 0) {
w.element.height(o.rowSize[i]);
}
if (o.rowSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
"margin-top": (i === 0 ? o.vgap : 0) + 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"
"margin-left": o.hgap + o.lgap + (item.lgap || 0) + (item.hgap || 0) + "px"
});
}
if (o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0) !== 0) {
@ -31636,15 +31880,15 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_vertical_center布局不需要resize");
// console.log("flex_wrapper_vertical布局不需要resize");
},
populate: function (items) {
BI.FlexVerticalCenter.superclass.populate.apply(this, arguments);
BI.FlexWrapperVerticalLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.flex_wrapper_vertical_center", BI.FlexVerticalCenter);/**
BI.shortcut("bi.flex_wrapper_vertical", BI.FlexWrapperVerticalLayout);/**
* 固定子组件上下左右的布局容器
* @class BI.AbsoluteLayout
* @extends BI.Layout

241
dist/core_without_normalize.css vendored

@ -1321,7 +1321,7 @@ textarea {
box-sizing: content-box;
/*W3C标准(IE9+,Safari5.1+,Chrome10.0+,Opera10.6+都符合box-sizing的w3c标准语法)*/
}
.bi-flex-center-layout {
.bi-flex-center-adapt-layout {
display: box;
/* OLD - Android 4.4- */
display: -webkit-box;
@ -1410,7 +1410,7 @@ textarea {
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
}
.bi-flex-horizontal-layout.middle {
.bi-flex-horizontal-layout.v-middle {
/* 09版 */
-webkit-box-align: center;
/* 12版 */
@ -1421,7 +1421,7 @@ textarea {
-o-align-items: center;
align-items: center;
}
.bi-flex-horizontal-layout.bottom {
.bi-flex-horizontal-layout.v-bottom {
/* 09版 */
-webkit-box-align: flex-end;
/* 12版 */
@ -1432,8 +1432,47 @@ textarea {
-o-align-items: flex-end;
align-items: flex-end;
}
.bi-flex-horizontal-layout.v-stretch {
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-horizontal-layout.h-stretch {
/* 09版 */
-webkit-box-orient: vertical;
/* 12版 */
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
/* 09版 */
-webkit-box-pack: center;
/* 12版 */
-webkit-justify-content: center;
-moz-justify-content: center;
-ms-justify-content: center;
-ms-flex-pack: center;
-o-justify-content: center;
justify-content: center;
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-vertical-center {
.bi-flex-vertical-layout {
display: box;
/* OLD - Android 4.4- */
display: -webkit-box;
@ -1447,13 +1486,13 @@ textarea {
display: flex;
/* NEW, Spec - Opera 12.1, Firefox 20+ */
/* 09版 */
-webkit-box-orient: horizontal;
-webkit-box-orient: vertical;
/* 12版 */
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
-o-flex-direction: row;
flex-direction: row;
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
/* 09版 */
-webkit-box-pack: flex-start;
/* 12版 */
@ -1463,6 +1502,25 @@ textarea {
-o-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
/* 09版 */
-webkit-box-align: start;
/* 12版 */
-webkit-align-items: flex-start;
-moz-align-items: flex-start;
-ms-align-items: flex-start;
-ms-flex-align: start;
-o-align-items: flex-start;
align-items: flex-start;
/* 09版 */
/*-webkit-box-lines: multiple;*/
/* 12版 */
-webkit-flex-wrap: nowrap;
-moz-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
}
.bi-flex-vertical-layout.h-center {
/* 09版 */
-webkit-box-align: center;
/* 12版 */
@ -1472,24 +1530,38 @@ textarea {
-ms-flex-align: center;
-o-align-items: center;
align-items: center;
}
.bi-flex-vertical-layout.h-right {
/* 09版 */
/*-webkit-box-lines: multiple;*/
-webkit-box-align: flex-end;
/* 12版 */
-webkit-flex-wrap: nowrap;
-moz-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-align-items: flex-end;
-moz-align-items: flex-end;
-ms-align-items: flex-end;
-ms-flex-align: end;
-o-align-items: flex-end;
align-items: flex-end;
}
.bi-flex-vertical-center.stretch {
.bi-flex-vertical-layout.h-stretch {
/* 09版 */
-webkit-box-orient: vertical;
-webkit-box-align: stretch;
/* 12版 */
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-vertical-layout.v-stretch {
/* 09版 */
-webkit-box-orient: horizontal;
/* 12版 */
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
-o-flex-direction: row;
flex-direction: row;
/* 09版 */
-webkit-box-pack: center;
/* 12版 */
@ -1510,7 +1582,7 @@ textarea {
align-items: stretch;
}
.bi-flex-wrapper-center-layout .flex-wrapper-center-layout-wrapper {
.bi-flex-wrapper-center-adapt-layout .flex-wrapper-center-adapt-layout-wrapper {
display: box;
/* OLD - Android 4.4- */
display: -webkit-box;
@ -1603,7 +1675,7 @@ textarea {
flex-wrap: nowrap;
min-height: 100%;
}
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.middle {
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.v-middle {
/* 09版 */
-webkit-box-align: center;
/* 12版 */
@ -1613,7 +1685,7 @@ textarea {
-o-align-items: center;
align-items: center;
}
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.bottom {
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.v-bottom {
/* 09版 */
-webkit-box-align: flex-end;
/* 12版 */
@ -1623,8 +1695,46 @@ textarea {
-o-align-items: flex-end;
align-items: flex-end;
}
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.v-stretch {
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.h-stretch {
/* 09版 */
-webkit-box-orient: vertical;
/* 12版 */
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
/* 09版 */
-webkit-box-pack: center;
/* 12版 */
-webkit-justify-content: center;
-moz-justify-content: center;
-ms-justify-content: center;
-ms-flex-pack: center;
-o-justify-content: center;
justify-content: center;
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-wrapper-vertical-center .flex-wrapper-vertical-center-wrapper {
.bi-flex-wrapper-vertical-layout .flex-wrapper-vertical-layout-wrapper {
display: box;
/* OLD - Android 4.4- */
display: -webkit-box;
@ -1638,13 +1748,13 @@ textarea {
display: flex;
/* NEW, Spec - Opera 12.1, Firefox 20+ */
/* 09版 */
-webkit-box-orient: horizontal;
-webkit-box-orient: vertical;
/* 12版 */
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
-o-flex-direction: row;
flex-direction: row;
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
/* 09版 */
-webkit-box-pack: flex-start;
/* 12版 */
@ -1654,6 +1764,26 @@ textarea {
-ms-flex-pack: start;
-o-justify-content: flex-start;
justify-content: flex-start;
/* 09版 */
-webkit-box-align: flex-start;
/* 12版 */
-webkit-align-items: flex-start;
-moz-align-items: flex-start;
-ms-align-items: flex-start;
-ms-flex-align: start;
-o-align-items: flex-start;
align-items: flex-start;
/* 09版 */
/*-webkit-box-lines: multiple;*/
/* 12版 */
-webkit-flex-wrap: nowrap;
-moz-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
min-width: 100%;
}
.bi-flex-wrapper-vertical-layout .flex-wrapper-vertical-layout-wrapper.h-center {
/* 09版 */
-webkit-box-align: center;
/* 12版 */
@ -1663,33 +1793,45 @@ textarea {
-ms-flex-align: center;
-o-align-items: center;
align-items: center;
}
.bi-flex-wrapper-vertical-layout .flex-wrapper-vertical-layout-wrapper.h-right {
/* 09版 */
/*-webkit-box-lines: multiple;*/
-webkit-box-align: flex-end;
/* 12版 */
-webkit-flex-wrap: nowrap;
-moz-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
min-height: 100%;
float: left;
-webkit-align-items: flex-end;
-moz-align-items: flex-end;
-ms-align-items: flex-end;
-ms-flex-align: end;
-o-align-items: flex-end;
align-items: flex-end;
}
.bi-flex-wrapper-vertical-center .flex-wrapper-vertical-center-wrapper.stretch {
width: 100%;
.bi-flex-wrapper-vertical-layout .flex-wrapper-vertical-layout-wrapper.h-stretch {
/* 09版 */
-webkit-box-orient: vertical;
-webkit-box-align: stretch;
/* 12版 */
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-wrapper-vertical-layout .flex-wrapper-vertical-layout-wrapper.v-stretch {
/* 09版 */
-webkit-box-orient: horizontal;
/* 12版 */
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
-o-flex-direction: row;
flex-direction: row;
/* 09版 */
-webkit-box-pack: center;
/* 12版 */
-webkit-justify-content: center;
-moz-justify-content: center;
-ms-justify-content: center;
-ms-flex-pack: center;
-o-justify-content: center;
justify-content: center;
/* 09版 */
@ -1698,6 +1840,7 @@ textarea {
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}

241
dist/fineui.css vendored

@ -1602,7 +1602,7 @@ textarea {
box-sizing: content-box;
/*W3C标准(IE9+,Safari5.1+,Chrome10.0+,Opera10.6+都符合box-sizing的w3c标准语法)*/
}
.bi-flex-center-layout {
.bi-flex-center-adapt-layout {
display: box;
/* OLD - Android 4.4- */
display: -webkit-box;
@ -1691,7 +1691,7 @@ textarea {
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
}
.bi-flex-horizontal-layout.middle {
.bi-flex-horizontal-layout.v-middle {
/* 09版 */
-webkit-box-align: center;
/* 12版 */
@ -1702,7 +1702,7 @@ textarea {
-o-align-items: center;
align-items: center;
}
.bi-flex-horizontal-layout.bottom {
.bi-flex-horizontal-layout.v-bottom {
/* 09版 */
-webkit-box-align: flex-end;
/* 12版 */
@ -1713,8 +1713,47 @@ textarea {
-o-align-items: flex-end;
align-items: flex-end;
}
.bi-flex-horizontal-layout.v-stretch {
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-horizontal-layout.h-stretch {
/* 09版 */
-webkit-box-orient: vertical;
/* 12版 */
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
/* 09版 */
-webkit-box-pack: center;
/* 12版 */
-webkit-justify-content: center;
-moz-justify-content: center;
-ms-justify-content: center;
-ms-flex-pack: center;
-o-justify-content: center;
justify-content: center;
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-vertical-center {
.bi-flex-vertical-layout {
display: box;
/* OLD - Android 4.4- */
display: -webkit-box;
@ -1728,13 +1767,13 @@ textarea {
display: flex;
/* NEW, Spec - Opera 12.1, Firefox 20+ */
/* 09版 */
-webkit-box-orient: horizontal;
-webkit-box-orient: vertical;
/* 12版 */
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
-o-flex-direction: row;
flex-direction: row;
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
/* 09版 */
-webkit-box-pack: flex-start;
/* 12版 */
@ -1744,6 +1783,25 @@ textarea {
-o-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
/* 09版 */
-webkit-box-align: start;
/* 12版 */
-webkit-align-items: flex-start;
-moz-align-items: flex-start;
-ms-align-items: flex-start;
-ms-flex-align: start;
-o-align-items: flex-start;
align-items: flex-start;
/* 09版 */
/*-webkit-box-lines: multiple;*/
/* 12版 */
-webkit-flex-wrap: nowrap;
-moz-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
}
.bi-flex-vertical-layout.h-center {
/* 09版 */
-webkit-box-align: center;
/* 12版 */
@ -1753,24 +1811,38 @@ textarea {
-ms-flex-align: center;
-o-align-items: center;
align-items: center;
}
.bi-flex-vertical-layout.h-right {
/* 09版 */
/*-webkit-box-lines: multiple;*/
-webkit-box-align: flex-end;
/* 12版 */
-webkit-flex-wrap: nowrap;
-moz-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-align-items: flex-end;
-moz-align-items: flex-end;
-ms-align-items: flex-end;
-ms-flex-align: end;
-o-align-items: flex-end;
align-items: flex-end;
}
.bi-flex-vertical-center.stretch {
.bi-flex-vertical-layout.h-stretch {
/* 09版 */
-webkit-box-orient: vertical;
-webkit-box-align: stretch;
/* 12版 */
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-vertical-layout.v-stretch {
/* 09版 */
-webkit-box-orient: horizontal;
/* 12版 */
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
-o-flex-direction: row;
flex-direction: row;
/* 09版 */
-webkit-box-pack: center;
/* 12版 */
@ -1791,7 +1863,7 @@ textarea {
align-items: stretch;
}
.bi-flex-wrapper-center-layout .flex-wrapper-center-layout-wrapper {
.bi-flex-wrapper-center-adapt-layout .flex-wrapper-center-adapt-layout-wrapper {
display: box;
/* OLD - Android 4.4- */
display: -webkit-box;
@ -1884,7 +1956,7 @@ textarea {
flex-wrap: nowrap;
min-height: 100%;
}
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.middle {
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.v-middle {
/* 09版 */
-webkit-box-align: center;
/* 12版 */
@ -1894,7 +1966,7 @@ textarea {
-o-align-items: center;
align-items: center;
}
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.bottom {
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.v-bottom {
/* 09版 */
-webkit-box-align: flex-end;
/* 12版 */
@ -1904,8 +1976,46 @@ textarea {
-o-align-items: flex-end;
align-items: flex-end;
}
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.v-stretch {
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.h-stretch {
/* 09版 */
-webkit-box-orient: vertical;
/* 12版 */
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
/* 09版 */
-webkit-box-pack: center;
/* 12版 */
-webkit-justify-content: center;
-moz-justify-content: center;
-ms-justify-content: center;
-ms-flex-pack: center;
-o-justify-content: center;
justify-content: center;
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-wrapper-vertical-center .flex-wrapper-vertical-center-wrapper {
.bi-flex-wrapper-vertical-layout .flex-wrapper-vertical-layout-wrapper {
display: box;
/* OLD - Android 4.4- */
display: -webkit-box;
@ -1919,13 +2029,13 @@ textarea {
display: flex;
/* NEW, Spec - Opera 12.1, Firefox 20+ */
/* 09版 */
-webkit-box-orient: horizontal;
-webkit-box-orient: vertical;
/* 12版 */
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
-o-flex-direction: row;
flex-direction: row;
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
/* 09版 */
-webkit-box-pack: flex-start;
/* 12版 */
@ -1935,6 +2045,26 @@ textarea {
-ms-flex-pack: start;
-o-justify-content: flex-start;
justify-content: flex-start;
/* 09版 */
-webkit-box-align: flex-start;
/* 12版 */
-webkit-align-items: flex-start;
-moz-align-items: flex-start;
-ms-align-items: flex-start;
-ms-flex-align: start;
-o-align-items: flex-start;
align-items: flex-start;
/* 09版 */
/*-webkit-box-lines: multiple;*/
/* 12版 */
-webkit-flex-wrap: nowrap;
-moz-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
min-width: 100%;
}
.bi-flex-wrapper-vertical-layout .flex-wrapper-vertical-layout-wrapper.h-center {
/* 09版 */
-webkit-box-align: center;
/* 12版 */
@ -1944,33 +2074,45 @@ textarea {
-ms-flex-align: center;
-o-align-items: center;
align-items: center;
}
.bi-flex-wrapper-vertical-layout .flex-wrapper-vertical-layout-wrapper.h-right {
/* 09版 */
/*-webkit-box-lines: multiple;*/
-webkit-box-align: flex-end;
/* 12版 */
-webkit-flex-wrap: nowrap;
-moz-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
min-height: 100%;
float: left;
-webkit-align-items: flex-end;
-moz-align-items: flex-end;
-ms-align-items: flex-end;
-ms-flex-align: end;
-o-align-items: flex-end;
align-items: flex-end;
}
.bi-flex-wrapper-vertical-center .flex-wrapper-vertical-center-wrapper.stretch {
width: 100%;
.bi-flex-wrapper-vertical-layout .flex-wrapper-vertical-layout-wrapper.h-stretch {
/* 09版 */
-webkit-box-orient: vertical;
-webkit-box-align: stretch;
/* 12版 */
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-wrapper-vertical-layout .flex-wrapper-vertical-layout-wrapper.v-stretch {
/* 09版 */
-webkit-box-orient: horizontal;
/* 12版 */
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
-o-flex-direction: row;
flex-direction: row;
/* 09版 */
-webkit-box-pack: center;
/* 12版 */
-webkit-justify-content: center;
-moz-justify-content: center;
-ms-justify-content: center;
-ms-flex-pack: center;
-o-justify-content: center;
justify-content: center;
/* 09版 */
@ -1979,6 +2121,7 @@ textarea {
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}

354
dist/fineui.ie.js vendored

@ -19403,12 +19403,12 @@ BI.prepares.push(function () {
BI.Plugin.registerWidget("bi.center_adapt", function (ob) {
var isIE = BI.isIE(), supportFlex = isSupportFlex(), justOneItem = (ob.items && ob.items.length <= 1);
if (!isIE && supportFlex && justOneItem) {
// 有滚动条的情况下需要用到flex_wrapper_center布局
// 有滚动条的情况下需要用到flex_wrapper_center_adapt布局
if (ob.scrollable === true || ob.scrollx === true || ob.scrolly === true) {
// 不是IE用flex_wrapper_center布局
return BI.extend(ob, {type: "bi.flex_wrapper_center"});
// 不是IE用flex_wrapper_center_adapt布局
return BI.extend(ob, {type: "bi.flex_wrapper_center_adapt"});
}
return BI.extend(ob, {type: "bi.flex_center"});
return BI.extend(ob, {type: "bi.flex_center_adapt"});
}
// 一个item的情况下inline布局睥睨天下
if(justOneItem) {
@ -19419,12 +19419,12 @@ BI.prepares.push(function () {
BI.Plugin.registerWidget("bi.vertical_adapt", function (ob) {
var isIE = BI.isIE(), supportFlex = isSupportFlex();
if (!isIE && supportFlex) {
// 有滚动条的情况下需要用到flex_wrapper_center布局
// 有滚动条的情况下需要用到flex_wrapper_center_adapt布局
if (ob.scrollable === true || ob.scrollx === true || ob.scrolly === true) {
// 不是IE用flex_wrapper_center布局
return BI.extend({}, ob, {type: "bi.flex_wrapper_vertical_center"});
// 不是IE用flex_wrapper_center_adapt布局
return BI.extend({}, ob, {type: "bi.flex_wrapper_vertical_center_adapt"});
}
return BI.extend(ob, {type: "bi.flex_vertical_center"});
return BI.extend(ob, {type: "bi.flex_vertical_center_adapt"});
}
return BI.extend(ob, {type: "bi.inline_vertical_adapt"});
});
@ -19436,12 +19436,12 @@ BI.prepares.push(function () {
});
BI.Plugin.registerWidget("bi.float_center_adapt", function (ob) {
if (!BI.isIE() && isSupportFlex()) {
// 有滚动条的情况下需要用到flex_wrapper_center布局
// 有滚动条的情况下需要用到flex_wrapper_center_adapt布局
if (ob.scrollable === true || ob.scrollx === true || ob.scrolly === true) {
// 不是IE用flex_wrapper_center布局
return BI.extend({}, ob, {type: "bi.flex_wrapper_center"});
// 不是IE用flex_wrapper_center_adapt布局
return BI.extend({}, ob, {type: "bi.flex_wrapper_center_adapt"});
}
return BI.extend(ob, {type: "bi.flex_center"});
return BI.extend(ob, {type: "bi.flex_center_adapt"});
}
return BI.extend(ob, {type: "bi.inline_center_adapt"});
});
@ -31544,7 +31544,7 @@ BI.shortcut("bi.inline_vertical_adapt", BI.InlineVerticalAdaptLayout);/**
BI.FlexCenterLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexCenterLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-center-layout"
baseCls: "bi-flex-center-adapt-layout"
});
},
render: function () {
@ -31560,7 +31560,7 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_center布局不需要resize");
// console.log("flex_center_adapt布局不需要resize");
},
populate: function (items) {
@ -31568,7 +31568,60 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
this._mount();
}
});
BI.shortcut("bi.flex_center", BI.FlexCenterLayout);/**
BI.shortcut("bi.flex_center_adapt", BI.FlexCenterLayout);/**
* Created by GUY on 2016/12/2.
*
* @class BI.FlexHorizontalCenter
* @extends BI.Layout
*/
BI.FlexHorizontalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexHorizontalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-horizontal-center-adapt-layout",
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrolly: false,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
var self = this, o = this.options;
return {
type: "bi.flex_vertical",
ref: function (_ref) {
self.wrapper = _ref;
},
horizontalAlign: BI.HorizontalAlign.Center,
verticalAlign: o.verticalAlign,
rowSize: o.rowSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
resize: function () {
// console.log("flex_vertical_center_adapt布局不需要resize");
},
populate: function (items) {
self.populate(items);
}
});
BI.shortcut("bi.flex_horizontal_adapt", BI.FlexHorizontalCenter);
BI.shortcut("bi.flex_horizontal_adapt", BI.FlexHorizontalCenter);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
@ -31580,6 +31633,7 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
return BI.extend(BI.FlexHorizontalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-horizontal-layout",
verticalAlign: BI.VerticalAlign.Top,
horizontalAlign: BI.HorizontalAlign.Left,// 如果只有一个子元素且想让该子元素横向撑满,设置成Stretch
columnSize: [],
scrollx: true,
hgap: 0,
@ -31593,14 +31647,23 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
render: function () {
BI.FlexHorizontalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.element.addClass(o.verticalAlign);
this.element.addClass("v-" + o.verticalAlign).addClass("h-" + o.horizontalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.FlexHorizontalLayout.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative", "flex-shrink": "0"});
w.element.css({
position: "relative",
"flex-shrink": "0"
});
if (o.columnSize[i] > 0) {
w.element.width(o.columnSize[i]);
}
if (o.columnSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
@ -31608,7 +31671,7 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
}
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"
"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) {
@ -31643,9 +31706,64 @@ BI.shortcut("bi.flex_horizontal", BI.FlexHorizontalLayout);/**
BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexVerticalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-vertical-center",
baseCls: "bi-flex-vertical-center-adapt-layout",
horizontalAlign: BI.HorizontalAlign.Left,
columnSize: [],
scrollx: false,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
var self = this, o = this.options;
return {
type: "bi.flex_horizontal",
ref: function (_ref) {
self.wrapper = _ref;
},
verticalAlign: BI.VerticalAlign.Middle,
horizontalAlign: o.horizontalAlign,
columnSize: o.columnSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
resize: function () {
// console.log("flex_vertical_center_adapt布局不需要resize");
},
populate: function (items) {
self.populate(items);
}
});
BI.shortcut("bi.flex_vertical_adapt", BI.FlexVerticalCenter);
BI.shortcut("bi.flex_vertical_center_adapt", BI.FlexVerticalCenter);/**
* Created by GUY on 2016/12/2.
*
* @class BI.FlexVerticalLayout
* @extends BI.Layout
*/
BI.FlexVerticalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexVerticalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-vertical-layout",
horizontalAlign: BI.HorizontalAlign.Left,
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrolly: true,
hgap: 0,
vgap: 0,
lgap: 0,
@ -31655,24 +31773,33 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
});
},
render: function () {
BI.FlexVerticalCenter.superclass.render.apply(this, arguments);
BI.FlexVerticalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.element.addClass(o.horizontalAlign);
this.element.addClass("h-" + o.horizontalAlign).addClass("v-" + o.verticalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var w = BI.FlexVerticalLayout.superclass._addElement.apply(this, arguments);
var o = this.options;
var w = BI.FlexVerticalCenter.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative", "flex-shrink": "0"});
w.element.css({
position: "relative",
"flex-shrink": "0"
});
if (o.rowSize[i] > 0) {
w.element.height(o.rowSize[i]);
}
if (o.rowSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
"margin-top": (i === 0 ? o.vgap : 0) + 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"
"margin-left": o.hgap + o.lgap + (item.lgap || 0) + (item.hgap || 0) + "px"
});
}
if (o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0) !== 0) {
@ -31689,15 +31816,15 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_vertical_center布局不需要resize");
// console.log("flex_vertical布局不需要resize");
},
populate: function (items) {
BI.FlexVerticalCenter.superclass.populate.apply(this, arguments);
BI.FlexVerticalLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.flex_vertical_center", BI.FlexVerticalCenter);/**
BI.shortcut("bi.flex_vertical", BI.FlexVerticalLayout);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
@ -31712,7 +31839,7 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
},
render: function () {
BI.FlexCenterLayout.superclass.render.apply(this, arguments);
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-center-layout-wrapper");
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-center-adapt-layout-wrapper");
this.populate(this.options.items);
},
@ -31733,7 +31860,7 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_center布局不需要resize");
// console.log("flex_center_adapt布局不需要resize");
},
populate: function (items) {
@ -31741,20 +31868,73 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
this._mount();
}
});
BI.shortcut("bi.flex_wrapper_center", BI.FlexCenterLayout);/**
BI.shortcut("bi.flex_wrapper_center_adapt", BI.FlexCenterLayout);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexVerticalCenter
* @extends BI.Layout
*/
BI.FlexWrapperHorizontalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexWrapperHorizontalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-center-adapt-layout clearfix",
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrollable: null,
scrolly: true,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
var self = this, o = this.options;
return {
type: "bi.flex_wrapper_vertical",
ref: function (_ref) {
self.wrapper = _ref;
},
horizontalAlign: BI.HorizontalAlign.Center,
verticalAlign: o.verticalAlign,
rowSize: o.rowSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
populate: function (items) {
this.wrapper.populate(items);
}
});
BI.shortcut("bi.flex_wrapper_horizontal_adapt", BI.FlexWrapperHorizontalCenter);
BI.shortcut("bi.flex_wrapper_horizontal_center_adapt", BI.FlexWrapperHorizontalCenter);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexHorizontalLayout
* @extends BI.Layout
*/
BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
BI.FlexWrapperHorizontalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexHorizontalLayout.superclass.props.apply(this, arguments), {
return BI.extend(BI.FlexWrapperHorizontalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-horizontal-layout clearfix",
verticalAlign: BI.VerticalAlign.Middle,
verticalAlign: BI.VerticalAlign.Top,
horizontalAlign: BI.HorizontalAlign.Left,
columnSize: [],
// scrollable: true,
scrollable: null,
scrollx: true,
hgap: 0,
vgap: 0,
lgap: 0,
@ -31764,16 +31944,22 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
});
},
render: function () {
BI.FlexHorizontalLayout.superclass.render.apply(this, arguments);
BI.FlexWrapperHorizontalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-horizontal-layout-wrapper " + o.verticalAlign);
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-horizontal-layout-wrapper v-" + o.verticalAlign).addClass("h-" + o.horizontalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.FlexHorizontalLayout.superclass._addElement.apply(this, arguments);
var w = BI.FlexWrapperHorizontalLayout.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative"});
if (o.columnSize[i] > 0) {
w.element.width(o.columnSize[i]);
}
if (o.columnSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
@ -31781,7 +31967,7 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
}
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"
"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) {
@ -31807,28 +31993,28 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_horizontal布局不需要resize");
// console.log("flex_wrapper_horizontal布局不需要resize");
},
populate: function (items) {
BI.FlexHorizontalLayout.superclass.populate.apply(this, arguments);
BI.FlexWrapperHorizontalLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.flex_wrapper_horizontal", BI.FlexHorizontalLayout);/**
BI.shortcut("bi.flex_wrapper_horizontal", BI.FlexWrapperHorizontalLayout);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexVerticalCenter
* @extends BI.Layout
*/
BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
BI.FlexWrapperVerticalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexVerticalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-center clearfix",
horizontalAlign: BI.HorizontalAlign.Middle,
return BI.extend(BI.FlexWrapperVerticalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-center-adapt-layout clearfix",
horizontalAlign: BI.HorizontalAlign.Left,
columnSize: [],
// scrollable: true,
scrollx: true,
hgap: 0,
vgap: 0,
lgap: 0,
@ -31838,24 +32024,82 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
});
},
render: function () {
BI.FlexVerticalCenter.superclass.render.apply(this, arguments);
var self = this, o = this.options;
return {
type: "bi.flex_wrapper_horizontal",
ref: function (_ref) {
self.wrapper = _ref;
},
verticalAlign: BI.VerticalAlign.Middle,
horizontalAlign: o.horizontalAlign,
columnSize: o.columnSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
populate: function (items) {
this.wrapper.populate(items);
}
});
BI.shortcut("bi.flex_wrapper_vertical_adapt", BI.FlexWrapperVerticalCenter);
BI.shortcut("bi.flex_wrapper_vertical_center_adapt", BI.FlexWrapperVerticalCenter);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexWrapperVerticalLayout
* @extends BI.Layout
*/
BI.FlexWrapperVerticalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexWrapperVerticalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-layout clearfix",
horizontalAlign: BI.HorizontalAlign.Left,
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrollable: null,
scrolly: true,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
BI.FlexWrapperVerticalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-vertical-center-wrapper " + o.horizontalAlign);
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-vertical-layout-wrapper h-" + o.horizontalAlign).addClass("v-" + o.verticalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.FlexVerticalCenter.superclass._addElement.apply(this, arguments);
var w = BI.FlexWrapperVerticalLayout.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative"});
if (o.rowSize[i] > 0) {
w.element.height(o.rowSize[i]);
}
if (o.rowSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
"margin-top": (i === 0 ? o.vgap : 0) + 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"
"margin-left": o.hgap + o.lgap + (item.lgap || 0) + (item.hgap || 0) + "px"
});
}
if (o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0) !== 0) {
@ -31881,15 +32125,15 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_vertical_center布局不需要resize");
// console.log("flex_wrapper_vertical布局不需要resize");
},
populate: function (items) {
BI.FlexVerticalCenter.superclass.populate.apply(this, arguments);
BI.FlexWrapperVerticalLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.flex_wrapper_vertical_center", BI.FlexVerticalCenter);/**
BI.shortcut("bi.flex_wrapper_vertical", BI.FlexWrapperVerticalLayout);/**
* 固定子组件上下左右的布局容器
* @class BI.AbsoluteLayout
* @extends BI.Layout

66
dist/fineui.ie.min.js vendored

File diff suppressed because one or more lines are too long

354
dist/fineui.js vendored

@ -19403,12 +19403,12 @@ BI.prepares.push(function () {
BI.Plugin.registerWidget("bi.center_adapt", function (ob) {
var isIE = BI.isIE(), supportFlex = isSupportFlex(), justOneItem = (ob.items && ob.items.length <= 1);
if (!isIE && supportFlex && justOneItem) {
// 有滚动条的情况下需要用到flex_wrapper_center布局
// 有滚动条的情况下需要用到flex_wrapper_center_adapt布局
if (ob.scrollable === true || ob.scrollx === true || ob.scrolly === true) {
// 不是IE用flex_wrapper_center布局
return BI.extend(ob, {type: "bi.flex_wrapper_center"});
// 不是IE用flex_wrapper_center_adapt布局
return BI.extend(ob, {type: "bi.flex_wrapper_center_adapt"});
}
return BI.extend(ob, {type: "bi.flex_center"});
return BI.extend(ob, {type: "bi.flex_center_adapt"});
}
// 一个item的情况下inline布局睥睨天下
if(justOneItem) {
@ -19419,12 +19419,12 @@ BI.prepares.push(function () {
BI.Plugin.registerWidget("bi.vertical_adapt", function (ob) {
var isIE = BI.isIE(), supportFlex = isSupportFlex();
if (!isIE && supportFlex) {
// 有滚动条的情况下需要用到flex_wrapper_center布局
// 有滚动条的情况下需要用到flex_wrapper_center_adapt布局
if (ob.scrollable === true || ob.scrollx === true || ob.scrolly === true) {
// 不是IE用flex_wrapper_center布局
return BI.extend({}, ob, {type: "bi.flex_wrapper_vertical_center"});
// 不是IE用flex_wrapper_center_adapt布局
return BI.extend({}, ob, {type: "bi.flex_wrapper_vertical_center_adapt"});
}
return BI.extend(ob, {type: "bi.flex_vertical_center"});
return BI.extend(ob, {type: "bi.flex_vertical_center_adapt"});
}
return BI.extend(ob, {type: "bi.inline_vertical_adapt"});
});
@ -19436,12 +19436,12 @@ BI.prepares.push(function () {
});
BI.Plugin.registerWidget("bi.float_center_adapt", function (ob) {
if (!BI.isIE() && isSupportFlex()) {
// 有滚动条的情况下需要用到flex_wrapper_center布局
// 有滚动条的情况下需要用到flex_wrapper_center_adapt布局
if (ob.scrollable === true || ob.scrollx === true || ob.scrolly === true) {
// 不是IE用flex_wrapper_center布局
return BI.extend({}, ob, {type: "bi.flex_wrapper_center"});
// 不是IE用flex_wrapper_center_adapt布局
return BI.extend({}, ob, {type: "bi.flex_wrapper_center_adapt"});
}
return BI.extend(ob, {type: "bi.flex_center"});
return BI.extend(ob, {type: "bi.flex_center_adapt"});
}
return BI.extend(ob, {type: "bi.inline_center_adapt"});
});
@ -31544,7 +31544,7 @@ BI.shortcut("bi.inline_vertical_adapt", BI.InlineVerticalAdaptLayout);/**
BI.FlexCenterLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexCenterLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-center-layout"
baseCls: "bi-flex-center-adapt-layout"
});
},
render: function () {
@ -31560,7 +31560,7 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_center布局不需要resize");
// console.log("flex_center_adapt布局不需要resize");
},
populate: function (items) {
@ -31568,7 +31568,60 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
this._mount();
}
});
BI.shortcut("bi.flex_center", BI.FlexCenterLayout);/**
BI.shortcut("bi.flex_center_adapt", BI.FlexCenterLayout);/**
* Created by GUY on 2016/12/2.
*
* @class BI.FlexHorizontalCenter
* @extends BI.Layout
*/
BI.FlexHorizontalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexHorizontalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-horizontal-center-adapt-layout",
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrolly: false,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
var self = this, o = this.options;
return {
type: "bi.flex_vertical",
ref: function (_ref) {
self.wrapper = _ref;
},
horizontalAlign: BI.HorizontalAlign.Center,
verticalAlign: o.verticalAlign,
rowSize: o.rowSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
resize: function () {
// console.log("flex_vertical_center_adapt布局不需要resize");
},
populate: function (items) {
self.populate(items);
}
});
BI.shortcut("bi.flex_horizontal_adapt", BI.FlexHorizontalCenter);
BI.shortcut("bi.flex_horizontal_adapt", BI.FlexHorizontalCenter);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
@ -31580,6 +31633,7 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
return BI.extend(BI.FlexHorizontalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-horizontal-layout",
verticalAlign: BI.VerticalAlign.Top,
horizontalAlign: BI.HorizontalAlign.Left,// 如果只有一个子元素且想让该子元素横向撑满,设置成Stretch
columnSize: [],
scrollx: true,
hgap: 0,
@ -31593,14 +31647,23 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
render: function () {
BI.FlexHorizontalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.element.addClass(o.verticalAlign);
this.element.addClass("v-" + o.verticalAlign).addClass("h-" + o.horizontalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.FlexHorizontalLayout.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative", "flex-shrink": "0"});
w.element.css({
position: "relative",
"flex-shrink": "0"
});
if (o.columnSize[i] > 0) {
w.element.width(o.columnSize[i]);
}
if (o.columnSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
@ -31608,7 +31671,7 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
}
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"
"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) {
@ -31643,9 +31706,64 @@ BI.shortcut("bi.flex_horizontal", BI.FlexHorizontalLayout);/**
BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexVerticalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-vertical-center",
baseCls: "bi-flex-vertical-center-adapt-layout",
horizontalAlign: BI.HorizontalAlign.Left,
columnSize: [],
scrollx: false,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
var self = this, o = this.options;
return {
type: "bi.flex_horizontal",
ref: function (_ref) {
self.wrapper = _ref;
},
verticalAlign: BI.VerticalAlign.Middle,
horizontalAlign: o.horizontalAlign,
columnSize: o.columnSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
resize: function () {
// console.log("flex_vertical_center_adapt布局不需要resize");
},
populate: function (items) {
self.populate(items);
}
});
BI.shortcut("bi.flex_vertical_adapt", BI.FlexVerticalCenter);
BI.shortcut("bi.flex_vertical_center_adapt", BI.FlexVerticalCenter);/**
* Created by GUY on 2016/12/2.
*
* @class BI.FlexVerticalLayout
* @extends BI.Layout
*/
BI.FlexVerticalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexVerticalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-vertical-layout",
horizontalAlign: BI.HorizontalAlign.Left,
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrolly: true,
hgap: 0,
vgap: 0,
lgap: 0,
@ -31655,24 +31773,33 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
});
},
render: function () {
BI.FlexVerticalCenter.superclass.render.apply(this, arguments);
BI.FlexVerticalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.element.addClass(o.horizontalAlign);
this.element.addClass("h-" + o.horizontalAlign).addClass("v-" + o.verticalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var w = BI.FlexVerticalLayout.superclass._addElement.apply(this, arguments);
var o = this.options;
var w = BI.FlexVerticalCenter.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative", "flex-shrink": "0"});
w.element.css({
position: "relative",
"flex-shrink": "0"
});
if (o.rowSize[i] > 0) {
w.element.height(o.rowSize[i]);
}
if (o.rowSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
"margin-top": (i === 0 ? o.vgap : 0) + 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"
"margin-left": o.hgap + o.lgap + (item.lgap || 0) + (item.hgap || 0) + "px"
});
}
if (o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0) !== 0) {
@ -31689,15 +31816,15 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_vertical_center布局不需要resize");
// console.log("flex_vertical布局不需要resize");
},
populate: function (items) {
BI.FlexVerticalCenter.superclass.populate.apply(this, arguments);
BI.FlexVerticalLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.flex_vertical_center", BI.FlexVerticalCenter);/**
BI.shortcut("bi.flex_vertical", BI.FlexVerticalLayout);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
@ -31712,7 +31839,7 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
},
render: function () {
BI.FlexCenterLayout.superclass.render.apply(this, arguments);
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-center-layout-wrapper");
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-center-adapt-layout-wrapper");
this.populate(this.options.items);
},
@ -31733,7 +31860,7 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_center布局不需要resize");
// console.log("flex_center_adapt布局不需要resize");
},
populate: function (items) {
@ -31741,20 +31868,73 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
this._mount();
}
});
BI.shortcut("bi.flex_wrapper_center", BI.FlexCenterLayout);/**
BI.shortcut("bi.flex_wrapper_center_adapt", BI.FlexCenterLayout);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexVerticalCenter
* @extends BI.Layout
*/
BI.FlexWrapperHorizontalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexWrapperHorizontalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-center-adapt-layout clearfix",
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrollable: null,
scrolly: true,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
var self = this, o = this.options;
return {
type: "bi.flex_wrapper_vertical",
ref: function (_ref) {
self.wrapper = _ref;
},
horizontalAlign: BI.HorizontalAlign.Center,
verticalAlign: o.verticalAlign,
rowSize: o.rowSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
populate: function (items) {
this.wrapper.populate(items);
}
});
BI.shortcut("bi.flex_wrapper_horizontal_adapt", BI.FlexWrapperHorizontalCenter);
BI.shortcut("bi.flex_wrapper_horizontal_center_adapt", BI.FlexWrapperHorizontalCenter);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexHorizontalLayout
* @extends BI.Layout
*/
BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
BI.FlexWrapperHorizontalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexHorizontalLayout.superclass.props.apply(this, arguments), {
return BI.extend(BI.FlexWrapperHorizontalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-horizontal-layout clearfix",
verticalAlign: BI.VerticalAlign.Middle,
verticalAlign: BI.VerticalAlign.Top,
horizontalAlign: BI.HorizontalAlign.Left,
columnSize: [],
// scrollable: true,
scrollable: null,
scrollx: true,
hgap: 0,
vgap: 0,
lgap: 0,
@ -31764,16 +31944,22 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
});
},
render: function () {
BI.FlexHorizontalLayout.superclass.render.apply(this, arguments);
BI.FlexWrapperHorizontalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-horizontal-layout-wrapper " + o.verticalAlign);
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-horizontal-layout-wrapper v-" + o.verticalAlign).addClass("h-" + o.horizontalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.FlexHorizontalLayout.superclass._addElement.apply(this, arguments);
var w = BI.FlexWrapperHorizontalLayout.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative"});
if (o.columnSize[i] > 0) {
w.element.width(o.columnSize[i]);
}
if (o.columnSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
@ -31781,7 +31967,7 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
}
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"
"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) {
@ -31807,28 +31993,28 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_horizontal布局不需要resize");
// console.log("flex_wrapper_horizontal布局不需要resize");
},
populate: function (items) {
BI.FlexHorizontalLayout.superclass.populate.apply(this, arguments);
BI.FlexWrapperHorizontalLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.flex_wrapper_horizontal", BI.FlexHorizontalLayout);/**
BI.shortcut("bi.flex_wrapper_horizontal", BI.FlexWrapperHorizontalLayout);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexVerticalCenter
* @extends BI.Layout
*/
BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
BI.FlexWrapperVerticalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexVerticalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-center clearfix",
horizontalAlign: BI.HorizontalAlign.Middle,
return BI.extend(BI.FlexWrapperVerticalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-center-adapt-layout clearfix",
horizontalAlign: BI.HorizontalAlign.Left,
columnSize: [],
// scrollable: true,
scrollx: true,
hgap: 0,
vgap: 0,
lgap: 0,
@ -31838,24 +32024,82 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
});
},
render: function () {
BI.FlexVerticalCenter.superclass.render.apply(this, arguments);
var self = this, o = this.options;
return {
type: "bi.flex_wrapper_horizontal",
ref: function (_ref) {
self.wrapper = _ref;
},
verticalAlign: BI.VerticalAlign.Middle,
horizontalAlign: o.horizontalAlign,
columnSize: o.columnSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
populate: function (items) {
this.wrapper.populate(items);
}
});
BI.shortcut("bi.flex_wrapper_vertical_adapt", BI.FlexWrapperVerticalCenter);
BI.shortcut("bi.flex_wrapper_vertical_center_adapt", BI.FlexWrapperVerticalCenter);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexWrapperVerticalLayout
* @extends BI.Layout
*/
BI.FlexWrapperVerticalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexWrapperVerticalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-layout clearfix",
horizontalAlign: BI.HorizontalAlign.Left,
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrollable: null,
scrolly: true,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
BI.FlexWrapperVerticalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-vertical-center-wrapper " + o.horizontalAlign);
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-vertical-layout-wrapper h-" + o.horizontalAlign).addClass("v-" + o.verticalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.FlexVerticalCenter.superclass._addElement.apply(this, arguments);
var w = BI.FlexWrapperVerticalLayout.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative"});
if (o.rowSize[i] > 0) {
w.element.height(o.rowSize[i]);
}
if (o.rowSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
"margin-top": (i === 0 ? o.vgap : 0) + 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"
"margin-left": o.hgap + o.lgap + (item.lgap || 0) + (item.hgap || 0) + "px"
});
}
if (o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0) !== 0) {
@ -31881,15 +32125,15 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_vertical_center布局不需要resize");
// console.log("flex_wrapper_vertical布局不需要resize");
},
populate: function (items) {
BI.FlexVerticalCenter.superclass.populate.apply(this, arguments);
BI.FlexWrapperVerticalLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.flex_wrapper_vertical_center", BI.FlexVerticalCenter);/**
BI.shortcut("bi.flex_wrapper_vertical", BI.FlexWrapperVerticalLayout);/**
* 固定子组件上下左右的布局容器
* @class BI.AbsoluteLayout
* @extends BI.Layout

2
dist/fineui.min.css vendored

File diff suppressed because one or more lines are too long

66
dist/fineui.min.js vendored

File diff suppressed because one or more lines are too long

330
dist/fineui_without_jquery_polyfill.js vendored

@ -20225,7 +20225,7 @@ BI.shortcut("bi.inline_vertical_adapt", BI.InlineVerticalAdaptLayout);/**
BI.FlexCenterLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexCenterLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-center-layout"
baseCls: "bi-flex-center-adapt-layout"
});
},
render: function () {
@ -20241,7 +20241,7 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_center布局不需要resize");
// console.log("flex_center_adapt布局不需要resize");
},
populate: function (items) {
@ -20249,7 +20249,60 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
this._mount();
}
});
BI.shortcut("bi.flex_center", BI.FlexCenterLayout);/**
BI.shortcut("bi.flex_center_adapt", BI.FlexCenterLayout);/**
* Created by GUY on 2016/12/2.
*
* @class BI.FlexHorizontalCenter
* @extends BI.Layout
*/
BI.FlexHorizontalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexHorizontalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-horizontal-center-adapt-layout",
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrolly: false,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
var self = this, o = this.options;
return {
type: "bi.flex_vertical",
ref: function (_ref) {
self.wrapper = _ref;
},
horizontalAlign: BI.HorizontalAlign.Center,
verticalAlign: o.verticalAlign,
rowSize: o.rowSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
resize: function () {
// console.log("flex_vertical_center_adapt布局不需要resize");
},
populate: function (items) {
self.populate(items);
}
});
BI.shortcut("bi.flex_horizontal_adapt", BI.FlexHorizontalCenter);
BI.shortcut("bi.flex_horizontal_adapt", BI.FlexHorizontalCenter);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
@ -20261,6 +20314,7 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
return BI.extend(BI.FlexHorizontalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-horizontal-layout",
verticalAlign: BI.VerticalAlign.Top,
horizontalAlign: BI.HorizontalAlign.Left,// 如果只有一个子元素且想让该子元素横向撑满,设置成Stretch
columnSize: [],
scrollx: true,
hgap: 0,
@ -20274,14 +20328,23 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
render: function () {
BI.FlexHorizontalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.element.addClass(o.verticalAlign);
this.element.addClass("v-" + o.verticalAlign).addClass("h-" + o.horizontalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.FlexHorizontalLayout.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative", "flex-shrink": "0"});
w.element.css({
position: "relative",
"flex-shrink": "0"
});
if (o.columnSize[i] > 0) {
w.element.width(o.columnSize[i]);
}
if (o.columnSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
@ -20289,7 +20352,7 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
}
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"
"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) {
@ -20324,9 +20387,64 @@ BI.shortcut("bi.flex_horizontal", BI.FlexHorizontalLayout);/**
BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexVerticalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-vertical-center",
baseCls: "bi-flex-vertical-center-adapt-layout",
horizontalAlign: BI.HorizontalAlign.Left,
columnSize: [],
scrollx: false,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
var self = this, o = this.options;
return {
type: "bi.flex_horizontal",
ref: function (_ref) {
self.wrapper = _ref;
},
verticalAlign: BI.VerticalAlign.Middle,
horizontalAlign: o.horizontalAlign,
columnSize: o.columnSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
resize: function () {
// console.log("flex_vertical_center_adapt布局不需要resize");
},
populate: function (items) {
self.populate(items);
}
});
BI.shortcut("bi.flex_vertical_adapt", BI.FlexVerticalCenter);
BI.shortcut("bi.flex_vertical_center_adapt", BI.FlexVerticalCenter);/**
* Created by GUY on 2016/12/2.
*
* @class BI.FlexVerticalLayout
* @extends BI.Layout
*/
BI.FlexVerticalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexVerticalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-vertical-layout",
horizontalAlign: BI.HorizontalAlign.Left,
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrolly: true,
hgap: 0,
vgap: 0,
lgap: 0,
@ -20336,24 +20454,33 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
});
},
render: function () {
BI.FlexVerticalCenter.superclass.render.apply(this, arguments);
BI.FlexVerticalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.element.addClass(o.horizontalAlign);
this.element.addClass("h-" + o.horizontalAlign).addClass("v-" + o.verticalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var w = BI.FlexVerticalLayout.superclass._addElement.apply(this, arguments);
var o = this.options;
var w = BI.FlexVerticalCenter.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative", "flex-shrink": "0"});
w.element.css({
position: "relative",
"flex-shrink": "0"
});
if (o.rowSize[i] > 0) {
w.element.height(o.rowSize[i]);
}
if (o.rowSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
"margin-top": (i === 0 ? o.vgap : 0) + 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"
"margin-left": o.hgap + o.lgap + (item.lgap || 0) + (item.hgap || 0) + "px"
});
}
if (o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0) !== 0) {
@ -20370,15 +20497,15 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_vertical_center布局不需要resize");
// console.log("flex_vertical布局不需要resize");
},
populate: function (items) {
BI.FlexVerticalCenter.superclass.populate.apply(this, arguments);
BI.FlexVerticalLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.flex_vertical_center", BI.FlexVerticalCenter);/**
BI.shortcut("bi.flex_vertical", BI.FlexVerticalLayout);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
@ -20393,7 +20520,7 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
},
render: function () {
BI.FlexCenterLayout.superclass.render.apply(this, arguments);
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-center-layout-wrapper");
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-center-adapt-layout-wrapper");
this.populate(this.options.items);
},
@ -20414,7 +20541,7 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_center布局不需要resize");
// console.log("flex_center_adapt布局不需要resize");
},
populate: function (items) {
@ -20422,20 +20549,73 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
this._mount();
}
});
BI.shortcut("bi.flex_wrapper_center", BI.FlexCenterLayout);/**
BI.shortcut("bi.flex_wrapper_center_adapt", BI.FlexCenterLayout);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexVerticalCenter
* @extends BI.Layout
*/
BI.FlexWrapperHorizontalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexWrapperHorizontalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-center-adapt-layout clearfix",
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrollable: null,
scrolly: true,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
var self = this, o = this.options;
return {
type: "bi.flex_wrapper_vertical",
ref: function (_ref) {
self.wrapper = _ref;
},
horizontalAlign: BI.HorizontalAlign.Center,
verticalAlign: o.verticalAlign,
rowSize: o.rowSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
populate: function (items) {
this.wrapper.populate(items);
}
});
BI.shortcut("bi.flex_wrapper_horizontal_adapt", BI.FlexWrapperHorizontalCenter);
BI.shortcut("bi.flex_wrapper_horizontal_center_adapt", BI.FlexWrapperHorizontalCenter);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexHorizontalLayout
* @extends BI.Layout
*/
BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
BI.FlexWrapperHorizontalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexHorizontalLayout.superclass.props.apply(this, arguments), {
return BI.extend(BI.FlexWrapperHorizontalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-horizontal-layout clearfix",
verticalAlign: BI.VerticalAlign.Middle,
verticalAlign: BI.VerticalAlign.Top,
horizontalAlign: BI.HorizontalAlign.Left,
columnSize: [],
// scrollable: true,
scrollable: null,
scrollx: true,
hgap: 0,
vgap: 0,
lgap: 0,
@ -20445,16 +20625,22 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
});
},
render: function () {
BI.FlexHorizontalLayout.superclass.render.apply(this, arguments);
BI.FlexWrapperHorizontalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-horizontal-layout-wrapper " + o.verticalAlign);
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-horizontal-layout-wrapper v-" + o.verticalAlign).addClass("h-" + o.horizontalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.FlexHorizontalLayout.superclass._addElement.apply(this, arguments);
var w = BI.FlexWrapperHorizontalLayout.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative"});
if (o.columnSize[i] > 0) {
w.element.width(o.columnSize[i]);
}
if (o.columnSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
@ -20462,7 +20648,7 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
}
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"
"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) {
@ -20488,28 +20674,28 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_horizontal布局不需要resize");
// console.log("flex_wrapper_horizontal布局不需要resize");
},
populate: function (items) {
BI.FlexHorizontalLayout.superclass.populate.apply(this, arguments);
BI.FlexWrapperHorizontalLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.flex_wrapper_horizontal", BI.FlexHorizontalLayout);/**
BI.shortcut("bi.flex_wrapper_horizontal", BI.FlexWrapperHorizontalLayout);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexVerticalCenter
* @extends BI.Layout
*/
BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
BI.FlexWrapperVerticalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexVerticalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-center clearfix",
horizontalAlign: BI.HorizontalAlign.Middle,
return BI.extend(BI.FlexWrapperVerticalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-center-adapt-layout clearfix",
horizontalAlign: BI.HorizontalAlign.Left,
columnSize: [],
// scrollable: true,
scrollx: true,
hgap: 0,
vgap: 0,
lgap: 0,
@ -20519,24 +20705,82 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
});
},
render: function () {
BI.FlexVerticalCenter.superclass.render.apply(this, arguments);
var self = this, o = this.options;
return {
type: "bi.flex_wrapper_horizontal",
ref: function (_ref) {
self.wrapper = _ref;
},
verticalAlign: BI.VerticalAlign.Middle,
horizontalAlign: o.horizontalAlign,
columnSize: o.columnSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
populate: function (items) {
this.wrapper.populate(items);
}
});
BI.shortcut("bi.flex_wrapper_vertical_adapt", BI.FlexWrapperVerticalCenter);
BI.shortcut("bi.flex_wrapper_vertical_center_adapt", BI.FlexWrapperVerticalCenter);/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexWrapperVerticalLayout
* @extends BI.Layout
*/
BI.FlexWrapperVerticalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexWrapperVerticalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-layout clearfix",
horizontalAlign: BI.HorizontalAlign.Left,
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrollable: null,
scrolly: true,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
BI.FlexWrapperVerticalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-vertical-center-wrapper " + o.horizontalAlign);
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-vertical-layout-wrapper h-" + o.horizontalAlign).addClass("v-" + o.verticalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.FlexVerticalCenter.superclass._addElement.apply(this, arguments);
var w = BI.FlexWrapperVerticalLayout.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative"});
if (o.rowSize[i] > 0) {
w.element.height(o.rowSize[i]);
}
if (o.rowSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
"margin-top": (i === 0 ? o.vgap : 0) + 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"
"margin-left": o.hgap + o.lgap + (item.lgap || 0) + (item.hgap || 0) + "px"
});
}
if (o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0) !== 0) {
@ -20562,15 +20806,15 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_vertical_center布局不需要resize");
// console.log("flex_wrapper_vertical布局不需要resize");
},
populate: function (items) {
BI.FlexVerticalCenter.superclass.populate.apply(this, arguments);
BI.FlexWrapperVerticalLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.flex_wrapper_vertical_center", BI.FlexVerticalCenter);/**
BI.shortcut("bi.flex_wrapper_vertical", BI.FlexWrapperVerticalLayout);/**
* 固定子组件上下左右的布局容器
* @class BI.AbsoluteLayout
* @extends BI.Layout

2
dist/utils.min.js vendored

File diff suppressed because one or more lines are too long

24
src/core/platform/web/config.js

@ -47,12 +47,12 @@ BI.prepares.push(function () {
BI.Plugin.registerWidget("bi.center_adapt", function (ob) {
var isIE = BI.isIE(), supportFlex = isSupportFlex(), justOneItem = (ob.items && ob.items.length <= 1);
if (!isIE && supportFlex && justOneItem) {
// 有滚动条的情况下需要用到flex_wrapper_center布局
// 有滚动条的情况下需要用到flex_wrapper_center_adapt布局
if (ob.scrollable === true || ob.scrollx === true || ob.scrolly === true) {
// 不是IE用flex_wrapper_center布局
return BI.extend(ob, {type: "bi.flex_wrapper_center"});
// 不是IE用flex_wrapper_center_adapt布局
return BI.extend(ob, {type: "bi.flex_wrapper_center_adapt"});
}
return BI.extend(ob, {type: "bi.flex_center"});
return BI.extend(ob, {type: "bi.flex_center_adapt"});
}
// 一个item的情况下inline布局睥睨天下
if(justOneItem) {
@ -63,12 +63,12 @@ BI.prepares.push(function () {
BI.Plugin.registerWidget("bi.vertical_adapt", function (ob) {
var isIE = BI.isIE(), supportFlex = isSupportFlex();
if (!isIE && supportFlex) {
// 有滚动条的情况下需要用到flex_wrapper_center布局
// 有滚动条的情况下需要用到flex_wrapper_center_adapt布局
if (ob.scrollable === true || ob.scrollx === true || ob.scrolly === true) {
// 不是IE用flex_wrapper_center布局
return BI.extend({}, ob, {type: "bi.flex_wrapper_vertical_center"});
// 不是IE用flex_wrapper_center_adapt布局
return BI.extend({}, ob, {type: "bi.flex_wrapper_vertical_center_adapt"});
}
return BI.extend(ob, {type: "bi.flex_vertical_center"});
return BI.extend(ob, {type: "bi.flex_vertical_center_adapt"});
}
return BI.extend(ob, {type: "bi.inline_vertical_adapt"});
});
@ -80,12 +80,12 @@ BI.prepares.push(function () {
});
BI.Plugin.registerWidget("bi.float_center_adapt", function (ob) {
if (!BI.isIE() && isSupportFlex()) {
// 有滚动条的情况下需要用到flex_wrapper_center布局
// 有滚动条的情况下需要用到flex_wrapper_center_adapt布局
if (ob.scrollable === true || ob.scrollx === true || ob.scrolly === true) {
// 不是IE用flex_wrapper_center布局
return BI.extend({}, ob, {type: "bi.flex_wrapper_center"});
// 不是IE用flex_wrapper_center_adapt布局
return BI.extend({}, ob, {type: "bi.flex_wrapper_center_adapt"});
}
return BI.extend(ob, {type: "bi.flex_center"});
return BI.extend(ob, {type: "bi.flex_center_adapt"});
}
return BI.extend(ob, {type: "bi.inline_center_adapt"});
});

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

@ -8,7 +8,7 @@
BI.FlexCenterLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexCenterLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-center-layout"
baseCls: "bi-flex-center-adapt-layout"
});
},
render: function () {
@ -24,7 +24,7 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_center布局不需要resize");
// console.log("flex_center_adapt布局不需要resize");
},
populate: function (items) {
@ -32,4 +32,4 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
this._mount();
}
});
BI.shortcut("bi.flex_center", BI.FlexCenterLayout);
BI.shortcut("bi.flex_center_adapt", BI.FlexCenterLayout);

54
src/core/wrapper/layout/flex/flex.horizontal.center.js

@ -0,0 +1,54 @@
/**
* Created by GUY on 2016/12/2.
*
* @class BI.FlexHorizontalCenter
* @extends BI.Layout
*/
BI.FlexHorizontalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexHorizontalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-horizontal-center-adapt-layout",
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrolly: false,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
var self = this, o = this.options;
return {
type: "bi.flex_vertical",
ref: function (_ref) {
self.wrapper = _ref;
},
horizontalAlign: BI.HorizontalAlign.Center,
verticalAlign: o.verticalAlign,
rowSize: o.rowSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
resize: function () {
// console.log("flex_vertical_center_adapt布局不需要resize");
},
populate: function (items) {
self.populate(items);
}
});
BI.shortcut("bi.flex_horizontal_adapt", BI.FlexHorizontalCenter);
BI.shortcut("bi.flex_horizontal_adapt", BI.FlexHorizontalCenter);

16
src/core/wrapper/layout/flex/flex.horizontal.js

@ -10,6 +10,7 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
return BI.extend(BI.FlexHorizontalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-horizontal-layout",
verticalAlign: BI.VerticalAlign.Top,
horizontalAlign: BI.HorizontalAlign.Left,// 如果只有一个子元素且想让该子元素横向撑满,设置成Stretch
columnSize: [],
scrollx: true,
hgap: 0,
@ -23,14 +24,23 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
render: function () {
BI.FlexHorizontalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.element.addClass(o.verticalAlign);
this.element.addClass("v-" + o.verticalAlign).addClass("h-" + o.horizontalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.FlexHorizontalLayout.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative", "flex-shrink": "0"});
w.element.css({
position: "relative",
"flex-shrink": "0"
});
if (o.columnSize[i] > 0) {
w.element.width(o.columnSize[i]);
}
if (o.columnSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
@ -38,7 +48,7 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
}
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"
"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) {

62
src/core/wrapper/layout/flex/flex.vertical.center.js

@ -8,9 +8,10 @@
BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexVerticalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-vertical-center",
baseCls: "bi-flex-vertical-center-adapt-layout",
horizontalAlign: BI.HorizontalAlign.Left,
columnSize: [],
scrollx: false,
hgap: 0,
vgap: 0,
lgap: 0,
@ -20,46 +21,35 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
});
},
render: function () {
BI.FlexVerticalCenter.superclass.render.apply(this, arguments);
var o = this.options;
this.element.addClass(o.horizontalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.FlexVerticalCenter.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative", "flex-shrink": "0"});
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 w;
var self = this, o = this.options;
return {
type: "bi.flex_horizontal",
ref: function (_ref) {
self.wrapper = _ref;
},
verticalAlign: BI.VerticalAlign.Middle,
horizontalAlign: o.horizontalAlign,
columnSize: o.columnSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
resize: function () {
// console.log("flex_vertical_center布局不需要resize");
// console.log("flex_vertical_center_adapt布局不需要resize");
},
populate: function (items) {
BI.FlexVerticalCenter.superclass.populate.apply(this, arguments);
this._mount();
self.populate(items);
}
});
BI.shortcut("bi.flex_vertical_center", BI.FlexVerticalCenter);
BI.shortcut("bi.flex_vertical_adapt", BI.FlexVerticalCenter);
BI.shortcut("bi.flex_vertical_center_adapt", BI.FlexVerticalCenter);

75
src/core/wrapper/layout/flex/flex.vertical.js

@ -0,0 +1,75 @@
/**
* Created by GUY on 2016/12/2.
*
* @class BI.FlexVerticalLayout
* @extends BI.Layout
*/
BI.FlexVerticalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexVerticalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-vertical-layout",
horizontalAlign: BI.HorizontalAlign.Left,
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrolly: true,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
BI.FlexVerticalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.element.addClass("h-" + o.horizontalAlign).addClass("v-" + o.verticalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var w = BI.FlexVerticalLayout.superclass._addElement.apply(this, arguments);
var o = this.options;
w.element.css({
position: "relative",
"flex-shrink": "0"
});
if (o.rowSize[i] > 0) {
w.element.height(o.rowSize[i]);
}
if (o.rowSize[i] === "fill") {
w.element.css("flex", "1");
}
if (o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0) !== 0) {
w.element.css({
"margin-top": (i === 0 ? o.vgap : 0) + 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": o.hgap + 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 w;
},
resize: function () {
// console.log("flex_vertical布局不需要resize");
},
populate: function (items) {
BI.FlexVerticalLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.flex_vertical", BI.FlexVerticalLayout);

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

@ -13,7 +13,7 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
},
render: function () {
BI.FlexCenterLayout.superclass.render.apply(this, arguments);
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-center-layout-wrapper");
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-center-adapt-layout-wrapper");
this.populate(this.options.items);
},
@ -34,7 +34,7 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_center布局不需要resize");
// console.log("flex_center_adapt布局不需要resize");
},
populate: function (items) {
@ -42,4 +42,4 @@ BI.FlexCenterLayout = BI.inherit(BI.Layout, {
this._mount();
}
});
BI.shortcut("bi.flex_wrapper_center", BI.FlexCenterLayout);
BI.shortcut("bi.flex_wrapper_center_adapt", BI.FlexCenterLayout);

52
src/core/wrapper/layout/flex/wrapper/flex.wrapper.horizontal.center.js

@ -0,0 +1,52 @@
/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexVerticalCenter
* @extends BI.Layout
*/
BI.FlexWrapperHorizontalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexWrapperHorizontalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-center-adapt-layout clearfix",
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrollable: null,
scrolly: true,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
var self = this, o = this.options;
return {
type: "bi.flex_wrapper_vertical",
ref: function (_ref) {
self.wrapper = _ref;
},
horizontalAlign: BI.HorizontalAlign.Center,
verticalAlign: o.verticalAlign,
rowSize: o.rowSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
populate: function (items) {
this.wrapper.populate(items);
}
});
BI.shortcut("bi.flex_wrapper_horizontal_adapt", BI.FlexWrapperHorizontalCenter);
BI.shortcut("bi.flex_wrapper_horizontal_center_adapt", BI.FlexWrapperHorizontalCenter);

30
src/core/wrapper/layout/flex/wrapper/flex.wrapper.horizontal.js

@ -5,13 +5,15 @@
* @class BI.FlexHorizontalLayout
* @extends BI.Layout
*/
BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
BI.FlexWrapperHorizontalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexHorizontalLayout.superclass.props.apply(this, arguments), {
return BI.extend(BI.FlexWrapperHorizontalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-horizontal-layout clearfix",
verticalAlign: BI.VerticalAlign.Middle,
verticalAlign: BI.VerticalAlign.Top,
horizontalAlign: BI.HorizontalAlign.Left,
columnSize: [],
// scrollable: true,
scrollable: null,
scrollx: true,
hgap: 0,
vgap: 0,
lgap: 0,
@ -21,16 +23,22 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
});
},
render: function () {
BI.FlexHorizontalLayout.superclass.render.apply(this, arguments);
BI.FlexWrapperHorizontalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-horizontal-layout-wrapper " + o.verticalAlign);
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-horizontal-layout-wrapper v-" + o.verticalAlign).addClass("h-" + o.horizontalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.FlexHorizontalLayout.superclass._addElement.apply(this, arguments);
var w = BI.FlexWrapperHorizontalLayout.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative"});
if (o.columnSize[i] > 0) {
w.element.width(o.columnSize[i]);
}
if (o.columnSize[i] === "fill") {
w.element.css("flex", "1");
}
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"
@ -38,7 +46,7 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
}
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"
"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) {
@ -64,12 +72,12 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
},
resize: function () {
// console.log("flex_horizontal布局不需要resize");
// console.log("flex_wrapper_horizontal布局不需要resize");
},
populate: function (items) {
BI.FlexHorizontalLayout.superclass.populate.apply(this, arguments);
BI.FlexWrapperHorizontalLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.flex_wrapper_horizontal", BI.FlexHorizontalLayout);
BI.shortcut("bi.flex_wrapper_horizontal", BI.FlexWrapperHorizontalLayout);

80
src/core/wrapper/layout/flex/wrapper/flex.wrapper.vertical.center.js

@ -5,13 +5,13 @@
* @class BI.FlexVerticalCenter
* @extends BI.Layout
*/
BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
BI.FlexWrapperVerticalCenter = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexVerticalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-center clearfix",
horizontalAlign: BI.HorizontalAlign.Middle,
return BI.extend(BI.FlexWrapperVerticalCenter.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-center-adapt-layout clearfix",
horizontalAlign: BI.HorizontalAlign.Left,
columnSize: [],
// scrollable: true,
scrollx: true,
hgap: 0,
vgap: 0,
lgap: 0,
@ -21,55 +21,31 @@ BI.FlexVerticalCenter = BI.inherit(BI.Layout, {
});
},
render: function () {
BI.FlexVerticalCenter.superclass.render.apply(this, arguments);
var o = this.options;
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-vertical-center-wrapper " + o.horizontalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.FlexVerticalCenter.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative"});
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 w;
},
appendFragment: function (frag) {
this.$wrapper.append(frag);
this.element.append(this.$wrapper);
},
_getWrapper: function () {
return this.$wrapper;
},
resize: function () {
// console.log("flex_vertical_center布局不需要resize");
var self = this, o = this.options;
return {
type: "bi.flex_wrapper_horizontal",
ref: function (_ref) {
self.wrapper = _ref;
},
verticalAlign: BI.VerticalAlign.Middle,
horizontalAlign: o.horizontalAlign,
columnSize: o.columnSize,
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
items: o.items
};
},
populate: function (items) {
BI.FlexVerticalCenter.superclass.populate.apply(this, arguments);
this._mount();
this.wrapper.populate(items);
}
});
BI.shortcut("bi.flex_wrapper_vertical_center", BI.FlexVerticalCenter);
BI.shortcut("bi.flex_wrapper_vertical_adapt", BI.FlexWrapperVerticalCenter);
BI.shortcut("bi.flex_wrapper_vertical_center_adapt", BI.FlexWrapperVerticalCenter);

83
src/core/wrapper/layout/flex/wrapper/flex.wrapper.vertical.js

@ -0,0 +1,83 @@
/**
*自适应水平和垂直方向都居中容器
* Created by GUY on 2016/12/2.
*
* @class BI.FlexWrapperVerticalLayout
* @extends BI.Layout
*/
BI.FlexWrapperVerticalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexWrapperVerticalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-flex-wrapper-vertical-layout clearfix",
horizontalAlign: BI.HorizontalAlign.Left,
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
scrollable: null,
scrolly: true,
hgap: 0,
vgap: 0,
lgap: 0,
rgap: 0,
tgap: 0,
bgap: 0
});
},
render: function () {
BI.FlexWrapperVerticalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("flex-wrapper-vertical-layout-wrapper h-" + o.horizontalAlign).addClass("v-" + o.verticalAlign);
this.populate(this.options.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.FlexWrapperVerticalLayout.superclass._addElement.apply(this, arguments);
w.element.css({position: "relative"});
if (o.rowSize[i] > 0) {
w.element.height(o.rowSize[i]);
}
if (o.rowSize[i] === "fill") {
w.element.css("flex", "1");
}
if (o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0) !== 0) {
w.element.css({
"margin-top": (i === 0 ? o.vgap : 0) + 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": o.hgap + 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 w;
},
appendFragment: function (frag) {
this.$wrapper.append(frag);
this.element.append(this.$wrapper);
},
_getWrapper: function () {
return this.$wrapper;
},
resize: function () {
// console.log("flex_wrapper_vertical布局不需要resize");
},
populate: function (items) {
BI.FlexWrapperVerticalLayout.superclass.populate.apply(this, arguments);
this._mount();
}
});
BI.shortcut("bi.flex_wrapper_vertical", BI.FlexWrapperVerticalLayout);

241
src/css/core/wrapper/flex.css

@ -1,4 +1,4 @@
.bi-flex-center-layout {
.bi-flex-center-adapt-layout {
display: box;
/* OLD - Android 4.4- */
display: -webkit-box;
@ -87,7 +87,7 @@
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
}
.bi-flex-horizontal-layout.middle {
.bi-flex-horizontal-layout.v-middle {
/* 09版 */
-webkit-box-align: center;
/* 12版 */
@ -98,7 +98,7 @@
-o-align-items: center;
align-items: center;
}
.bi-flex-horizontal-layout.bottom {
.bi-flex-horizontal-layout.v-bottom {
/* 09版 */
-webkit-box-align: flex-end;
/* 12版 */
@ -109,8 +109,47 @@
-o-align-items: flex-end;
align-items: flex-end;
}
.bi-flex-horizontal-layout.v-stretch {
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-horizontal-layout.h-stretch {
/* 09版 */
-webkit-box-orient: vertical;
/* 12版 */
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
/* 09版 */
-webkit-box-pack: center;
/* 12版 */
-webkit-justify-content: center;
-moz-justify-content: center;
-ms-justify-content: center;
-ms-flex-pack: center;
-o-justify-content: center;
justify-content: center;
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-vertical-center {
.bi-flex-vertical-layout {
display: box;
/* OLD - Android 4.4- */
display: -webkit-box;
@ -124,13 +163,13 @@
display: flex;
/* NEW, Spec - Opera 12.1, Firefox 20+ */
/* 09版 */
-webkit-box-orient: horizontal;
-webkit-box-orient: vertical;
/* 12版 */
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
-o-flex-direction: row;
flex-direction: row;
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
/* 09版 */
-webkit-box-pack: flex-start;
/* 12版 */
@ -140,6 +179,25 @@
-o-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
/* 09版 */
-webkit-box-align: start;
/* 12版 */
-webkit-align-items: flex-start;
-moz-align-items: flex-start;
-ms-align-items: flex-start;
-ms-flex-align: start;
-o-align-items: flex-start;
align-items: flex-start;
/* 09版 */
/*-webkit-box-lines: multiple;*/
/* 12版 */
-webkit-flex-wrap: nowrap;
-moz-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
}
.bi-flex-vertical-layout.h-center {
/* 09版 */
-webkit-box-align: center;
/* 12版 */
@ -149,24 +207,38 @@
-ms-flex-align: center;
-o-align-items: center;
align-items: center;
}
.bi-flex-vertical-layout.h-right {
/* 09版 */
/*-webkit-box-lines: multiple;*/
-webkit-box-align: flex-end;
/* 12版 */
-webkit-flex-wrap: nowrap;
-moz-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-align-items: flex-end;
-moz-align-items: flex-end;
-ms-align-items: flex-end;
-ms-flex-align: end;
-o-align-items: flex-end;
align-items: flex-end;
}
.bi-flex-vertical-center.stretch {
.bi-flex-vertical-layout.h-stretch {
/* 09版 */
-webkit-box-orient: vertical;
-webkit-box-align: stretch;
/* 12版 */
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-vertical-layout.v-stretch {
/* 09版 */
-webkit-box-orient: horizontal;
/* 12版 */
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
-o-flex-direction: row;
flex-direction: row;
/* 09版 */
-webkit-box-pack: center;
/* 12版 */
@ -187,7 +259,7 @@
align-items: stretch;
}
.bi-flex-wrapper-center-layout .flex-wrapper-center-layout-wrapper {
.bi-flex-wrapper-center-adapt-layout .flex-wrapper-center-adapt-layout-wrapper {
display: box;
/* OLD - Android 4.4- */
display: -webkit-box;
@ -280,7 +352,7 @@
flex-wrap: nowrap;
min-height: 100%;
}
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.middle {
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.v-middle {
/* 09版 */
-webkit-box-align: center;
/* 12版 */
@ -290,7 +362,7 @@
-o-align-items: center;
align-items: center;
}
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.bottom {
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.v-bottom {
/* 09版 */
-webkit-box-align: flex-end;
/* 12版 */
@ -300,8 +372,46 @@
-o-align-items: flex-end;
align-items: flex-end;
}
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.v-stretch {
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.h-stretch {
/* 09版 */
-webkit-box-orient: vertical;
/* 12版 */
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
/* 09版 */
-webkit-box-pack: center;
/* 12版 */
-webkit-justify-content: center;
-moz-justify-content: center;
-ms-justify-content: center;
-ms-flex-pack: center;
-o-justify-content: center;
justify-content: center;
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-wrapper-vertical-center .flex-wrapper-vertical-center-wrapper {
.bi-flex-wrapper-vertical-layout .flex-wrapper-vertical-layout-wrapper {
display: box;
/* OLD - Android 4.4- */
display: -webkit-box;
@ -315,13 +425,13 @@
display: flex;
/* NEW, Spec - Opera 12.1, Firefox 20+ */
/* 09版 */
-webkit-box-orient: horizontal;
-webkit-box-orient: vertical;
/* 12版 */
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
-o-flex-direction: row;
flex-direction: row;
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
/* 09版 */
-webkit-box-pack: flex-start;
/* 12版 */
@ -331,6 +441,26 @@
-ms-flex-pack: start;
-o-justify-content: flex-start;
justify-content: flex-start;
/* 09版 */
-webkit-box-align: flex-start;
/* 12版 */
-webkit-align-items: flex-start;
-moz-align-items: flex-start;
-ms-align-items: flex-start;
-ms-flex-align: start;
-o-align-items: flex-start;
align-items: flex-start;
/* 09版 */
/*-webkit-box-lines: multiple;*/
/* 12版 */
-webkit-flex-wrap: nowrap;
-moz-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
min-width: 100%;
}
.bi-flex-wrapper-vertical-layout .flex-wrapper-vertical-layout-wrapper.h-center {
/* 09版 */
-webkit-box-align: center;
/* 12版 */
@ -340,33 +470,45 @@
-ms-flex-align: center;
-o-align-items: center;
align-items: center;
}
.bi-flex-wrapper-vertical-layout .flex-wrapper-vertical-layout-wrapper.h-right {
/* 09版 */
/*-webkit-box-lines: multiple;*/
-webkit-box-align: flex-end;
/* 12版 */
-webkit-flex-wrap: nowrap;
-moz-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
min-height: 100%;
float: left;
-webkit-align-items: flex-end;
-moz-align-items: flex-end;
-ms-align-items: flex-end;
-ms-flex-align: end;
-o-align-items: flex-end;
align-items: flex-end;
}
.bi-flex-wrapper-vertical-center .flex-wrapper-vertical-center-wrapper.stretch {
width: 100%;
.bi-flex-wrapper-vertical-layout .flex-wrapper-vertical-layout-wrapper.h-stretch {
/* 09版 */
-webkit-box-orient: vertical;
-webkit-box-align: stretch;
/* 12版 */
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
.bi-flex-wrapper-vertical-layout .flex-wrapper-vertical-layout-wrapper.v-stretch {
/* 09版 */
-webkit-box-orient: horizontal;
/* 12版 */
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
-o-flex-direction: row;
flex-direction: row;
/* 09版 */
-webkit-box-pack: center;
/* 12版 */
-webkit-justify-content: center;
-moz-justify-content: center;
-ms-justify-content: center;
-ms-flex-pack: center;
-o-justify-content: center;
justify-content: center;
/* 09版 */
@ -375,6 +517,7 @@
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}

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

@ -1,4 +1,4 @@
.bi-flex-center-layout {
.bi-flex-center-adapt-layout {
display: box; /* OLD - Android 4.4- */
display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */

45
src/less/core/wrapper/flex.horizontal.less

@ -44,7 +44,7 @@
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
&.middle {
&.v-middle {
/* 09版 */
-webkit-box-align: center;
/* 12版 */
@ -55,7 +55,7 @@
-o-align-items: center;
align-items: center;
}
&.bottom {
&.v-bottom {
/* 09版 */
-webkit-box-align: flex-end;
/* 12版 */
@ -66,4 +66,45 @@
-o-align-items: flex-end;
align-items: flex-end;
}
&.v-stretch {
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
&.h-stretch {
/* 09版 */
-webkit-box-orient: vertical;
/* 12版 */
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
/* 09版 */
-webkit-box-pack: center;
/* 12版 */
-webkit-justify-content: center;
-moz-justify-content: center;
-ms-justify-content: center;
-ms-flex-pack: center;
-o-justify-content: center;
justify-content: center;
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
}

76
src/less/core/wrapper/flex.vertical.center.less

@ -1,76 +0,0 @@
.bi-flex-vertical-center {
display: box; /* OLD - Android 4.4- */
display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
display: -ms-flexbox; /* TWEENER - IE 10 */
display: -webkit-flex; /* NEW - Chrome */
display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */
/* 09版 */
-webkit-box-orient: horizontal;
/* 12版 */
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
-o-flex-direction: row;
flex-direction: row;
/* 09版 */
-webkit-box-pack: flex-start;
/* 12版 */
-webkit-justify-content: flex-start;
-moz-justify-content: flex-start;
-ms-justify-content: flex-start;
-o-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
/* 09版 */
-webkit-box-align: center;
/* 12版 */
-webkit-align-items: center;
-moz-align-items: center;
-ms-align-items: center;
-ms-flex-align: center;
-o-align-items: center;
align-items: center;
/* 09版 */
/*-webkit-box-lines: multiple;*/
/* 12版 */
-webkit-flex-wrap: nowrap;
-moz-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
&.stretch {
/* 09版 */
-webkit-box-orient: vertical;
/* 12版 */
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
/* 09版 */
-webkit-box-pack: center;
/* 12版 */
-webkit-justify-content: center;
-moz-justify-content: center;
-ms-justify-content: center;
-ms-flex-pack: center;
-o-justify-content: center;
justify-content: center;
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
}

110
src/less/core/wrapper/flex.vertical.less

@ -0,0 +1,110 @@
.bi-flex-vertical-layout {
display: box; /* OLD - Android 4.4- */
display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
display: -ms-flexbox; /* TWEENER - IE 10 */
display: -webkit-flex; /* NEW - Chrome */
display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */
/* 09版 */
-webkit-box-orient: vertical;
/* 12版 */
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
/* 09版 */
-webkit-box-pack: flex-start;
/* 12版 */
-webkit-justify-content: flex-start;
-moz-justify-content: flex-start;
-ms-justify-content: flex-start;
-o-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
/* 09版 */
-webkit-box-align: start;
/* 12版 */
-webkit-align-items: flex-start;
-moz-align-items: flex-start;
-ms-align-items: flex-start;
-ms-flex-align: start;
-o-align-items: flex-start;
align-items: flex-start;
/* 09版 */
/*-webkit-box-lines: multiple;*/
/* 12版 */
-webkit-flex-wrap: nowrap;
-moz-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
&.h-center {
/* 09版 */
-webkit-box-align: center;
/* 12版 */
-webkit-align-items: center;
-moz-align-items: center;
-ms-align-items: center;
-ms-flex-align: center;
-o-align-items: center;
align-items: center;
}
&.h-right {
/* 09版 */
-webkit-box-align: flex-end;
/* 12版 */
-webkit-align-items: flex-end;
-moz-align-items: flex-end;
-ms-align-items: flex-end;
-ms-flex-align: end;
-o-align-items: flex-end;
align-items: flex-end;
}
&.h-stretch {
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
&.v-stretch {
/* 09版 */
-webkit-box-orient: horizontal;
/* 12版 */
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
-o-flex-direction: row;
flex-direction: row;
/* 09版 */
-webkit-box-pack: center;
/* 12版 */
-webkit-justify-content: center;
-moz-justify-content: center;
-ms-justify-content: center;
-ms-flex-pack: center;
-o-justify-content: center;
justify-content: center;
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
}

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

@ -1,5 +1,5 @@
.bi-flex-wrapper-center-layout {
& .flex-wrapper-center-layout-wrapper {
.bi-flex-wrapper-center-adapt-layout {
& .flex-wrapper-center-adapt-layout-wrapper {
display: box; /* OLD - Android 4.4- */
display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */

43
src/less/core/wrapper/flex.wrapper.horizontal.less

@ -46,7 +46,7 @@
min-height: 100%;
&.middle {
&.v-middle {
/* 09版 */
-webkit-box-align: center;
/* 12版 */
@ -56,7 +56,7 @@
-o-align-items: center;
align-items: center;
}
&.bottom {
&.v-bottom {
/* 09版 */
-webkit-box-align: flex-end;
/* 12版 */
@ -66,5 +66,44 @@
-o-align-items: flex-end;
align-items: flex-end;
}
&.v-stretch {
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-o-align-items: stretch;
align-items: stretch;
}
&.h-stretch {
/* 09版 */
-webkit-box-orient: vertical;
/* 12版 */
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
/* 09版 */
-webkit-box-pack: center;
/* 12版 */
-webkit-justify-content: center;
-moz-justify-content: center;
-ms-justify-content: center;
-ms-flex-pack: center;
-o-justify-content: center;
justify-content: center;
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
}
}

80
src/less/core/wrapper/flex.wrapper.vertical.center.less

@ -1,80 +0,0 @@
.bi-flex-wrapper-vertical-center {
& .flex-wrapper-vertical-center-wrapper {
display: box; /* OLD - Android 4.4- */
display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
display: -ms-flexbox; /* TWEENER - IE 10 */
display: -webkit-flex; /* NEW - Chrome */
display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */
/* 09版 */
-webkit-box-orient: horizontal;
/* 12版 */
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
-o-flex-direction: row;
flex-direction: row;
/* 09版 */
-webkit-box-pack: flex-start;
/* 12版 */
-webkit-justify-content: flex-start;
-moz-justify-content: flex-start;
-ms-justify-content: flex-start;
-ms-flex-pack: start;
-o-justify-content: flex-start;
justify-content: flex-start;
/* 09版 */
-webkit-box-align: center;
/* 12版 */
-webkit-align-items: center;
-moz-align-items: center;
-ms-align-items: center;
-ms-flex-align: center;
-o-align-items: center;
align-items: center;
/* 09版 */
/*-webkit-box-lines: multiple;*/
/* 12版 */
-webkit-flex-wrap: nowrap;
-moz-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
min-height: 100%;
float: left;
&.stretch {
width: 100%;
/* 09版 */
-webkit-box-orient: vertical;
/* 12版 */
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
/* 09版 */
-webkit-box-pack: center;
/* 12版 */
-webkit-justify-content: center;
-moz-justify-content: center;
-ms-justify-content: center;
-o-justify-content: center;
justify-content: center;
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-o-align-items: stretch;
align-items: stretch;
}
}
}

113
src/less/core/wrapper/flex.wrapper.vertical.less

@ -0,0 +1,113 @@
.bi-flex-wrapper-vertical-layout {
& .flex-wrapper-vertical-layout-wrapper {
display: box; /* OLD - Android 4.4- */
display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
display: -ms-flexbox; /* TWEENER - IE 10 */
display: -webkit-flex; /* NEW - Chrome */
display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */
/* 09版 */
-webkit-box-orient: vertical;
/* 12版 */
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
/* 09版 */
-webkit-box-pack: flex-start;
/* 12版 */
-webkit-justify-content: flex-start;
-moz-justify-content: flex-start;
-ms-justify-content: flex-start;
-ms-flex-pack: start;
-o-justify-content: flex-start;
justify-content: flex-start;
/* 09版 */
-webkit-box-align: flex-start;
/* 12版 */
-webkit-align-items: flex-start;
-moz-align-items: flex-start;
-ms-align-items: flex-start;
-ms-flex-align: start;
-o-align-items: flex-start;
align-items: flex-start;
/* 09版 */
/*-webkit-box-lines: multiple;*/
/* 12版 */
-webkit-flex-wrap: nowrap;
-moz-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
min-width: 100%;
&.h-center {
/* 09版 */
-webkit-box-align: center;
/* 12版 */
-webkit-align-items: center;
-moz-align-items: center;
-ms-align-items: center;
-ms-flex-align: center;
-o-align-items: center;
align-items: center;
}
&.h-right {
/* 09版 */
-webkit-box-align: flex-end;
/* 12版 */
-webkit-align-items: flex-end;
-moz-align-items: flex-end;
-ms-align-items: flex-end;
-ms-flex-align: end;
-o-align-items: flex-end;
align-items: flex-end;
}
&.h-stretch {
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
&.v-stretch {
/* 09版 */
-webkit-box-orient: horizontal;
/* 12版 */
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
-o-flex-direction: row;
flex-direction: row;
/* 09版 */
-webkit-box-pack: center;
/* 12版 */
-webkit-justify-content: center;
-moz-justify-content: center;
-ms-justify-content: center;
-ms-flex-pack: center;
-o-justify-content: center;
justify-content: center;
/* 09版 */
-webkit-box-align: stretch;
/* 12版 */
-webkit-align-items: stretch;
-moz-align-items: stretch;
-ms-align-items: stretch;
-ms-flex-align: stretch;
-o-align-items: stretch;
align-items: stretch;
}
}
}
Loading…
Cancel
Save