Question

我的网络应用为（e）css文件正常工作。

我有2张皮肤：

的正常

plainTxt=#006
plainBg=#FFF
readonlyTxt=#003082
menuTxt=#0000A0

的 blackwhite

plainTxt=#FFF
plainBg=#000
readonlyTxt=#D0D0D0
menuTxt=#000

颜色有效。

但现在我有以下问题：图片对于每个皮肤我想要不同的图像。我怎么做到的？我在任何ecss / skinning教程中都找不到。这不可能吗？

示例css：

#header h1 {
    background-position:0 6px;
    background-image: url("#{resource['image/header_1.png']}");
}

问题：对于普通皮肤，我想获取图片：'image / header_1.png' 对于我想要的黑白皮肤：'image / header_2.png' 我该怎么做呢。任何指针都很棒

我应该在资源servlet（或其他东西）中解决它吗？或者我可能需要在maven插件中修复它？在那部分我更了解; - ）

pom.xml

的一部分

<plugin>
        <groupId>org.richfaces.cdk</groupId>
        <artifactId>maven-richfaces-resources-plugin</artifactId>
        <version>4.3.7.Final</version>
        <executions>
          <execution>
            <id>process-resources</id>
            <goals>
              <goal>process</goal>
            </goals>
            <configuration>
              <staticResourceMappingFile>D:\workspace\MyProject\target\classes/META-INF/richfaces/custom-packedcompressed-resource-mappings.properties</staticResourceMappingFile>
              <resourcesOutputDir>D:\workspace\MyProject\target\classes/META-INF/resources/org.richfaces.staticResource/4.3.7.Final/PackedCompressed/</resourcesOutputDir>
              <staticResourcePrefix>org.richfaces.staticResource/4.3.7.Final/PackedCompressed/</staticResourcePrefix>
              <pack>true</pack>
              <compress>true</compress>
              <excludedFiles>
                <exclude>^javax.faces</exclude>
                <exclude>^\Qorg.richfaces.renderkit.html.images.\E.*</exclude>
                <exclude>^\Qorg.richfaces.renderkit.html.iconimages.\E.*</exclude>
                <exclude>^jquery\.js$</exclude>
              </excludedFiles>
              <webRoot>D:\workspace\MyProject/src/main/webapp</webRoot>
            </configuration>
          </execution>
        </executions>
        <dependencies>
          <dependency>
            <groupId>org.slf4j</groupId>
            <artifactId>slf4j-simple</artifactId>
            <version>1.7.5</version>
            <scope>compile</scope>
          </dependency>
        </dependencies>
        <configuration>
          <skins>
            <skin>normal</skin>
            <skin>blackwhite</skin>
          </skins>
          <excludedFiles>
            <exclude>^\Qorg.richfaces.renderkit.html.images.\E.*</exclude>
            <exclude>^\Qorg.richfaces.renderkit.html.iconimages.\E.*</exclude>
            <exclude>^jquery.js$</exclude>
          </excludedFiles>
          <includedContentTypes>
            <include>application/javascript</include>
            <include>text/css</include>
            <include>image/.+</include>
          </includedContentTypes>
          <fileNameMappings>
            <property>
              <name>^org\.richfaces\.ckeditor/([^/]+\.(png|gif|jpg))$</name>
              <value>org.richfaces.ckeditor.images/$1</value>
            </property>
            <property>
              <name>^org\.richfaces\.ckeditor/([^/]+\.css)$</name>
              <value>org.richfaces.ckeditor.css/$1</value>
            </property>
            <property>
              <name>^org\.richfaces\.ckeditor/([^/]+\.(js))$</name>
              <value>org.richfaces.ckeditor.js/$1</value>
            </property>
            <property>
              <name>^.+/([^/]+\.(png|gif|jpg))$</name>
              <value>org.richfaces.images/$1</value>
            </property>
            <property>
              <name>^.+/([^/]+\.css)$</name>
              <value>org.richfaces.css/$1</value>
            </property>
          </fileNameMappings>
        </configuration>
      </plugin>

Answer 1

解决方案并不复杂，但并不令人满意。

我将资源文件的引用移动到了外观属性文件：

custom.ecss：

...
.btn-accept{
    height:22px;
    width:47px;
    background: '#{richSkin.okBtnImg}';
}
...

default.skin.properties：

....
okBtnImg=url("#{resource['image/button/okBtnImg.png']}") no-repeat 0 0 !important;
...

custom.skin.properties：

....
okBtnImg=url("#{resource['image/customSkin/button/okBtnImg.png']}") no-repeat 0 0 !important;
...

Richfaces自定义皮肤图像

1 个答案: