css - 如何在 Gxt 3.0 中更改 TextButton 样式

Question

我想更改文本按钮的样式，就像我想添加背景图片一样，我想使用 GXT 3.0 更改背景颜色

有人帮我plzzz

提前致谢

Answer 1

GXT 3 有一种更简洁的方式来处理这些要求。您必须使用 Sencha 3 中提供的 Appearance API。这是此过程中涉及的关键点。

• 外观接口、实现和替换
• 使用 CssResource 进行样式设置
• 使用 ClientBundle 获取 css 资源
• XTemplates 将样式/属性应用于标记

在这种情况下，您需要做的是实现 TextButtonCell 的外观（因为 TextButton 使用 TextButtonCell 作为外观）并使用 css 样式资源提供所需的样式（将实际的 .css 文件路径注释为源）。例如

     public interface TextButtonResources extends ClientBundle 
     { 
            @Source("TextButton.css")
            Style style();
     } 

然后将内置的 TextButtonCell 外观替换为您的外观。

<replace-with class="fullyQualifiedNameToYourButtonCellAppearanceClass">
        <when-type-is class="com.sencha.gxt.cell.core.client.ButtonCell.ButtonCellAppearance" />
    </replace-with>

这篇博文详细介绍了这个概念 Ext GWT 3.0 外观设计

Answer 2

首先，您在客户端 java 代码中设置此样式：

aButton.addStyleName("my_button_style");

或者，您可以使用 setStyleName() 方法，甚至可以使用 setStyleAttribute() 更改特定的样式属性。

在客户端 java 代码中完成此操作后，您可以在为页面加载的 css 文件中定义样式。

您还可以在组件渲染后更改样式。它应该正确刷新按钮的外观。