添加工具提示以绘制容器精灵

我已经创建了一个DrawContainer，并且我想添加一个带有工具提示的精灵，最好带有动态内容。不幸的是，工具提示根本没有出现。如何纠正下面的代码？在此先感谢。添加工具提示以绘制容器精灵

var r = this.getSurface().add({ 
    type: "rect", strokeStyle: "#9090f0", x: 10, y: 10, width: 40, height: 40 
}); 
var tip = Ext.create('Ext.tip.ToolTip', { 
    html: "Tooltip" 
}); 
r.on("mouseover", function() { 
    tip.show(); 
});

来源

2016-09-15 Greg

请检查（使用的console.log）事件是否被调用。 – Alexander

我检查过，它没有被调用。 – Greg

[同时，我检查了文档]（http://docs.sencha.com/extjs/6.0.1/classic/Ext.draw.sprite.Rect.html）。你从哪里找到一个rect sprite会触发一个mouseover事件？ – Alexander

你可以尝试使用平局容器上spriteevents插件，像这样

var tip = Ext.create('Ext.tip.ToolTip', { 
    html: "Tooltip" 
}); 

var s = Ext.create({ 
    xtype:  'draw', 
    renderTo: document.body, 
    width:  400, 
    height: 400, 
    plugins: ['spriteevents'], 
    sprites: [ 
     { 
      type:  "rect", 
      strokeStyle: "#9090f0", 
      x:   10, 
      y:   10, 
      width:  100, 
      height:  100 
     } 
    ], 
    listeners: { 
     spritemouseover: function (item, event) { 
      tip.show(); 
     }, 
     spritemouseout: function (item, event) { 
      tip.hide() 
     } 
    } 
});

来源

2016-10-22 14:36:27

添加工具提示以绘制容器精灵

回答

相关问题