ExtJS工具欄按鈕工具提示似乎沒有響應設置

我有一個位於頁面底部的面板。在它的底部工具欄中，有一個我需要附加工具提示的按鈕。由於此按鈕位於頁面的底部，並且下方沒有空格，因此無論何時顯示工具提示，該按鈕都會繪製在按鈕的頂部 - 部分阻止它。ExtJS工具欄按鈕工具提示似乎沒有響應設置

爲了避免這種行爲，我一直在試着讓工具提示出現在按鈕上方。起初這看起來很簡單，因爲文檔說這可以簡單地通過將工具提示anchor屬性設置爲'top'來完成。

但是，當我將鼠標放在按鈕上時，工具提示的當前錨定設置似乎沒有被考慮在內 - 工具提示只是回退到其默認行爲並繼續顯示在光標的右側：

When hovering

上午我做錯了什麼嗎？

這裏是我的代碼剪斷：

Ext.define('Dashboard.view.companies.ListPanel', { 
    extend: 'Ext.grid.Panel', 

    // [snipped code] 

    bbar: [{ 
     xtype: 'tbtext', 
     text: 'Filtre actuel:' 
    },{ 
     xtype: 'button', 
     id: 'filter', 
     text: 'Sociétés traitées', 
     tooltip: { 
     text: 'Enlever ce filtre', 
     anchor: 'top' 
     } 
    }], 

    // [snipped code] 

});

我不認爲constrainPosition有什麼這個問題，因爲我試着將它設置爲false，並沒有改變的東西。

將錨點設置爲top，left和right似乎沒有任何影響。

我查看了文檔中的QuickTips examples，它似乎在那裏工作得很好。我看到的唯一區別是在示例中他們明確地設置了target屬性，而在我的情況下它在創建時自動設置爲Ext.button.Button#setTooltip()。

最後，我也嘗試設置mouseTrack到true沒有任何效果，這似乎指出可怕的事情正在發生。

來源

2012-03-02 Pablo Borowicz

以下是我的工作是圍繞Geronimo的答案後：

// works 
listeners: { 
    afterrender: function() { 
    Ext.create('Ext.tip.ToolTip',{ 
     target: 'filter', 
     html: 'Enlever ce filtre', 
     anchor: 'top' 
    }); 
    } 
}

注意，這樣我使用Ext.tip.Tooltip代替Ext.tip.QuickTip。我之前沒有注意到這一點，但QuickTips示例實際上使用工具提示而不是QuickTips！這似乎有以防止從工作的權利錨固QuickTips一個錯誤，因爲我想這相同的結果之前：

// doesn't work as expected 
listeners: { 
    afterrender: function() { 
    Ext.tip.QuickTipManager.register({ 
     target: 'filter', 
     text: 'Enlever ce filtre', 
     anchor: 'top' 
    }); 
    } 
}

來源

2012-03-05 15:11:35

我遇到了同樣的問題，我不知道爲什麼它是這樣設置的，或者根本原因是什麼，但是我發現由於某種原因，使用Ext.button.Button工具提示配置不能正確應用這些選項。當我做到這一點時just like the example shows：通過定義工具提示配置在一個單獨的對象與目標配置，然後使用Ext.create('Ext.tip.ToolTip', config)它工作得很好。我想這與按鈕沒有被立即渲染有關。

來源

2012-03-02 17:00:42 Geronimo

謝謝你，幫我規避的問題！ – 2012-03-05 15:12:13

ExtJS工具欄按鈕工具提示似乎沒有響應設置

回答

相關問題