diff --git a/demo/js/config/core.js b/demo/js/config/core.js index fee558f25..2c5794488 100644 --- a/demo/js/config/core.js +++ b/demo/js/config/core.js @@ -128,6 +128,10 @@ Demo.CORE_CONFIG = [{ pId: 10201, text: "bi.combo(各种位置)", value: "demo.combo2" +}, { + pId: 10201, + text: "bi.combo(內部位置)", + value: "demo.combo3" }, { pId: 10201, text: "bi.expander", diff --git a/demo/js/core/abstract/combination/demo.combo3.js b/demo/js/core/abstract/combination/demo.combo3.js new file mode 100644 index 000000000..614c36ddd --- /dev/null +++ b/demo/js/core/abstract/combination/demo.combo3.js @@ -0,0 +1,75 @@ +Demo.Func = BI.inherit(BI.Widget, { + props: { + baseCls: "demo-func" + }, + + _createEl: function () { + return { + type: "bi.label", + cls:"bi-border", + height: "100%", + text: "点击" + }; + }, + + oneCombo: function () { + return BI.createWidget({ + type: "bi.combo", + direction: "right,innerRight", + isNeedAdjustWidth: false, + isNeedAdjustHeight: false, + el: this._createEl(), + popup: { + el: { + type: "bi.layout", + width: 200, + height: 200 + } + } + }); + }, + + twoCombo: function () { + return BI.createWidget({ + type: "bi.combo", + direction: "right,innerRight", + isNeedAdjustWidth: false, + isNeedAdjustHeight: false, + el: this._createEl(), + popup: { + el: { + type: "bi.layout", + width: 1000, + height: 200 + } + } + }); + }, + + threeCombo: function () { + return BI.createWidget({ + type: "bi.combo", + direction: "right,innerRight", + isNeedAdjustWidth: false, + isNeedAdjustHeight: false, + el: this._createEl(), + popup: { + el: { + type: "bi.layout", + width: 400, + height: 200 + } + } + }); + }, + + render: function () { + return { + type: "bi.grid", + hgap: 10, + vgap: 5, + items: [[this.oneCombo()], [this.twoCombo()], [this.threeCombo()]] + }; + } +}); +BI.shortcut("demo.combo3", Demo.Func); \ No newline at end of file diff --git a/src/base/combination/combo.js b/src/base/combination/combo.js index 31fcc7640..9ff4f6d8a 100644 --- a/src/base/combination/combo.js +++ b/src/base/combination/combo.js @@ -9,7 +9,7 @@ BI.Combo = BI.inherit(BI.Widget, { baseCls: (conf.baseCls || "") + " bi-combo", trigger: "click", toggle: true, - direction: "bottom", // top||bottom||left||right||top,left||top,right||bottom,left||bottom,right + direction: "bottom", // top||bottom||left||right||top,left||top,right||bottom,left||bottom,right||right,left container: null, // popupview放置的容器，默认为this.element isDefaultInit: false, destroyWhenHide: false, @@ -381,6 +381,9 @@ BI.Combo = BI.inherit(BI.Widget, { case "right,top": p = BI.DOM.getComboPosition(combo, this.popupView, o.adjustXOffset || o.adjustLength, o.adjustYOffset, o.isNeedAdjustHeight, ["right", "left", "top", "bottom"], o.offsetStyle); break; + case "right,innerRight": + p = BI.DOM.getComboPosition(combo, this.popupView, o.adjustXOffset || o.adjustLength, o.adjustYOffset, o.isNeedAdjustHeight, ["right", "left", "innerRight", "innerLeft", "bottom", "top"], o.offsetStyle); + break; case "top,custom": case "custom,top": p = BI.DOM.getTopAdaptPosition(combo, this.popupView, o.adjustYOffset || o.adjustLength, o.isNeedAdjustHeight); diff --git a/src/core/platform/web/dom.js b/src/core/platform/web/dom.js index c2f37842e..e5fbdbe40 100644 --- a/src/core/platform/web/dom.js +++ b/src/core/platform/web/dom.js @@ -306,6 +306,12 @@ }; }, + getInnerLeftPosition: function (combo, popup, extraWidth) { + return { + left: combo.element.offset().left + (extraWidth || 0) + }; + }, + getRightPosition: function (combo, popup, extraWidth) { var el = combo.element; return { @@ -313,6 +319,13 @@ }; }, + getInnerRightPosition: function (combo, popup, extraWidth) { + var el = combo.element, viewBounds = popup.element.bounds(); + return { + left: el.offset().left + el.outerWidth() - viewBounds.width - (extraWidth || 0) + }; + }, + getTopPosition: function (combo, popup, extraHeight) { return { top: combo.element.offset().top - popup.element.outerHeight() - (extraHeight || 0) @@ -330,11 +343,20 @@ return BI.DOM.getLeftPosition(combo, popup, extraWidth).left >= 0; }, + isInnerLeftSpaceEnough: function (combo, popup, extraWidth) { + var viewBounds = popup.element.bounds(),windowBounds = BI.Widget._renderEngine.createElement("body").bounds(); + return BI.DOM.getInnerLeftPosition(combo, popup, extraWidth).left + viewBounds.width <= windowBounds.width; + }, + isRightSpaceEnough: function (combo, popup, extraWidth) { var viewBounds = popup.element.bounds(), windowBounds = BI.Widget._renderEngine.createElement("body").bounds(); return BI.DOM.getRightPosition(combo, popup, extraWidth).left + viewBounds.width <= windowBounds.width; }, + isInnerRightSpaceEnough: function (combo, popup, extraWidth) { + return BI.DOM.getInnerRightPosition(combo, popup, extraWidth).left >= 0; + }, + isTopSpaceEnough: function (combo, popup, extraHeight) { return BI.DOM.getTopPosition(combo, popup, extraHeight).top >= 0; }, @@ -537,7 +559,7 @@ extraWidth || (extraWidth = 0); extraHeight || (extraHeight = 0); var i, direct; - var leftRight = [], topBottom = []; + var leftRight = [], topBottom = [], innerLeftRight = []; var isNeedAdaptHeight = false, tbFirst = false, lrFirst = false; var left, top, pos, firstDir = directions[0]; for (i = 0; i < directions.length; i++) { @@ -555,6 +577,12 @@ case "bottom": topBottom.push(direct); break; + case "innerLeft": + innerLeftRight.push(direct); + break; + case "innerRight": + innerLeftRight.push(direct); + break; } } for (i = 0; i < directions.length; i++) { @@ -646,6 +674,48 @@ } tbFirst = true; break; + case "innerLeft": + if (!isNeedAdaptHeight) { + var tW = tbFirst ? extraHeight : extraWidth, tH = tbFirst ? 0 : extraHeight; + if (BI.DOM.isInnerLeftSpaceEnough(combo, popup, tW)) { + left = BI.DOM.getInnerLeftPosition(combo, popup, tW).left; + if (topBottom[0] === "bottom") { + pos = BI.DOM.getTopAlignPosition(combo, popup, tH, needAdaptHeight); + pos.dir = "innerLeft,bottom"; + } else { + pos = BI.DOM.getBottomAlignPosition(combo, popup, tH, needAdaptHeight); + pos.dir = "innerLeft,top"; + } + if (tbFirst) { + pos.change = "innerLeft"; + } + pos.left = left; + return pos; + } + } + lrFirst = true; + break; + case "innerRight": + if (!isNeedAdaptHeight) { + var tW = tbFirst ? extraHeight : extraWidth, tH = tbFirst ? extraWidth : extraHeight; + if (BI.DOM.isInnerRightSpaceEnough(combo, popup, tW)) { + left = BI.DOM.getInnerRightPosition(combo, popup, tW).left; + if (topBottom[0] === "bottom") { + pos = BI.DOM.getTopAlignPosition(combo, popup, tH, needAdaptHeight); + pos.dir = "innerRight,bottom"; + } else { + pos = BI.DOM.getBottomAlignPosition(combo, popup, tH, needAdaptHeight); + pos.dir = "innerRight,top"; + } + if (tbFirst) { + pos.change = "innerRight"; + } + pos.left = left; + return pos; + } + } + break; + } }