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

布局

es6
git 3 years ago
parent
794d7a9133
commit
d312ca60a5
11 changed files with 99 additions and 102 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. 8
      src/core/wrapper/layout/adapt/adapt.table.js
  2. 19
      src/core/wrapper/layout/fill/float.fill.horizontal.js
  3. 4
      src/core/wrapper/layout/flex/flex.leftrightvertical.center.js
  4. 12
      src/core/wrapper/layout/layout.inline.js
  5. 8
      src/core/wrapper/layout/layout.td.js
  6. 5
      src/less/core/wrapper/fill.horizontal.less
  7. 5
      src/less/core/wrapper/flex.leftrightvertical.center.less
  8. 23
      src/less/core/wrapper/inline.center.less
  9. 23
      src/less/core/wrapper/inline.horizontal.less
  10. 71
      src/less/core/wrapper/inline.old.less
  11. 23
      src/less/core/wrapper/inline.vertical.less

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

@ -4,9 +4,9 @@
* @extends BI.Layout
*/
BI.TableAdaptLayout = BI.inherit(BI.Layout, {
props: function (props) {
props: function () {
return BI.extend(BI.TableAdaptLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-t-a" + (props.verticalAlign === BI.VerticalAlign.Stretch ? " bi-h-fill" : ""),
baseCls: "bi-t-a",
columnSize: [],
verticalAlign: BI.VerticalAlign.Top,
horizontalAlign: BI.HorizontalAlign.Left,
@ -57,7 +57,9 @@ BI.TableAdaptLayout = BI.inherit(BI.Layout, {
var w = BI._lazyCreateWidget(item);
w.element.css({position: "relative", top: "0", left: "0", margin: "0px auto"});
if (o.verticalAlign === BI.VerticalAlign.Stretch) {
w.element.addClass("h-fill-item");
var top = o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0),
bottom = o.vgap + o.bgap + (item.bgap || 0) + (item.vgap || 0);
w.element.css("height", "calc(100% - " + ((top + bottom) / BI.pixRatio + BI.pixUnit) + ")");
}
td = BI._lazyCreateWidget({
type: "bi.default",

19
src/core/wrapper/layout/fill/float.fill.horizontal.js
Unescape View File

@ -1,7 +1,7 @@
BI.FloatHorizontalFillLayout = BI.inherit(BI.Layout, {
props: function () {
return BI.extend(BI.FloatHorizontalFillLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-h-float-fill bi-h-fill",
baseCls: "bi-h-float-fill",
horizontalAlign: BI.HorizontalAlign.Stretch,
verticalAlign: BI.VerticalAlign.Stretch,
hgap: 0,
@ -77,6 +77,12 @@ BI.FloatHorizontalFillLayout = BI.inherit(BI.Layout, {
"margin-bottom": (o.vgap + o.bgap + (item.bgap || 0) + (item.vgap || 0)) / BI.pixRatio + BI.pixUnit
});
}
var top = o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0),
bottom = o.vgap + o.bgap + (item.bgap || 0) + (item.vgap || 0);
w.element.css({
height: "calc(100% - " + ((top + bottom) / BI.pixRatio + BI.pixUnit) + ")",
position: "relative"
});
return w;
}
@ -90,10 +96,8 @@ BI.FloatHorizontalFillLayout = BI.inherit(BI.Layout, {
}
var w = createWidget(i, item);
self.addWidget(self._getChildName(rank++), w);
w.element.addClass("h-fill-item");
w.element.css({
float: "left",
position: "relative"
float: "left"
});
});
BI.backAny(items, function (i, item) {
@ -106,10 +110,8 @@ BI.FloatHorizontalFillLayout = BI.inherit(BI.Layout, {
}
var w = createWidget(i, item, true);
self.addWidget(self._getChildName(rank++), w);
w.element.addClass("h-fill-item");
w.element.css({
float: "right",
position: "relative"
float: "right"
});
});
BI.each(items, function (i, item) {
@ -117,9 +119,6 @@ BI.FloatHorizontalFillLayout = BI.inherit(BI.Layout, {
if (columnSize === "fill") {
var w = createWidget(i, item);
self.addWidget(self._getChildName(rank++), w);
w.element.addClass("h-fill-item").css({
position: "relative"
});
}
});
},

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

@ -57,7 +57,9 @@ BI.FlexLeftRightVerticalAdaptLayout = BI.inherit(BI.Layout, {
return leftItems.concat({
el: {
type: "bi.flex_vertical_adapt",
cls: "flex-left-auto",
css: {
"margin-left": "auto"
},
hgap: o.rhgap,
vgap: o.rvgap,
lgap: o.rlgap,

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

@ -52,13 +52,13 @@ BI.InlineLayout = BI.inherit(BI.Layout, {
});
w.element.addClass("i-item");
if (columnSize === "fill" || columnSize === "") {
var left = o.hgap + (item.lgap || 0) + (item.hgap || 0),
right = o.hgap + (item.rgap || 0) + (item.hgap || 0);
var left = o.hgap + o.lgap + (item.lgap || 0) + (item.hgap || 0),
right = o.hgap + o.rgap + (item.rgap || 0) + (item.hgap || 0);
for (var k = 0; k < i; k++) {
left += o.hgap + o.lgap + o.rgap + (o.columnSize[k] || o.items[k].width);
left += o.hgap + o.lgap + o.rgap + (o.items[k].lgap || 0) + (o.items[k].rgap || 0) + (o.items[k].hgap || 0) + (o.columnSize[k] || o.items[k].width);
}
for (var k = i + 1, len = o.columnSize.length || o.items.length; k < len; k++) {
right += o.hgap + o.lgap + o.rgap + (o.columnSize[k] || o.items[k].width);
right += o.hgap + o.lgap + o.rgap + (o.items[k].lgap || 0) + (o.items[k].rgap || 0) + (o.items[k].hgap || 0) + (o.columnSize[k] || o.items[k].width);
}
if (columnSize === "fill") {
w.element.css("min-width", "calc(100% - " + ((left + right) / BI.pixRatio + BI.pixUnit) + ")");
@ -68,8 +68,8 @@ BI.InlineLayout = BI.inherit(BI.Layout, {
}
}
if (o.verticalAlign === BI.VerticalAlign.Stretch) {
var top = o.vgap + (item.tgap || 0) + (item.vgap || 0),
bottom = o.vgap + (item.bgap || 0) + (item.vgap || 0);
var top = o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0),
bottom = o.vgap + o.bgap + (item.bgap || 0) + (item.vgap || 0);
w.element.css("height", "calc(100% - " + ((top + bottom) / BI.pixRatio + BI.pixUnit) + ")");
}
if (o.vgap + o.tgap + (item.tgap || 0) + (item.vgap || 0) !== 0) {

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

@ -4,9 +4,9 @@
* @extends BI.Layout
*/
BI.TdLayout = BI.inherit(BI.Layout, {
props: function (props) {
props: function () {
return BI.extend(BI.TdLayout.superclass.props.apply(this, arguments), {
baseCls: "bi-td" + (props.verticalAlign === BI.VerticalAlign.Stretch ? " bi-h-fill" : ""),
baseCls: "bi-td",
columnSize: [],
rowSize: [],
verticalAlign: BI.VerticalAlign.Middle,
@ -90,7 +90,9 @@ BI.TdLayout = BI.inherit(BI.Layout, {
for (var i = 0; i < arr.length; i++) {
var w = BI._lazyCreateWidget(arr[i]);
if (o.verticalAlign === BI.VerticalAlign.Stretch) {
w.element.addClass("h-fill-item");
var top = o.vgap + o.tgap + (arr[i].tgap || 0) + (arr[i].vgap || 0),
bottom = o.vgap + o.bgap + (arr[i].bgap || 0) + (arr[i].vgap || 0);
w.element.css("height", "calc(100% - " + ((top + bottom) / BI.pixRatio + BI.pixUnit) + ")");
}
w.element.css({position: "relative", top: "0", left: "0", margin: "0px auto"});
var item = arr[i];

5
src/less/core/wrapper/fill.horizontal.less
Unescape View File

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

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

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

23
src/less/core/wrapper/inline.center.less
Unescape View File

@ -1,23 +0,0 @@
.bi-inline-center-adapt-layout {
&:after {
display: inline-block;
width: 0;
min-height: 100%;
vertical-align: middle;
content: ' ';
}
& > .inline-center-adapt-item {
display: inline-block;
&.x-icon {
display: inline-block !important;
}
}
& > .bi-combo {
&.bi-combo-popup {
display: inline-block !important;
}
}
}

23
src/less/core/wrapper/inline.horizontal.less
Unescape View File

@ -1,23 +0,0 @@
.bi-inline-horizontal-adapt-layout {
&:after {
display: inline-block;
width: 0;
min-height: 100%;
vertical-align: middle;
content: ' ';
}
& > .inline-horizontal-adapt-item {
display: inline-block;
&.x-icon {
display: inline-block !important;
}
}
& > .bi-combo {
&.bi-combo-popup {
display: inline-block !important;
}
}
}

71
src/less/core/wrapper/inline.old.less
Unescape View File

@ -0,0 +1,71 @@
.bi-inline-center-adapt-layout {
&:after {
display: inline-block;
width: 0;
min-height: 100%;
vertical-align: middle;
content: ' ';
}
& > .inline-center-adapt-item {
display: inline-block;
&.x-icon {
display: inline-block !important;
}
}
& > .bi-combo {
&.bi-combo-popup {
display: inline-block !important;
}
}
}
.bi-inline-horizontal-adapt-layout {
&:after {
display: inline-block;
width: 0;
min-height: 100%;
vertical-align: middle;
content: ' ';
}
& > .inline-horizontal-adapt-item {
display: inline-block;
&.x-icon {
display: inline-block !important;
}
}
& > .bi-combo {
&.bi-combo-popup {
display: inline-block !important;
}
}
}
.bi-inline-vertical-adapt-layout {
&:after {
display: inline-block;
width: 0;
min-height: 100%;
vertical-align: middle;
content: ' ';
}
& > .inline-vertical-adapt-item {
display: inline-block;
&.x-icon {
display: inline-block !important;
}
}
& > .bi-combo {
&.bi-combo-popup {
display: inline-block !important;
}
}
}

23
src/less/core/wrapper/inline.vertical.less
Unescape View File

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