Frank
/
fineui
forked from fanruan/fineui
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Pull request #1853: BI-57022 left_right_vertical_adapt换一种实现 

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

* commit '84e90c13b37070fe547daea09e58dc32d89c55ed': (28 commits)
  优化布局
  优化布局
  优化布局
  优化布局
  优化布局
  优化布局
  优化布局
  优化布局
  优化布局
  优化布局
  优化布局
  优化布局
  优化布局
  优化布局
  优化布局
  优化布局
  优化布局
  优化布局
  优化布局
  优化布局
  ...
es6
guy 4 years ago
parent
f5285abaa0 84e90c13b3
commit
abb28eae77
23 changed files with 620 additions and 359 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      changelog.md
  2. 110
      src/core/platform/web/config.js
  3. 4
      src/core/plugin.js
  4. 34
      src/core/shortcut.js
  5. 2
      src/core/wrapper/layout/adapt/adapt.table.js
  6. 76
      src/core/wrapper/layout/adapt/inline.center.js
  7. 76
      src/core/wrapper/layout/adapt/inline.horizontal.js
  8. 63
      src/core/wrapper/layout/adapt/inline.vertical.js
  9. 17
      src/core/wrapper/layout/flex/flex.horizontal.js
  10. 102
      src/core/wrapper/layout/flex/flex.leftrightvertical.center.js
  11. 17
      src/core/wrapper/layout/flex/flex.vertical.js
  12. 18
      src/core/wrapper/layout/flex/wrapper/flex.wrapper.horizontal.js
  13. 18
      src/core/wrapper/layout/flex/wrapper/flex.wrapper.vertical.js
  14. 2
      src/core/wrapper/layout/layout.horizontal.js
  15. 45
      src/core/wrapper/layout/layout.inline.js
  16. 14
      src/core/wrapper/layout/layout.table.js
  17. 45
      src/core/wrapper/layout/layout.td.js
  18. 51
      src/less/core/wrapper/flex.horizontal.less
  19. 5
      src/less/core/wrapper/flex.leftrightvertical.center.less
  20. 53
      src/less/core/wrapper/flex.vertical.less
  21. 93
      src/less/core/wrapper/flex.wrapper.horizontal.less
  22. 108
      src/less/core/wrapper/flex.wrapper.vertical.less
  23. 24
      src/less/core/wrapper/inline.less

2
changelog.md
Unescape View File

@ -1,5 +1,7 @@
# 更新日志
2.0(2021-03)
- 优化left_right_vertical_adapt布局，去掉float属性只使用flex
- inline布局支持用calc计算fill列宽度
- 时间类型控件无翻页限制
- 时间类型控件优化动态时间面板的交互

110
src/core/platform/web/config.js
Unescape View File

@ -21,40 +21,72 @@ BI.prepares.push(function () {
// 在横向自适应场景下我们需要使用table的自适应撑出滚动条的特性（flex处理不了这种情况）
// 主要出现在center_adapt或者horizontal_adapt的场景，或者主动设置horizontalAlign的场景
if (ob.horizontalAlign === BI.HorizontalAlign.Center || ob.horizontalAlign === BI.HorizontalAlign.Stretch) {
var justOneItem = (ob.items && ob.items.length <= 1);
// 在这种情况下，也可以通过flex支持该布局
if (supportFlex) {
// IE下其实也是可以使用flex布局的，只要排除掉出现滚动条的情况
// if (!isIE || (ob.scrollable !== true && ob.scrolly !== true)) {
return BI.extend({}, ob, {
type: "bi.flex_horizontal",
horizontalAlign: !justOneItem && ob.horizontalAlign === BI.HorizontalAlign.Center
? BI.HorizontalAlign.Left : ob.horizontalAlign
});
// }
}
// // IE9以上可以使用calc计算布局
// if (!isIE || BI.getIEVersion() > 8) {
// return BI.extend({}, ob, {
// type: "bi.inline",
// horizontalAlign: !justOneItem && ob.horizontalAlign === BI.HorizontalAlign.Center
// ? BI.HorizontalAlign.Left : ob.horizontalAlign
// });
// }
return BI.extend({}, ob, {type: "bi.table_adapt"});
}
if (!isIE && supportFlex) {
if (supportFlex) {
// IE下其实也是可以使用flex布局的，只要排除掉出现滚动条的情况
// if (!isIE || (ob.scrollable !== true && ob.scrolly !== true)) {
return BI.extend({}, ob, {type: "bi.flex_horizontal"});
// }
}
// // 解决使用inline_vertical_adapt的顺序问题
// // 从右往左放置时，为了兼容，我们统一采用从右到左的放置方式
// if (ob.horizontalAlign === BI.HorizontalAlign.Right) {
// return BI.extend({verticalAlign: BI.VerticalAlign.Top}, ob, {
// type: "bi.inline_vertical_adapt",
// items: ob.items && ob.items.reverse()
// // IE9以上采用inline
// if (!isIE || BI.getIEVersion() > 8) {
// return BI.extend({}, ob, {
// type: "bi.inline"
// });
// }
// 否则采用table，不过horizontalAlign的right就不支持了。
return BI.extend({}, ob, {type: "bi.table_adapt"});
});
BI.Plugin.configWidget("bi.center_adapt", function (ob) {
var isIE = BI.isIE(), supportFlex = isSupportFlex(), justOneItem = (ob.items && ob.items.length <= 1);
var supportFlex = isSupportFlex(), justOneItem = (ob.items && ob.items.length <= 1);
var isAdapt = !ob.horizontalAlign || ob.horizontalAlign === BI.HorizontalAlign.Center || ob.horizontalAlign === BI.HorizontalAlign.Stretch;
if (!isAdapt || justOneItem) {
if (!isIE && supportFlex) {
if (supportFlex) {
// IE下其实也是可以使用flex布局的，只要排除掉出现滚动条的情况
// if (!isIE || (ob.scrollable !== true && ob.scrollx !== true && ob.scrolly !== true)) {
return BI.extend({}, ob, {type: "bi.flex_center_adapt"});
// }
}
if (!BI.isIE() || BI.getIEVersion() > 8) {
return BI.extend({}, ob, {type: "bi.inline_center_adapt"});
}
return BI.extend({}, ob, {type: "bi.inline_center_adapt"});
}
return ob;
});
BI.Plugin.configWidget("bi.vertical_adapt", function (ob) {
var isIE = BI.isIE(), supportFlex = isSupportFlex(), justOneItem = (ob.items && ob.items.length <= 1);
var supportFlex = isSupportFlex(), justOneItem = (ob.items && ob.items.length <= 1);
var isAdapt = ob.horizontalAlign === BI.HorizontalAlign.Center || ob.horizontalAlign === BI.HorizontalAlign.Stretch;
if (!isAdapt || justOneItem) {
if (!isIE && supportFlex) {
return BI.extend({}, ob, {type: "bi.flex_vertical_center_adapt"});
if (supportFlex) {
// IE下其实也是可以使用flex布局的，只要排除掉出现滚动条的情况
// if (!isIE || (ob.scrollable !== true && ob.scrolly !== true)) {
return BI.extend({}, ob, {type: "bi.flex_vertical_adapt"});
// }
}
if (!BI.isIE() || BI.getIEVersion() > 8) {
return BI.extend({}, ob, {type: "bi.inline_vertical_adapt"});
}
return BI.extend({}, ob, {type: "bi.inline_vertical_adapt"});
}
return ob;
});
@ -68,45 +100,35 @@ BI.prepares.push(function () {
return ob;
});
BI.Plugin.configWidget("bi.horizontal_float", function (ob) {
if (!BI.isIE() && isSupportFlex()) {
if (isSupportFlex()) {
// IE下其实也是可以使用flex布局的，只要排除掉出现滚动条的情况
// if (!BI.isIE() || (ob.scrollable !== true && ob.scrollx !== true)) {
return BI.extend({}, ob, {type: "bi.flex_horizontal_adapt"});
// }
}
return BI.extend({}, ob, {type: "bi.inline_horizontal_adapt"});
});
BI.Plugin.configWidget("bi.flex_horizontal", function (ob) {
if (ob.scrollable === true || ob.scrolly === true) {
return BI.extend({}, ob, {type: "bi.flex_scrollable_horizontal"});
}
});
BI.Plugin.configWidget("bi.flex_vertical", function (ob) {
if (ob.scrollable === true || ob.scrollx === true) {
return BI.extend({}, ob, {type: "bi.flex_scrollable_vertical"});
}
});
BI.Plugin.configWidget("bi.flex_horizontal_adapt", function (ob) {
if (ob.scrollable === true || ob.scrollx === true) {
return BI.extend({}, ob, {type: "bi.flex_scrollable_horizontal_adapt"});
BI.Plugin.configWidget("bi.left_right_vertical_adapt", function (ob) {
if (isSupportFlex()) {
// IE下其实也是可以使用flex布局的，只要排除掉出现滚动条的情况
// if (!BI.isIE() || (ob.scrollable !== true && ob.scrolly !== true)) {
return BI.extend({}, ob, {type: "bi.flex_left_right_vertical_adapt"});
// }
}
return ob;
});
BI.Plugin.configWidget("bi.flex_vertical_adapt", function (ob) {
if (ob.scrollable === true || ob.scrolly === true) {
return BI.extend({}, ob, {type: "bi.flex_scrollable_vertical_adapt"});
BI.Plugin.configWidget("bi.flex_horizontal", function (ob) {
if (ob.scrollable === true || ob.scrollx !== false) {
if (ob.hgap > 0 || ob.rgap > 0) {// flex中最后一个margin-right不生效
return BI.extend({}, ob, {type: "bi.flex_scrollable_horizontal"});
}
}
});
BI.Plugin.configWidget("bi.flex_horizontal_center_adapt", function (ob) {
BI.Plugin.configWidget("bi.flex_vertical", function (ob) {
if (ob.scrollable === true || ob.scrollx === true) {
return BI.extend({}, ob, {type: "bi.flex_scrollable_horizontal_adapt"});
}
});
BI.Plugin.configWidget("bi.flex_vertical_center_adapt", function (ob) {
if (ob.scrollable === true || ob.scrolly === true) {
return BI.extend({}, ob, {type: "bi.flex_scrollable_vertical_adapt"});
}
});
BI.Plugin.configWidget("bi.flex_center_adapt", function (ob) {
if (ob.scrollable === true || ob.scrolly === true || ob.scrollx === true) {
return BI.extend({}, ob, {type: "bi.flex_scrollable_center_adapt"});
if (ob.hgap > 0 || ob.rgap > 0) {// flex中最后一个margin-right不生效
return BI.extend({}, ob, {type: "bi.flex_scrollable_vertical"});
}
}
});

4
src/core/plugin.js
Unescape View File

@ -81,6 +81,10 @@ BI.Plugin = BI.Plugin || {};
return res || object;
},
hasObject: function (type) {
return __GlobalObjectConfigFns.length > 0 || !!_ObjectPlugin[type];
},
registerObject: function (type, fn) {
if (!_ObjectPlugin[type]) {
_ObjectPlugin[type] = [];

34
src/core/shortcut.js
Unescape View File

@ -56,24 +56,34 @@
if (item.type || options.type) {
el = BI.extend({}, options, item);
w = BI.Plugin.getWidget(el.type, el);
w.listeners = (w.listeners || []).concat([{
eventName: BI.Events.MOUNT,
action: function () {
BI.Plugin.getObject(el.type, this);
if (w.type === el.type) {
if (BI.Plugin.hasObject(el.type)) {
w.listeners = (w.listeners || []).concat([{
eventName: BI.Events.MOUNT,
action: function () {
BI.Plugin.getObject(el.type, this);
}
}]);
}
}]);
return w.type === el.type ? createWidget(w, context, lazy) : BI.createWidget(BI.extend({/**important**/}, el, {type: w.type}), options, context, lazy);
return createWidget(w, context, lazy);
}
return BI.createWidget(w, options, context, lazy);
}
if (item.el && (item.el.type || options.type)) {
el = BI.extend({}, options, item.el);
w = BI.Plugin.getWidget(el.type, el);
w.listeners = (w.listeners || []).concat([{
eventName: BI.Events.MOUNT,
action: function () {
BI.Plugin.getObject(el.type, this);
if (w.type === el.type) {
if (BI.Plugin.hasObject(el.type)) {
w.listeners = (w.listeners || []).concat([{
eventName: BI.Events.MOUNT,
action: function () {
BI.Plugin.getObject(el.type, this);
}
}]);
}
}]);
return w.type === el.type ? createWidget(w, context, lazy) : BI.createWidget(BI.extend({/**important**/}, el, {type: w.type}), options, context, lazy);
return createWidget(w, context, lazy);
}
return BI.createWidget(w, options, context, lazy);
}
if (BI.isWidget(item.el)) {
return item.el;

2
src/core/wrapper/layout/adapt/adapt.table.js
Unescape View File

@ -35,7 +35,7 @@ BI.TableAdaptLayout = BI.inherit(BI.Layout, {
_addElement: function (i, item) {
var o = this.options;
var td;
var width = o.columnSize[i] <= 1 ? ((o.columnSize[i] * 100).toFixed(1) + "%") : o.columnSize[i];
var width = o.columnSize[i] === "" ? "" : (o.columnSize[i] <= 1 ? ((o.columnSize[i] * 100).toFixed(1) + "%") : (i === 0 ? o.hgap : 0) + o.hgap + o.lgap + o.rgap + o.columnSize[i]);
if (!this.hasWidget(this._getChildName(i))) {
var w = BI._lazyCreateWidget(item);
w.element.css({position: "relative", top: "0", left: "0", margin: "0px auto"});

76
src/core/wrapper/layout/adapt/inline.center.js
Unescape View File

@ -25,67 +25,27 @@ BI.InlineCenterAdaptLayout = BI.inherit(BI.Layout, {
},
render: function () {
BI.InlineCenterAdaptLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.element.css({
whiteSpace: "nowrap",
textAlign: o.horizontalAlign
});
this.populate(o.items);
},
_addElement: function (i, item, length) {
var o = this.options;
var w = BI.InlineCenterAdaptLayout.superclass._addElement.apply(this, arguments);
w.element.css({
width: o.columnSize[i] <= 1 ? ((o.columnSize[i] * 100).toFixed(1) + "%") : (o.columnSize[i] / BI.pixRatio + BI.pixUnit),
position: "relative",
"vertical-align": o.verticalAlign
});
w.element.addClass("i-c-a-item");
if (o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0) !== 0) {
w.element.css({
"margin-top": (o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0)) / BI.pixRatio + BI.pixUnit
});
}
if (o.hgap + o.lgap + (item.lgap || 0) + (item.hgap || 0) !== 0) {
w.element.css({
"margin-left": ((i === 0 ? o.hgap : 0) + o.lgap + (item.lgap || 0) + (item.hgap || 0)) / BI.pixRatio + BI.pixUnit
});
}
if (o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0) !== 0) {
w.element.css({
"margin-right": (o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0)) / BI.pixRatio + BI.pixUnit
});
}
if (o.vgap + o.bgap + (item.bgap || 0) + (item.vgap || 0) !== 0) {
w.element.css({
"margin-bottom": (o.vgap + o.bgap + (item.bgap || 0) + (item.vgap || 0))
});
}
return w;
},
resize: function () {
this.stroke(this.options.items);
},
addItem: function (item) {
throw new Error("不能添加元素");
},
stroke: function (items) {
var self = this;
BI.each(items, function (i, item) {
if (item) {
self._addElement(i, item, items.length);
}
});
var self = this, o = this.options;
return {
type: "bi.inline",
ref: function (_ref) {
self.layout = _ref;
},
items: o.items,
horizontalAlign: o.horizontalAlign,
verticalAlign: o.verticalAlign,
columnSize: o.columnSize,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap
};
},
populate: function (items) {
BI.InlineCenterAdaptLayout.superclass.populate.apply(this, arguments);
this._mount();
this.layout.populate.apply(this.layout, arguments);
}
});
BI.shortcut("bi.inline_center_adapt", BI.InlineCenterAdaptLayout);

76
src/core/wrapper/layout/adapt/inline.horizontal.js
Unescape View File

@ -25,67 +25,27 @@ BI.InlineHorizontalAdaptLayout = BI.inherit(BI.Layout, {
},
render: function () {
BI.InlineHorizontalAdaptLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.element.css({
whiteSpace: "nowrap",
textAlign: o.horizontalAlign
});
this.populate(o.items);
},
_addElement: function (i, item, length) {
var o = this.options;
var w = BI.InlineHorizontalAdaptLayout.superclass._addElement.apply(this, arguments);
w.element.css({
width: o.columnSize[i] <= 1 ? ((o.columnSize[i] * 100).toFixed(1) + "%") : (o.columnSize[i] / BI.pixRatio + BI.pixUnit),
position: "relative",
"vertical-align": o.verticalAlign
});
w.element.addClass("i-h-a-item");
if (o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0) !== 0) {
w.element.css({
"margin-top": (o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0)) / BI.pixRatio + BI.pixUnit
});
}
if (o.hgap + o.lgap + (item.lgap || 0) + (item.hgap || 0) !== 0) {
w.element.css({
"margin-left": ((i === 0 ? o.hgap : 0) + o.lgap + (item.lgap || 0) + (item.hgap || 0)) / BI.pixRatio + BI.pixUnit
});
}
if (o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0) !== 0) {
w.element.css({
"margin-right": (o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0)) / BI.pixRatio + BI.pixUnit
});
}
if (o.vgap + o.bgap + (item.bgap || 0) + (item.vgap || 0) !== 0) {
w.element.css({
"margin-bottom": (o.vgap + o.bgap + (item.bgap || 0) + (item.vgap || 0)) / BI.pixRatio + BI.pixUnit
});
}
return w;
},
resize: function () {
this.stroke(this.options.items);
},
addItem: function (item) {
throw new Error("不能添加元素");
},
stroke: function (items) {
var self = this;
BI.each(items, function (i, item) {
if (item) {
self._addElement(i, item, items.length);
}
});
var self = this, o = this.options;
return {
type: "bi.inline",
ref: function (_ref) {
self.layout = _ref;
},
items: o.items,
horizontalAlign: o.horizontalAlign,
verticalAlign: o.verticalAlign,
columnSize: o.columnSize,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap
};
},
populate: function (items) {
BI.InlineHorizontalAdaptLayout.superclass.populate.apply(this, arguments);
this._mount();
this.layout.populate.apply(this.layout, arguments);
}
});
BI.shortcut("bi.inline_horizontal_adapt", BI.InlineHorizontalAdaptLayout);

63
src/core/wrapper/layout/adapt/inline.vertical.js
Unescape View File

@ -25,54 +25,27 @@ BI.InlineVerticalAdaptLayout = BI.inherit(BI.Layout, {
},
render: function () {
BI.InlineVerticalAdaptLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.element.css({
whiteSpace: "nowrap",
textAlign: o.horizontalAlign
});
this.populate(o.items);
},
_addElement: function (i, item) {
var o = this.options;
var w = BI.InlineVerticalAdaptLayout.superclass._addElement.apply(this, arguments);
w.element.css({
width: o.columnSize[i] <= 1 ? ((o.columnSize[i] * 100).toFixed(1) + "%") : (o.columnSize[i] / BI.pixRatio + BI.pixUnit),
position: "relative",
"vertical-align": o.verticalAlign
});
w.element.addClass("i-v-a-item");
if (o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0) !== 0) {
w.element.css({
"margin-top": (o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0)) / BI.pixRatio + BI.pixUnit
});
}
if (o.hgap + o.lgap + (item.lgap || 0) + (item.hgap || 0) !== 0) {
w.element.css({
"margin-left": ((i === 0 ? o.hgap : 0) + o.lgap + (item.lgap || 0) + (item.hgap || 0)) / BI.pixRatio + BI.pixUnit
});
}
if (o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0) !== 0) {
w.element.css({
"margin-right": (o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0)) / BI.pixRatio + BI.pixUnit
});
}
if (o.vgap + o.bgap + (item.bgap || 0) + (item.vgap || 0) !== 0) {
w.element.css({
"margin-bottom": (o.vgap + o.bgap + (item.bgap || 0) + (item.vgap || 0)) / BI.pixRatio + BI.pixUnit
});
}
return w;
},
resize: function () {
this.stroke(this.options.items);
var self = this, o = this.options;
return {
type: "bi.inline",
ref: function (_ref) {
self.layout = _ref;
},
items: o.items,
horizontalAlign: o.horizontalAlign,
verticalAlign: o.verticalAlign,
columnSize: o.columnSize,
hgap: o.hgap,
vgap: o.vgap,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap
};
},
populate: function (items) {
BI.InlineVerticalAdaptLayout.superclass.populate.apply(this, arguments);
this._mount();
this.layout.populate.apply(this.layout, arguments);
}
});
BI.shortcut("bi.inline_vertical_adapt", BI.InlineVerticalAdaptLayout);

17
src/core/wrapper/layout/flex/flex.horizontal.js
Unescape View File

@ -35,17 +35,24 @@ BI.FlexHorizontalLayout = BI.inherit(BI.Layout, {
position: "relative"
});
if (o.columnSize[i] !== "auto") {
if (o.horizontalAlign === BI.HorizontalAlign.Stretch && o.columnSize[i] !== "") {
w.element.addClass("fill");
if (o.horizontalAlign === BI.HorizontalAlign.Stretch && o.columnSize[i] === "fill") {
w.element.addClass("f-f");
} else {
w.element.addClass("shrink-none");
w.element.addClass("f-s-n");
}
}
if (o.columnSize[i] > 0) {
w.element.width(o.columnSize[i] <= 1 ? ((o.columnSize[i] * 100).toFixed(1) + "%") : (o.columnSize[i] / BI.pixRatio + BI.pixUnit));
w.element.width(o.columnSize[i] === "" ? "" : (o.columnSize[i] <= 1 ? ((o.columnSize[i] * 100).toFixed(1) + "%") : (o.columnSize[i] / BI.pixRatio + BI.pixUnit)));
}
if (o.columnSize[i] === "fill") {
w.element.addClass("fill");
w.element.addClass("f-f");
}
w.element.addClass("c-e");
if (i === 0) {
w.element.addClass("f-c");
}
if (i === o.items.length - 1) {
w.element.addClass("l-c");
}
if (o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0) !== 0) {
w.element.css({

102
src/core/wrapper/layout/flex/flex.leftrightvertical.center.js
Unescape View File

@ -0,0 +1,102 @@
BI.FlexLeftRightVerticalAdaptLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexLeftRightVerticalAdaptLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-f-lr-v-c",
items: {},
llgap: 0,
lrgap: 0,
lhgap: 0,
ltgap: 0,
lbgap: 0,
lvgap: 0,
rlgap: 0,
rrgap: 0,
rhgap: 0,
rtgap: 0,
rbgap: 0,
rvgap: 0
});
},
render: function () {
var o = this.options, self = this;
BI.FlexLeftRightVerticalAdaptLayout.superclass.render.apply(this, arguments);
return {
type: "bi.flex_vertical_adapt",
ref: function (_ref) {
self.layout = _ref;
},
items: this._formatItems(),
scrollx: o.scrollx,
scrolly: o.scrolly,
scrollable: o.scrollable
};
},
_formatItems: function () {
var o = this.options;
var leftItems = o.items.left || [];
var rightItems = o.items.right || [];
leftItems = BI.map(leftItems, function (i, item) {
var json = {
el: BI.stripEL(item)
};
if (o.lvgap + o.ltgap + (item.tgap || 0) + (item.vgap || 0) !== 0) {
json.tgap = o.lvgap + o.ltgap + (item.tgap || 0) + (item.vgap || 0);
}
if (o.lhgap + o.llgap + (item.lgap || 0) + (item.hgap || 0) !== 0) {
json.lgap = (i === 0 ? o.lhgap : 0) + o.llgap + (item.lgap || 0) + (item.hgap || 0);
}
if (o.lhgap + o.lrgap + (item.rgap || 0) + (item.hgap || 0) !== 0) {
json.rgap = o.lhgap + o.lrgap + (item.rgap || 0) + (item.hgap || 0);
}
if (o.lvgap + o.lbgap + (item.bgap || 0) + (item.vgap || 0) !== 0) {
json.bgap = o.lvgap + o.lbgap + (item.bgap || 0) + (item.vgap || 0);
}
return json;
});
rightItems = BI.map(rightItems, function (i, item) {
if (i === 0) {
if (BI.isWidget(item)) {
item.addClass("flex-left-auto");
} else {
var t = BI.stripEL(item);
t.cls = (t.cls || "") + " flex-left-auto";
}
}
var json = {
el: BI.stripEL(item)
};
if (o.rvgap + o.rtgap + (item.tgap || 0) + (item.vgap || 0) !== 0) {
json.tgap = o.rvgap + o.rtgap + (item.tgap || 0) + (item.vgap || 0);
}
if (o.rhgap + o.rlgap + (item.lgap || 0) + (item.hgap || 0) !== 0) {
if (i > 0) {
json.lgap = o.rlgap + (item.lgap || 0) + (item.hgap || 0);
}
}
if (o.rhgap + o.rrgap + (item.rgap || 0) + (item.hgap || 0) !== 0) {
json.rgap = o.rhgap + o.rrgap + (item.rgap || 0) + (item.hgap || 0);
}
if (o.rvgap + o.rbgap + (item.bgap || 0) + (item.vgap || 0) !== 0) {
json.bgap = o.rvgap + o.rbgap + (item.bgap || 0) + (item.vgap || 0);
}
return json;
});
return leftItems.concat(rightItems);
},
resize: function () {
// console.log("left_right_vertical_adapt布局不需要resize");
},
addItem: function () {
// do nothing
throw new Error("cannot be added");
},
populate: function (items) {
this.options.items = items;
this.layout.populate(this._formatItems());
}
});
BI.shortcut("bi.flex_left_right_vertical_adapt", BI.FlexLeftRightVerticalAdaptLayout);

17
src/core/wrapper/layout/flex/flex.vertical.js
Unescape View File

@ -34,17 +34,24 @@ BI.FlexVerticalLayout = BI.inherit(BI.Layout, {
position: "relative"
});
if (o.rowSize[i] !== "auto") {
if (o.verticalAlign === BI.VerticalAlign.Stretch && o.rowSize[i] !== "") {
w.element.addClass("fill");
if (o.verticalAlign === BI.VerticalAlign.Stretch && o.rowSize[i] === "fill") {
w.element.addClass("f-f");
} else {
w.element.addClass("shrink-none");
w.element.addClass("f-s-n");
}
}
if (o.rowSize[i] > 0) {
w.element.height(o.rowSize[i] <= 1 ? ((o.rowSize[i] * 100).toFixed(1) + "%") : (o.rowSize[i] / BI.pixRatio + BI.pixUnit));
w.element.height(o.rowSize[i] === "" ? "" : (o.rowSize[i] <= 1 ? ((o.rowSize[i] * 100).toFixed(1) + "%") : (o.rowSize[i] / BI.pixRatio + BI.pixUnit)));
}
if (o.rowSize[i] === "fill") {
w.element.addClass("fill");
w.element.addClass("f-f");
}
w.element.addClass("c-e");
if (i === 0) {
w.element.addClass("f-c");
}
if (i === o.items.length - 1) {
w.element.addClass("l-c");
}
if (o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0) !== 0) {
w.element.css({

18
src/core/wrapper/layout/flex/wrapper/flex.wrapper.horizontal.js
Unescape View File

@ -8,7 +8,7 @@
BI.FlexWrapperHorizontalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexWrapperHorizontalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-f-s-h clearfix",
baseCls: "bi-f-s-h",
verticalAlign: BI.VerticalAlign.Top,
horizontalAlign: BI.HorizontalAlign.Left,
columnSize: [],
@ -25,6 +25,7 @@ BI.FlexWrapperHorizontalLayout = BI.inherit(BI.Layout, {
render: function () {
BI.FlexWrapperHorizontalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.element.addClass("v-" + o.verticalAlign).addClass("h-" + o.horizontalAlign);
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("f-s-h-w v-" + o.verticalAlign).addClass("h-" + o.horizontalAlign);
this.populate(this.options.items);
},
@ -37,16 +38,23 @@ BI.FlexWrapperHorizontalLayout = BI.inherit(BI.Layout, {
});
if (o.columnSize[i] !== "auto") {
if (o.horizontalAlign === BI.HorizontalAlign.Stretch && o.columnSize[i] !== "") {
w.element.addClass("fill");
w.element.addClass("f-f");
} else {
w.element.addClass("shrink-none");
w.element.addClass("f-s-n");
}
}
if (o.columnSize[i] > 0) {
w.element.width(o.columnSize[i] <= 1 ? ((o.columnSize[i] * 100).toFixed(1) + "%") : (o.columnSize[i] / BI.pixRatio + BI.pixUnit));
w.element.width(o.columnSize[i] === "" ? "" : (o.columnSize[i] <= 1 ? ((o.columnSize[i] * 100).toFixed(1) + "%") : (o.columnSize[i] / BI.pixRatio + BI.pixUnit)));
}
if (o.columnSize[i] === "fill") {
w.element.addClass("fill");
w.element.addClass("f-f");
}
w.element.addClass("c-e");
if (i === 0) {
w.element.addClass("f-c");
}
if (i === o.items.length - 1) {
w.element.addClass("l-c");
}
if (o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0) !== 0) {
w.element.css({

18
src/core/wrapper/layout/flex/wrapper/flex.wrapper.vertical.js
Unescape View File

@ -8,7 +8,7 @@
BI.FlexWrapperVerticalLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FlexWrapperVerticalLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-f-s-v clearfix",
baseCls: "bi-f-s-v",
horizontalAlign: BI.HorizontalAlign.Left,
verticalAlign: BI.VerticalAlign.Top,
rowSize: [],
@ -25,6 +25,7 @@ BI.FlexWrapperVerticalLayout = BI.inherit(BI.Layout, {
render: function () {
BI.FlexWrapperVerticalLayout.superclass.render.apply(this, arguments);
var o = this.options;
this.element.addClass("v-" + o.verticalAlign).addClass("h-" + o.horizontalAlign);
this.$wrapper = BI.Widget._renderEngine.createElement("<div>").addClass("f-s-v-w h-" + o.horizontalAlign).addClass("v-" + o.verticalAlign);
this.populate(this.options.items);
},
@ -37,16 +38,23 @@ BI.FlexWrapperVerticalLayout = BI.inherit(BI.Layout, {
});
if (o.rowSize[i] !== "auto") {
if (o.verticalAlign === BI.VerticalAlign.Stretch && o.rowSize[i] !== "") {
w.element.addClass("fill");
w.element.addClass("f-f");
} else {
w.element.addClass("shrink-none");
w.element.addClass("f-s-n");
}
}
if (o.rowSize[i] > 0) {
w.element.height(o.rowSize[i] <= 1 ? ((o.rowSize[i] * 100).toFixed(1) + "%") : (o.rowSize[i] / BI.pixRatio + BI.pixUnit));
w.element.height(o.rowSize[i] === "" ? "" : (o.rowSize[i] <= 1 ? ((o.rowSize[i] * 100).toFixed(1) + "%") : (o.rowSize[i] / BI.pixRatio + BI.pixUnit)));
}
if (o.rowSize[i] === "fill") {
w.element.addClass("fill");
w.element.addClass("f-f");
}
w.element.addClass("c-e");
if (i === 0) {
w.element.addClass("f-c");
}
if (i === o.items.length - 1) {
w.element.addClass("l-c");
}
if (o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0) !== 0) {
w.element.css({

2
src/core/wrapper/layout/layout.horizontal.js
Unescape View File

@ -39,7 +39,7 @@ BI.HorizontalLayout = BI.inherit(BI.Layout, {
_addElement: function (i, item) {
var o = this.options;
var td;
var width = o.columnSize[i] <= 1 ? ((o.columnSize[i] * 100).toFixed(1) + "%") : o.columnSize[i];
var width = o.columnSize[i] === "" ? "" : (o.columnSize[i] <= 1 ? ((o.columnSize[i] * 100).toFixed(1) + "%") : (i === 0 ? o.hgap : 0) + o.hgap + o.lgap + o.rgap + o.columnSize[i]);
if (!this.hasWidget(this._getChildName(i))) {
var w = BI._lazyCreateWidget(item);
w.element.css({position: "relative", margin: "0px auto"});

45
src/core/wrapper/layout/layout.inline.js
Unescape View File

@ -12,6 +12,9 @@ BI.InlineLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.InlineLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-i",
horizontalAlign: BI.HorizontalAlign.Left,
verticalAlign: BI.VerticalAlign.Top,
columnSize: [],
hgap: 0,
vgap: 0,
lgap: 0,
@ -23,13 +26,36 @@ BI.InlineLayout = BI.inherit(BI.Layout, {
render: function () {
BI.InlineLayout.superclass.render.apply(this, arguments);
this.populate(this.options.items);
var o = this.options;
this.element.css({
textAlign: o.horizontalAlign
});
this.populate(o.items);
},
_addElement: function (i, item) {
_addElement: function (i, item, length) {
var o = this.options;
var w = BI.InlineLayout.superclass._addElement.apply(this, arguments);
w.element.css({"position": "relative", display: "inline-block", "*display": "inline", "*zoom": 1});
w.element.css({
width: o.columnSize[i] === "" ? "" : (o.columnSize[i] <= 1 ? ((o.columnSize[i] * 100).toFixed(1) + "%") : (o.columnSize[i] / BI.pixRatio + BI.pixUnit)),
position: "relative",
"vertical-align": o.verticalAlign
});
w.element.addClass("i-item");
if (o.columnSize[i] === "fill") {
var left = o.hgap + (item.lgap || 0) + (item.hgap || 0),
right = o.hgap + (item.rgap || 0) + (item.hgap || 0);
for (var k = 0; k < i; k++) {
left += o.hgap + o.lgap + o.rgap + o.columnSize[k];
}
for (var k = i + 1; k < o.columnSize.length; k++) {
right += o.hgap + o.lgap + o.rgap + o.columnSize[k];
}
w.element.css("min-width", "calc(100% - " + ((left + right) / BI.pixRatio + BI.pixUnit) + ")");
if (o.horizontalAlign === BI.HorizontalAlign.Stretch) {
w.element.width(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)) / BI.pixRatio + BI.pixUnit
@ -57,6 +83,19 @@ BI.InlineLayout = BI.inherit(BI.Layout, {
this.stroke(this.options.items);
},
addItem: function (item) {
throw new Error("不能添加元素");
},
stroke: function (items) {
var self = this;
BI.each(items, function (i, item) {
if (item) {
self._addElement(i, item, items.length);
}
});
},
populate: function (items) {
BI.InlineLayout.superclass.populate.apply(this, arguments);
this._mount();

14
src/core/wrapper/layout/layout.table.js
Unescape View File

@ -9,21 +9,11 @@ BI.TableLayout = BI.inherit(BI.Layout, {
return BI.extend(BI.TableLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-t",
scrolly: true,
columnSize: [200, 200, "fill"],
columnSize: [],
rowSize: 30, // or [30,30,30]
hgap: 0,
vgap: 0,
items: [[
{
el: {text: "label1"}
},
{
el: {text: "label2"}
},
{
el: {text: "label3"}
}
]]
items: []
});
},
render: function () {

45
src/core/wrapper/layout/layout.td.js
Unescape View File

@ -7,20 +7,14 @@ BI.TdLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.TdLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-td",
columnSize: [200, 200, 200],
columnSize: [],
hgap: 0,
vgap: 0,
items: [[
{
el: {text: "label1"}
},
{
el: {text: "label2"}
},
{
el: {text: "label3"}
}
]]
tgap: 0,
bgap: 0,
lgap: 0,
rgap: 0,
items: []
});
},
render: function () {
@ -85,22 +79,31 @@ BI.TdLayout = BI.inherit(BI.Layout, {
for (var i = 0; i < arr.length; i++) {
var w = BI._lazyCreateWidget(arr[i]);
w.element.css({position: "relative", top: "0", left: "0", margin: "0px auto"});
if (arr[i].lgap) {
w.element.css({"margin-left": arr[i].lgap / BI.pixRatio + BI.pixUnit});
var item = arr[i];
if (o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0) !== 0) {
w.element.css({
"margin-top": (o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0)) / BI.pixRatio + BI.pixUnit
});
}
if (arr[i].rgap) {
w.element.css({"margin-right": arr[i].rgap / BI.pixRatio + BI.pixUnit});
if (o.hgap + o.lgap + (item.lgap || 0) + (item.hgap || 0) !== 0) {
w.element.css({
"margin-left": ((i === 0 ? o.hgap : 0) + o.lgap + (item.lgap || 0) + (item.hgap || 0)) / BI.pixRatio + BI.pixUnit
});
}
if (arr[i].tgap) {
w.element.css({"margin-top": arr[i].tgap / BI.pixRatio + BI.pixUnit});
if (o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0) !== 0) {
w.element.css({
"margin-right": (o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0)) / BI.pixRatio + BI.pixUnit
});
}
if (arr[i].bgap) {
w.element.css({"margin-bottom": arr[i].bgap / BI.pixRatio + BI.pixUnit});
if (o.vgap + o.bgap + (item.bgap || 0) + (item.vgap || 0) !== 0) {
w.element.css({
"margin-bottom": (o.vgap + o.bgap + (item.bgap || 0) + (item.vgap || 0)) / BI.pixRatio + BI.pixUnit
});
}
first(w, this.rows++, i);
var td = BI._lazyCreateWidget({
type: "bi.default",
width: o.columnSize[i] <= 1 ? ((o.columnSize[i] * 100).toFixed(1) + "%") : o.columnSize[i],
width: o.columnSize[i] === "" ? "" : (o.columnSize[i] <= 1 ? ((o.columnSize[i] * 100).toFixed(1) + "%") : (i === 0 ? o.hgap : 0) + o.hgap + o.lgap + o.rgap + o.columnSize[i]),
tagName: "td",
items: [w]
});

51
src/less/core/wrapper/flex.horizontal.less
Unescape View File

@ -63,15 +63,19 @@
flex-wrap: nowrap;
&.v-middle {
/* 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-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;
> .c-e {
margin-top: auto !important;
margin-bottom: auto !important;
}
}
&.v-bottom {
@ -99,15 +103,22 @@
}
&.h-center {
/* 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-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;
> .f-c {
margin-left: auto !important;
}
> .l-c {
margin-right: auto !important;
}
}
&.h-right {
@ -122,14 +133,14 @@
justify-content: flex-end;
}
> .shrink-none {
> .f-s-n {
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-shrink: 0;
flex-shrink: 0;
}
> .fill {
> .f-f {
-webkit-flex-grow: 1;
-moz-flex-grow: 1;
-ms-flex-grow: 1;

5
src/less/core/wrapper/flex.leftrightvertical.center.less
Unescape View File

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

53
src/less/core/wrapper/flex.vertical.less
Unescape View File

@ -28,7 +28,7 @@
flex-direction: row;
}
.bi-f-v, .bi-flex-vertical-layout{
.bi-f-v, .bi-flex-vertical-layout {
.flex();
.vertical();
@ -62,15 +62,19 @@
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;
///* 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;
> .c-e {
margin-left: auto !important;
margin-right: auto !important;
}
}
&.h-right {
@ -98,15 +102,22 @@
}
&.v-middle {
/* 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-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;
> .f-c {
margin-top: auto !important;
}
> .l-c {
margin-bottom: auto !important;
}
}
&.v-bottom {
@ -121,14 +132,14 @@
justify-content: flex-end;
}
> .shrink-none {
> .f-s-n {
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-shrink: 0;
flex-shrink: 0;
}
> .fill {
> .f-f {
-webkit-flex-grow: 1;
-moz-flex-grow: 1;
-ms-flex-grow: 1;

93
src/less/core/wrapper/flex.wrapper.horizontal.less
Unescape View File

@ -29,6 +29,47 @@
}
.bi-f-s-h, .bi-flex-scrollable-horizontal-layout {
.flex();
&.h-center {
> .f-s-h-w {
margin-left: auto !important;
margin-right: auto !important;
}
}
&.v-middle {
> .f-s-h-w {
margin-top: auto !important;
margin-right: auto !important;
}
}
&.h-right {
/* 09版 */
-webkit-box-pack: flex-end;
/* 12版 */
-webkit-justify-content: flex-end;
-moz-justify-content: flex-end;
-ms-justify-content: flex-end;
-ms-flex-pack: end;
-o-justify-content: flex-end;
justify-content: flex-end;
}
&.v-bottom {
/* 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;
}
& .f-s-h-w, & .flex-scrollable-horizontal-layout-wrapper {
.flex();
.horizontal();
@ -65,19 +106,22 @@
min-height: 100%;
&.v-middle {
/* 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-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;
> .c-e {
margin-top: auto !important;
margin-bottom: auto !important;
}
&.h-center {
min-width: 100%;
float: left;
}
}
@ -106,15 +150,22 @@
}
&.h-center {
/* 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-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;
> .f-c {
margin-left: auto !important;
}
> .l-c {
margin-right: auto !important;
}
}
&.h-right {
@ -129,14 +180,14 @@
justify-content: flex-end;
}
> .shrink-none {
> .f-s-n {
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-shrink: 0;
flex-shrink: 0;
}
> .fill {
> .f-f {
-webkit-flex-grow: 1;
-moz-flex-grow: 1;
-ms-flex-grow: 1;

108
src/less/core/wrapper/flex.wrapper.vertical.less
Unescape View File

@ -29,6 +29,59 @@
}
.bi-f-s-v, .bi-flex-scrollable-vertical-layout {
.flex();
.vertical();
&.h-center {
> .f-s-v-w {
margin-left: auto !important;
margin-right: auto !important;
}
}
&.v-middle {
> .f-s-v-w {
margin-top: auto !important;
margin-bottom: auto !important;
}
}
&.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;
}
&.v-bottom {
/* 09版 */
-webkit-box-pack: flex-end;
/* 12版 */
-webkit-justify-content: flex-end;
-moz-justify-content: flex-end;
-ms-justify-content: flex-end;
-ms-flex-pack: end;
-o-justify-content: flex-end;
justify-content: 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;
}
& .f-s-v-w, & .flex-scrollable-vertical-layout-wrapper {
.flex();
.vertical();
@ -62,22 +115,26 @@
-o-flex-wrap: nowrap;
flex-wrap: nowrap;
min-width: 100%;
//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;
///* 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;
> .c-e {
margin-left: auto !important;
margin-right: auto !important;
}
&.v-middle {
min-height: 100%;
float: left;
}
}
@ -106,15 +163,22 @@
}
&.v-middle {
/* 09版 */
-webkit-box-pack: center;
/* 12版 */
-webkit-justify-content: center;
-moz-justify-content: center;
-ms-justify-content: center;
-o-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
///* 09版 */
//-webkit-box-pack: center;
///* 12版 */
//-webkit-justify-content: center;
//-moz-justify-content: center;
//-ms-justify-content: center;
//-o-justify-content: center;
//-ms-flex-pack: center;
//justify-content: center;
> .f-c {
margin-top: auto !important;
}
> .l-c {
margin-bottom: auto !important;
}
}
&.v-bottom {
@ -129,14 +193,14 @@
justify-content: flex-end;
}
> .shrink-none {
> .f-s-n {
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-shrink: 0;
flex-shrink: 0;
}
> .fill {
> .f-f {
-webkit-flex-grow: 1;
-moz-flex-grow: 1;
-ms-flex-grow: 1;

24
src/less/core/wrapper/inline.less
Unescape View File

@ -0,0 +1,24 @@
.bi-i {
white-space: nowrap;
&:after {
display: inline-block;
width: 0;
min-height: 100%;
vertical-align: middle;
content: ' ';
}
& > .i-item {
display: inline-block;
&.x-icon {
display: inline-block !important;
}
}
& > .bi-combo {
&.bi-combo-popup {
display: inline-block !important;
}
}
}
Write Preview
Loading…
Cancel
Save