如何自定义用ThemeBuilder生成的主题的CSS？

8xiog9wr 于 2022-09-26 发布在其他

关注(0)|答案(1)|浏览(215)

我已经使用ThemeBuilder创建了一个主题，但现在我需要在CSS类中添加一个属性，以便在ListView的选定元素中使用不同的字体颜色。
理想情况下，我希望构建器支持在.theme文件中指定这样的配置，特别是因为字体颜色不会影响用于支持较旧浏览器的图像生成过程。事实上，构建器应该支持所有不影响生成图像的标准CSS3属性。
显然，可以修改ThemeBuilder jar来实现这一点，但这不是一个好主意。
我查看了生成的外观类，第一次尝试使用以下构造函数：

public Css3ContentPanelAppearance(Css3ContentPanelResources resources) {
    this(resources, GWT.<Css3ContentPanelTemplate> create(Css3ContentPanelTemplate.class));
}

这并不奏效，因为无论使用了哪种Css3ContentPanelResources，所有使用Css3CentPanelAppearance的组件都会受到影响。我相信这是因为CSS类名基于外观类名和CssResource类名。

extjs

来源：https://stackoverflow.com/questions/25573085/how-to-customize-the-css-of-a-theme-generated-with-the-themebuilder

1条答案

按热度按时间

cfh9epnr1#

解决方案非常简单：创建生成的外观类的子类，如下所示：

public class CustomCss3ListViewAppearance extends Css3ListViewAppearance {
    public interface CustomCss3ListViewResources extends Css3ListViewAppearance.Css3ListViewResources {
        // Load the original resources first and then the custom one, so the customizations will take precedence.
        @ClientBundle.Source({"com/example/client/base/listview/Css3ListView.css","CustomCss3ListView.css"})
        @Override
        Css3ListViewAppearance.Css3ListViewStyle css();
    }
    public CustomCss3ListViewAppearance() {
        super(GWT.<Css3ListViewAppearance.Css3ListViewResources>create(CustomCss3ListViewResources.class));
    }
}

然后，您可以根据生成的主题创建单独的JAR模块，在.gwt中指定一些绑定。xml文件，它的行为与普通生成的主题完全相同（只需添加依赖项并将其导入application.gwt.xml文件）：

<?xml version="1.0" encoding="UTF-8"?>
<module rename-to='myCustomTheme'>
    <inherits name="com.example.Theme"/>

    <replace-with class="com.example.client.base.listview.CustomCss3ListViewAppearance">
        <when-type-is class="com.sencha.gxt.widget.core.client.ListView.ListViewAppearance" />
        <when-property-is name="gxt.theme" value="myTheme" />
    </replace-with>

    <source path="myCustomTheme/client"/>

</module>

赞(0）回复(0）举报 2022-09-26

我来回答

如何自定义用ThemeBuilder生成的主题的CSS？

1条答案

相关问题

热门标签

最新问答