Browse Source

REPORT-74080 fix: 修复自定义图标无法居中,调整了撑开的公式

es6
treecat 2 years ago
parent
commit
02142972cf
  1. 11
      demo/js/base/button/demo.button.js
  2. 22
      src/base/single/button/buttons/button.js

11
demo/js/base/button/demo.button.js

@ -256,6 +256,17 @@ Demo.Button = BI.inherit(BI.Widget, {
iconGap: 24,
iconPosition: "top"
}
},{
el: {
type: "bi.button",
text: "自动撑开高度",
iconCls: "close-font",
textHeight: 32,
iconGap: 24,
vgap: 16,
hgap: 100,
iconPosition: "top"
}
}, {
el: {
type: "bi.button",

22
src/base/single/button/buttons/button.js

@ -14,20 +14,29 @@
BI.Button = BI.inherit(BI.BasicButton, {
_const: {
iconWidth: 16
iconWidth: 18
},
_defaultConfig: function (props) {
var conf = BI.Button.superclass._defaultConfig.apply(this, arguments);
var adaptiveHeight = 0;
if (isVertical(props.iconPosition)) {
// 图标高度和文字高度默认相等
adaptiveHeight += (props.textHeight || 16) * 2;
adaptiveHeight += props.iconGap || 4;
var tGap = props.tgap || props.vgap || 2;
var bGap = props.bgap || props.vgap || 2;
adaptiveHeight += (tGap + bGap);
}
return BI.extend(conf, {
baseCls: (conf.baseCls || "") + " bi-button" + ((BI.isIE() && BI.isIE9Below()) ? " hack" : ""),
attributes: {
tabIndex: 1
},
minWidth: (props.block === true || props.clear === true) ? 0 : 80,
// 44 = 垂直间距 6 + 边框 2 + 图标 16 + 图标和文字间隔 8 + 文字 12
height: isVertical(props.iconPosition) ? 44 + ((props.iconGap || 8) - 8) : 24,
height: isVertical(props.iconPosition) ? adaptiveHeight : 24,
shadow: props.clear !== true,
isShadowShowingOnSelected: true,
readonly: true,
@ -49,7 +58,7 @@
bgap: 0,
lgap: 0,
rgap: 0,
iconGap: 8,
iconGap: 4,
iconPosition: "left"
});
},
@ -81,7 +90,10 @@
cls: o.iconCls,
width: this._const.iconWidth,
height: lineHeight,
lineHeight: lineHeight
lineHeight: lineHeight,
// 不设置,自定义按钮无法居中
iconWidth: o.iconWidth,
iconHeight: o.iconHeight
});
this.text = BI.createWidget({
type: "bi.label",

Loading…
Cancel
Save