在extjs4.1中更改xtype文本的颜色。

时间:2022-11-20 22:34:20

I need to change the color of the text below. Everything else in the style field works except for the text color. Can someone tell me what I am doing wrong here?

我需要改变下面文字的颜色。除了文本颜色以外,样式字段中的其他内容都是有效的。有人能告诉我我做错了什么吗?

{
                            xtype: 'text',

                            text: "Logged in as:",
                            textAlign:'left',
                            style : "color:#3E546B;font-style:italic;font-family: tahoma, arial, verdana, sans-serif;font-size: 11px;",
                            width: 140,
                            handler: function() {
                                document.location.href="";
                            }
                        },

EDIT. I am not using a form panel, i am using xtype:text inside a container.

编辑。我没有使用表单面板,我使用的是xtype:一个容器中的文本。

http://jsfiddle.net/nCkZN/4/ (this still uses form panel. But this is to show the text color does not change)

http://jsfiddle.net/nCkZN/4/(此仍使用表单面板)。但这是为了显示文本颜色不变)

2 个解决方案

#1


6  

use fieldStyle instead of style

使用fieldStyle而不是样式。

demo

演示


Update

更新

I confused 'text' and 'textfield'.

我混淆了“文本”和“textfield”。

Now I've got it. The only way to change font style of Ext.draw.Text is to configure it with styleSelector (which has to refer to a valid css rule) like it is done in this demo.

现在我懂了。改变字体样式的唯一方法是绘制。文本是用styleSelector(它必须引用一个有效的css规则)来配置它,就像在这个演示中所做的那样。

#2


1  

Use The Fill in the Style As below use the type as text (Sprite) instead of using the Xtype as text

使用下面的样式填充样式作为文本(Sprite),而不是使用Xtype作为文本。

Ext.create('Ext.draw.Component', {
    renderTo: Ext.getBody(),
    width: 200,
    height: 200,
    items: [{
        type: "text",
        text: "Hello, Sprite!",
        fill: "green",
        font: "18px monospace"
    }]
});

#1


6  

use fieldStyle instead of style

使用fieldStyle而不是样式。

demo

演示


Update

更新

I confused 'text' and 'textfield'.

我混淆了“文本”和“textfield”。

Now I've got it. The only way to change font style of Ext.draw.Text is to configure it with styleSelector (which has to refer to a valid css rule) like it is done in this demo.

现在我懂了。改变字体样式的唯一方法是绘制。文本是用styleSelector(它必须引用一个有效的css规则)来配置它,就像在这个演示中所做的那样。

#2


1  

Use The Fill in the Style As below use the type as text (Sprite) instead of using the Xtype as text

使用下面的样式填充样式作为文本(Sprite),而不是使用Xtype作为文本。

Ext.create('Ext.draw.Component', {
    renderTo: Ext.getBody(),
    width: 200,
    height: 200,
    items: [{
        type: "text",
        text: "Hello, Sprite!",
        fill: "green",
        font: "18px monospace"
    }]
});