Cauchy.Ke
/
fineui
forked from fanruan/fineui
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity
Browse Source

网格布局

master
guy 8 years ago
parent
971e3bd7ae
commit
2f6a905355
4 changed files with 69 additions and 45 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 32
      bi/widget.js
  2. 32
      docs/widget.js
  3. 27
      src/widget/arrangement/arrangement.js
  4. 5
      src/widget/responsivetable/responsivetable.js

32
bi/widget.js
Unescape View File

@ -2998,13 +2998,17 @@ BI.Arrangement = BI.inherit(BI.Widget, {
_getOneWidthPortion: function () { _getOneWidthPortion: function () {
return this.getClientWidth() / BI.Arrangement.PORTION; return this.getClientWidth() / BI.Arrangement.PORTION;
}, },
_getOneHeightPortion: function () {
return this.getClientHeight() / BI.Arrangement.H_PORTION;
},
_getGridPositionAndSize: function (position) { _getGridPositionAndSize: function (position) {
var perWidth = this._getOneWidthPortion(); var perWidth = this._getOneWidthPortion();
var perHeight = this._getOneHeightPortion();
var widthPortion = Math.round(position.width / perWidth); var widthPortion = Math.round(position.width / perWidth);
var leftPortion = Math.round(position.left / perWidth); var leftPortion = Math.round(position.left / perWidth);
var topPortion = Math.round(position.top / BI.Arrangement.GRID_HEIGHT); var topPortion = Math.round(position.top / perHeight);
var heightPortion = Math.round(position.height / BI.Arrangement.GRID_HEIGHT); var heightPortion = Math.round(position.height / perHeight);
// if (leftPortion > BI.Arrangement.PORTION) { // if (leftPortion > BI.Arrangement.PORTION) {
// leftPortion = BI.Arrangement.PORTION; // leftPortion = BI.Arrangement.PORTION;
// } // }
@ -3030,11 +3034,12 @@ BI.Arrangement = BI.inherit(BI.Widget, {
_getBlockPositionAndSize: function (position) { _getBlockPositionAndSize: function (position) {
var perWidth = this._getOneWidthPortion(); var perWidth = this._getOneWidthPortion();
var perHeight = this._getOneHeightPortion();
return { return {
left: position.x * perWidth, left: position.x * perWidth,
top: position.y * BI.Arrangement.GRID_HEIGHT, top: position.y * perHeight,
width: position.w * perWidth, width: position.w * perWidth,
height: position.h * BI.Arrangement.GRID_HEIGHT height: position.h * perHeight
}; };
}, },
@ -3721,12 +3726,15 @@ BI.Arrangement = BI.inherit(BI.Widget, {
break; break;
case BI.Arrangement.LAYOUT_TYPE.GRID: case BI.Arrangement.LAYOUT_TYPE.GRID:
if (this._isArrangeFine()) { if (this._isArrangeFine()) {
var width = this.getClientWidth(); var width = this.getClientWidth(), height = this.getClientHeight();
var xRatio = (ratio.x || 1) * width / (occupied.left + occupied.width); var xRatio = (ratio.x || 1) * width / (occupied.left + occupied.width);
var yRatio = (ratio.y || 1) * height / (occupied.top + occupied.height);
var regions = this._cloneRegion(); var regions = this._cloneRegion();
BI.each(regions, function (i, region) { BI.each(regions, function (i, region) {
region.left = region.left * xRatio; region.left = region.left * xRatio;
region.width = region.width * xRatio; region.width = region.width * xRatio;
region.top = region.top * yRatio;
region.height = region.height * yRatio;
}); });
if (this._test(regions)) { if (this._test(regions)) {
var layout = this._getLayoutsByRegions(regions); var layout = this._getLayoutsByRegions(regions);
@ -3861,6 +3869,7 @@ BI.Arrangement = BI.inherit(BI.Widget, {
case BI.Arrangement.LAYOUT_TYPE.FREE: case BI.Arrangement.LAYOUT_TYPE.FREE:
break; break;
case BI.Arrangement.LAYOUT_TYPE.GRID: case BI.Arrangement.LAYOUT_TYPE.GRID:
var perHeight = this._getOneHeightPortion();
var width = this.getClientWidth(), height = this.getClientHeight(); var width = this.getClientWidth(), height = this.getClientHeight();
var regions = this._cloneRegion(); var regions = this._cloneRegion();
var clone = BI.toArray(regions); var clone = BI.toArray(regions);
@ -3877,10 +3886,10 @@ BI.Arrangement = BI.inherit(BI.Widget, {
BI.each(clone, function (i, region) { BI.each(clone, function (i, region) {
var row = Math.floor(i / 3), col = i % 3; var row = Math.floor(i / 3), col = i % 3;
BI.extend(region, { BI.extend(region, {
top: row * 380, top: row * perHeight * 6,
left: col * w, left: col * w,
width: w, width: w,
height: 380 height: perHeight * 6
}); });
if (!store[row]) { if (!store[row]) {
store[row] = {}; store[row] = {};
@ -3930,8 +3939,8 @@ BI.Arrangement = BI.inherit(BI.Widget, {
}); });
BI.Arrangement.EVENT_SCROLL = "EVENT_SCROLL"; BI.Arrangement.EVENT_SCROLL = "EVENT_SCROLL";
BI.extend(BI.Arrangement, { BI.extend(BI.Arrangement, {
PORTION: 24, PORTION: 32,
GRID_HEIGHT: 60, H_PORTION: 18,
LAYOUT_TYPE: { LAYOUT_TYPE: {
ADAPTIVE: 0, ADAPTIVE: 0,
FREE: 1, FREE: 1,
@ -15027,7 +15036,8 @@ BI.ResponisveTable = BI.inherit(BI.Widget, {
} }
}); });
//因为有边框，所以加上数组长度的参数调整 //因为有边框，所以加上数组长度的参数调整
var sumLeft = BI.sum(columnSizeLeft) + columnSizeLeft.length, sumRight = BI.sum(columnSizeRight) + columnSizeRight.length; var sumLeft = BI.sum(columnSizeLeft) + columnSizeLeft.length,
sumRight = BI.sum(columnSizeRight) + columnSizeRight.length;
return { return {
sumLeft: sumLeft, sumLeft: sumLeft,
sumRight: sumRight, sumRight: sumRight,
@ -15231,11 +15241,9 @@ BI.ResponisveTable = BI.inherit(BI.Widget, {
this.table.populate.apply(this.table, arguments); this.table.populate.apply(this.table, arguments);
if (o.isNeedFreeze === true) { if (o.isNeedFreeze === true) {
BI.nextTick(function () { BI.nextTick(function () {
if (self.element.is(":visible")) {
self._initRegionSize(); self._initRegionSize();
self.table.resize(); self.table.resize();
self._resizeHeader(); self._resizeHeader();
}
}); });
} }
} }

32
docs/widget.js
Unescape View File

@ -2998,13 +2998,17 @@ BI.Arrangement = BI.inherit(BI.Widget, {
_getOneWidthPortion: function () { _getOneWidthPortion: function () {
return this.getClientWidth() / BI.Arrangement.PORTION; return this.getClientWidth() / BI.Arrangement.PORTION;
}, },
_getOneHeightPortion: function () {
return this.getClientHeight() / BI.Arrangement.H_PORTION;
},
_getGridPositionAndSize: function (position) { _getGridPositionAndSize: function (position) {
var perWidth = this._getOneWidthPortion(); var perWidth = this._getOneWidthPortion();
var perHeight = this._getOneHeightPortion();
var widthPortion = Math.round(position.width / perWidth); var widthPortion = Math.round(position.width / perWidth);
var leftPortion = Math.round(position.left / perWidth); var leftPortion = Math.round(position.left / perWidth);
var topPortion = Math.round(position.top / BI.Arrangement.GRID_HEIGHT); var topPortion = Math.round(position.top / perHeight);
var heightPortion = Math.round(position.height / BI.Arrangement.GRID_HEIGHT); var heightPortion = Math.round(position.height / perHeight);
// if (leftPortion > BI.Arrangement.PORTION) { // if (leftPortion > BI.Arrangement.PORTION) {
// leftPortion = BI.Arrangement.PORTION; // leftPortion = BI.Arrangement.PORTION;
// } // }
@ -3030,11 +3034,12 @@ BI.Arrangement = BI.inherit(BI.Widget, {
_getBlockPositionAndSize: function (position) { _getBlockPositionAndSize: function (position) {
var perWidth = this._getOneWidthPortion(); var perWidth = this._getOneWidthPortion();
var perHeight = this._getOneHeightPortion();
return { return {
left: position.x * perWidth, left: position.x * perWidth,
top: position.y * BI.Arrangement.GRID_HEIGHT, top: position.y * perHeight,
width: position.w * perWidth, width: position.w * perWidth,
height: position.h * BI.Arrangement.GRID_HEIGHT height: position.h * perHeight
}; };
}, },
@ -3721,12 +3726,15 @@ BI.Arrangement = BI.inherit(BI.Widget, {
break; break;
case BI.Arrangement.LAYOUT_TYPE.GRID: case BI.Arrangement.LAYOUT_TYPE.GRID:
if (this._isArrangeFine()) { if (this._isArrangeFine()) {
var width = this.getClientWidth(); var width = this.getClientWidth(), height = this.getClientHeight();
var xRatio = (ratio.x || 1) * width / (occupied.left + occupied.width); var xRatio = (ratio.x || 1) * width / (occupied.left + occupied.width);
var yRatio = (ratio.y || 1) * height / (occupied.top + occupied.height);
var regions = this._cloneRegion(); var regions = this._cloneRegion();
BI.each(regions, function (i, region) { BI.each(regions, function (i, region) {
region.left = region.left * xRatio; region.left = region.left * xRatio;
region.width = region.width * xRatio; region.width = region.width * xRatio;
region.top = region.top * yRatio;
region.height = region.height * yRatio;
}); });
if (this._test(regions)) { if (this._test(regions)) {
var layout = this._getLayoutsByRegions(regions); var layout = this._getLayoutsByRegions(regions);
@ -3861,6 +3869,7 @@ BI.Arrangement = BI.inherit(BI.Widget, {
case BI.Arrangement.LAYOUT_TYPE.FREE: case BI.Arrangement.LAYOUT_TYPE.FREE:
break; break;
case BI.Arrangement.LAYOUT_TYPE.GRID: case BI.Arrangement.LAYOUT_TYPE.GRID:
var perHeight = this._getOneHeightPortion();
var width = this.getClientWidth(), height = this.getClientHeight(); var width = this.getClientWidth(), height = this.getClientHeight();
var regions = this._cloneRegion(); var regions = this._cloneRegion();
var clone = BI.toArray(regions); var clone = BI.toArray(regions);
@ -3877,10 +3886,10 @@ BI.Arrangement = BI.inherit(BI.Widget, {
BI.each(clone, function (i, region) { BI.each(clone, function (i, region) {
var row = Math.floor(i / 3), col = i % 3; var row = Math.floor(i / 3), col = i % 3;
BI.extend(region, { BI.extend(region, {
top: row * 380, top: row * perHeight * 6,
left: col * w, left: col * w,
width: w, width: w,
height: 380 height: perHeight * 6
}); });
if (!store[row]) { if (!store[row]) {
store[row] = {}; store[row] = {};
@ -3930,8 +3939,8 @@ BI.Arrangement = BI.inherit(BI.Widget, {
}); });
BI.Arrangement.EVENT_SCROLL = "EVENT_SCROLL"; BI.Arrangement.EVENT_SCROLL = "EVENT_SCROLL";
BI.extend(BI.Arrangement, { BI.extend(BI.Arrangement, {
PORTION: 24, PORTION: 32,
GRID_HEIGHT: 60, H_PORTION: 18,
LAYOUT_TYPE: { LAYOUT_TYPE: {
ADAPTIVE: 0, ADAPTIVE: 0,
FREE: 1, FREE: 1,
@ -15027,7 +15036,8 @@ BI.ResponisveTable = BI.inherit(BI.Widget, {
} }
}); });
//因为有边框，所以加上数组长度的参数调整 //因为有边框，所以加上数组长度的参数调整
var sumLeft = BI.sum(columnSizeLeft) + columnSizeLeft.length, sumRight = BI.sum(columnSizeRight) + columnSizeRight.length; var sumLeft = BI.sum(columnSizeLeft) + columnSizeLeft.length,
sumRight = BI.sum(columnSizeRight) + columnSizeRight.length;
return { return {
sumLeft: sumLeft, sumLeft: sumLeft,
sumRight: sumRight, sumRight: sumRight,
@ -15231,11 +15241,9 @@ BI.ResponisveTable = BI.inherit(BI.Widget, {
this.table.populate.apply(this.table, arguments); this.table.populate.apply(this.table, arguments);
if (o.isNeedFreeze === true) { if (o.isNeedFreeze === true) {
BI.nextTick(function () { BI.nextTick(function () {
if (self.element.is(":visible")) {
self._initRegionSize(); self._initRegionSize();
self.table.resize(); self.table.resize();
self._resizeHeader(); self._resizeHeader();
}
}); });
} }
} }

27
src/widget/arrangement/arrangement.js
Unescape View File

@ -2003,13 +2003,17 @@ BI.Arrangement = BI.inherit(BI.Widget, {
_getOneWidthPortion: function () { _getOneWidthPortion: function () {
return this.getClientWidth() / BI.Arrangement.PORTION; return this.getClientWidth() / BI.Arrangement.PORTION;
}, },
_getOneHeightPortion: function () {
return this.getClientHeight() / BI.Arrangement.H_PORTION;
},
_getGridPositionAndSize: function (position) { _getGridPositionAndSize: function (position) {
var perWidth = this._getOneWidthPortion(); var perWidth = this._getOneWidthPortion();
var perHeight = this._getOneHeightPortion();
var widthPortion = Math.round(position.width / perWidth); var widthPortion = Math.round(position.width / perWidth);
var leftPortion = Math.round(position.left / perWidth); var leftPortion = Math.round(position.left / perWidth);
var topPortion = Math.round(position.top / BI.Arrangement.GRID_HEIGHT); var topPortion = Math.round(position.top / perHeight);
var heightPortion = Math.round(position.height / BI.Arrangement.GRID_HEIGHT); var heightPortion = Math.round(position.height / perHeight);
// if (leftPortion > BI.Arrangement.PORTION) { // if (leftPortion > BI.Arrangement.PORTION) {
// leftPortion = BI.Arrangement.PORTION; // leftPortion = BI.Arrangement.PORTION;
// } // }
@ -2035,11 +2039,12 @@ BI.Arrangement = BI.inherit(BI.Widget, {
_getBlockPositionAndSize: function (position) { _getBlockPositionAndSize: function (position) {
var perWidth = this._getOneWidthPortion(); var perWidth = this._getOneWidthPortion();
var perHeight = this._getOneHeightPortion();
return { return {
left: position.x * perWidth, left: position.x * perWidth,
top: position.y * BI.Arrangement.GRID_HEIGHT, top: position.y * perHeight,
width: position.w * perWidth, width: position.w * perWidth,
height: position.h * BI.Arrangement.GRID_HEIGHT height: position.h * perHeight
}; };
}, },
@ -2726,12 +2731,15 @@ BI.Arrangement = BI.inherit(BI.Widget, {
break; break;
case BI.Arrangement.LAYOUT_TYPE.GRID: case BI.Arrangement.LAYOUT_TYPE.GRID:
if (this._isArrangeFine()) { if (this._isArrangeFine()) {
var width = this.getClientWidth(); var width = this.getClientWidth(), height = this.getClientHeight();
var xRatio = (ratio.x || 1) * width / (occupied.left + occupied.width); var xRatio = (ratio.x || 1) * width / (occupied.left + occupied.width);
var yRatio = (ratio.y || 1) * height / (occupied.top + occupied.height);
var regions = this._cloneRegion(); var regions = this._cloneRegion();
BI.each(regions, function (i, region) { BI.each(regions, function (i, region) {
region.left = region.left * xRatio; region.left = region.left * xRatio;
region.width = region.width * xRatio; region.width = region.width * xRatio;
region.top = region.top * yRatio;
region.height = region.height * yRatio;
}); });
if (this._test(regions)) { if (this._test(regions)) {
var layout = this._getLayoutsByRegions(regions); var layout = this._getLayoutsByRegions(regions);
@ -2866,6 +2874,7 @@ BI.Arrangement = BI.inherit(BI.Widget, {
case BI.Arrangement.LAYOUT_TYPE.FREE: case BI.Arrangement.LAYOUT_TYPE.FREE:
break; break;
case BI.Arrangement.LAYOUT_TYPE.GRID: case BI.Arrangement.LAYOUT_TYPE.GRID:
var perHeight = this._getOneHeightPortion();
var width = this.getClientWidth(), height = this.getClientHeight(); var width = this.getClientWidth(), height = this.getClientHeight();
var regions = this._cloneRegion(); var regions = this._cloneRegion();
var clone = BI.toArray(regions); var clone = BI.toArray(regions);
@ -2882,10 +2891,10 @@ BI.Arrangement = BI.inherit(BI.Widget, {
BI.each(clone, function (i, region) { BI.each(clone, function (i, region) {
var row = Math.floor(i / 3), col = i % 3; var row = Math.floor(i / 3), col = i % 3;
BI.extend(region, { BI.extend(region, {
top: row * 380, top: row * perHeight * 6,
left: col * w, left: col * w,
width: w, width: w,
height: 380 height: perHeight * 6
}); });
if (!store[row]) { if (!store[row]) {
store[row] = {}; store[row] = {};
@ -2935,8 +2944,8 @@ BI.Arrangement = BI.inherit(BI.Widget, {
}); });
BI.Arrangement.EVENT_SCROLL = "EVENT_SCROLL"; BI.Arrangement.EVENT_SCROLL = "EVENT_SCROLL";
BI.extend(BI.Arrangement, { BI.extend(BI.Arrangement, {
PORTION: 24, PORTION: 32,
GRID_HEIGHT: 60, H_PORTION: 18,
LAYOUT_TYPE: { LAYOUT_TYPE: {
ADAPTIVE: 0, ADAPTIVE: 0,
FREE: 1, FREE: 1,

5
src/widget/responsivetable/responsivetable.js
Unescape View File

@ -147,7 +147,8 @@ BI.ResponisveTable = BI.inherit(BI.Widget, {
} }
}); });
//因为有边框，所以加上数组长度的参数调整 //因为有边框，所以加上数组长度的参数调整
var sumLeft = BI.sum(columnSizeLeft) + columnSizeLeft.length, sumRight = BI.sum(columnSizeRight) + columnSizeRight.length; var sumLeft = BI.sum(columnSizeLeft) + columnSizeLeft.length,
sumRight = BI.sum(columnSizeRight) + columnSizeRight.length;
return { return {
sumLeft: sumLeft, sumLeft: sumLeft,
sumRight: sumRight, sumRight: sumRight,
@ -351,11 +352,9 @@ BI.ResponisveTable = BI.inherit(BI.Widget, {
this.table.populate.apply(this.table, arguments); this.table.populate.apply(this.table, arguments);
if (o.isNeedFreeze === true) { if (o.isNeedFreeze === true) {
BI.nextTick(function () { BI.nextTick(function () {
if (self.element.is(":visible")) {
self._initRegionSize(); self._initRegionSize();
self.table.resize(); self.table.resize();
self._resizeHeader(); self._resizeHeader();
}
}); });
} }
} }

Write Preview
Loading…
Cancel
Save