gpt4 book ai didi

SAPUI5 使用 Popover 作为工具提示

转载 作者:行者123 更新时间:2023-12-02 15:08:47 25 4
gpt4 key购买 nike

我正在尝试使用 sap.m.Popover作为某些控件的“丰富工具提示”。这是根据 SAP 的建议,因为 sap.ui.commons 库现已弃用。我们想要添加到标准字符串工具提示中的文本太多。我还没有找到直接将弹出窗口用作工具提示的方法,这就是我扩展 TooltipBase 的原因控件来处理弹出框。

我的弹出窗口工作正常,但是当我与我的控件交互时,出现以下错误:

Uncaught Error: failed to load 'myNewToolTip/controls/TooltipBaseRenderer.js' from ../controls/TooltipBaseRenderer.js: 404 - Not Found

我从这些看到threads这是因为 TooltipBase 类是一个抽象类,因此没有渲染器。但是,因为我已经在使用弹出窗口,所以我不需要渲染任何东西。我试图添加 TooltipBaseRenderer.js 并且只有一个空的渲染类。但 UI5 也不喜欢那样。

我的问题是我应该怎么做,我看到两个选项:

  • 可能有一种简单的方法可以将弹出框用作工具提示,我太笨了,想不出来(记住,我更愿意直接在 XML View 中绑定(bind)它)。
  • 找出一种方法来抑制渲染器调用,因为我不需要它。

这是我当前的自定义控件源代码:

sap.ui.define([
"sap/m/Popover"
], function (Popover) {
"use strict";

return sap.ui.core.TooltipBase.extend("myNewToolTip.TooltipBase", {
metadata: {
properties: {
title : {}
},
events: {
"onmouseover" : {},
"onmouseout" : {}
}
},

oView: null,
setView: function(view) {
this.oView = view;
},

onmouseover : function(oEvent) {
var that = this;
if (!this.delayedCall){
this.delayedCall = setTimeout(function() {
if (!that.oPopover){
that._createQuickView();
}
}, 500);
}
},

onmouseout: function(oEvent) {
if (this.oPopover){
this.closePopover();
this.delayedCall = undefined;
}
else{
clearTimeout(this.delayedCall);
this.delayedCall = undefined;
}
},

_createQuickView: function() {
var sTitle = this.getTitle();
this.oPopover = new Popover({
title: sTitle
});
this.oPopover.openBy(this.getParent());
},

closePopover: function(){
this.oPopover.close();
this.oPopover = undefined;
}
});
});

最佳答案

无需创建自定义控件来在鼠标悬停时显示弹出窗口。正如你所说,有一个更简单的方法:Adding event delegates .

events that delegates can listen to 之一是 onmouseover 可以这样实现:

this.byId("myTargetControl").addEventDelegate({
onmouseover: function () {
// Open popover here
}
});

演示: https://embed.plnkr.co/jAFIHK

sap.m.Popover on mouseover


扩展sap.ui.core.TooltipBase

如果您仍然考虑扩展 TooltipBase(没有 Popover),请看一下这个示例: https://embed.plnkr.co/33zFqa?show=control/MyCustomTooltip.js,preview

enter image description here


但请记住,工具提示通常不应包含关键信息,因为它缺乏可发现性,如 Fiori Design Guideline mentions

Tooltips (...) should never contain critical information. They should also not contain redundant information.

就像一个友好的提醒:)不要让人们徘徊寻找东西。

关于SAPUI5 使用 Popover 作为工具提示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45475348/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com