如何在标签面板中增加工具提示的宽度?

时间:2013-04-30 10:56:32

标签: extjs tooltip tabpanel

工具提示宽度不足以在其中显示文字。那我怎么能增加工具提示的宽度呢?这是我的代码:

Ext.onReady(function() {
    Ext.tip.QuickTipManager.init();

    Ext.create('Ext.tab.Panel', {
        width : 500,
        height : 200,
        style : 'margin: 50px',
        renderTo : Ext.getBody(),
        items : [{
            title : 'Tab One'
        }, {
            title : 'Tab Two',
            tabConfig : {
                tooltip : {
                    text : 'Hello tab one... This is James cook. How r u doing.:)',
                    title : 'Tooltip Header'
                }
            }
        }, {
            title : 'Tab Three'
        }]
    });
});

我用过:

div.x-tip {
    width: 300px !important; height: 100px !important;
}

宽度增加但工具提示文本未调整为宽度。我想将工具提示文本设为一行。对此有任何想法.. ??

enter image description here

提前致谢。

2 个答案:

答案 0 :(得分:2)

您也可以在tip对象中设置width属性。

        tooltip : {
            text : 'Hello tab one... This is James cook. How r u doing.:)',
            title : 'Tooltip Header',
            width: 100

        }

答案 1 :(得分:0)

你可以超载:

div.x-tip {
    width: 300px !important;
}

我刚才在ExtJS 4.2中使用tooltip属性的按钮确认了这一点

我发现这个的方式非常简单。我只是在ext / css目录中运行一个grep来查找所有css文件中的“tip”以发现DOM元素是什么(或者你可以在显示至少一个工具提示之后在浏览器中自己检查DOM。一旦你有了也就是说,您可以根据需要定位层次结构中的任何子组件;以确保您的文本不被破坏。

我确实想知道为什么自动分级器不能用于这个渲染器,但这可能是一个问题,更好地询问Sencha支持。