如何通过Vaadin导入外部主题并将其与注释一起使用？

Question

Let's say I have two projects. CompanyApp and CompanyVaadinThemes .

CompanyApp is a normal Vaadin 7.7.3 app. CompanyVaadinThemesis just a Vaadin 7.7.3 theme compiled into a jar.

CompanyVaadinThemes.jar

source/main/resources/VAADIN/themes/mytheme
    mytheme.scss
    styles.scss
    ...

CompanyApp.war

pom.xml
    ...
    <dependency>
        <groupId>com.vaadin</groupId>
        <artifactId>vaadin-themes</artifactId>
        <version>${vaadin.version}</version>
    </dependency>
    <dependency>
        <groupId>com.company</groupId>
        <artifactId>company-vaadin-themes</artifactId>
        <version>1.0-SNAPSHOT</version>
    </dependency>


...

UI.java

    @SpringUI
    @Theme("mytheme")
    public class CompanyUI extends UI {

However, I can't seem to figure out how to make this work. If I copy the actual code from the CompanyVaadinThemes.jar into the main CompanyApp, all is fine. I can use "mytheme", "valo", etc.

But I want to keep the actual theme in a separate project so that future projects can just simply add it as a dependency.

Here is the pom to CompanyVaadinThemes:

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>

    <groupId>com.company</groupId>
    <artifactId>company-vaadin-themes</artifactId>
    <version>1.0-SNAPSHOT</version>
    <packaging>jar</packaging>

    <properties>
        <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
        <java.version>1.8</java.version>
        <vaadin.version>7.7.3</vaadin.version>
        <vaadin.theme>mytheme</vaadin.theme>
        <vaadin.plugin.version>${vaadin.version}</vaadin.plugin.version>
    </properties>

    <repositories>
        <repository>
            <id>vaadin-addons</id>
            <url>http://maven.vaadin.com/vaadin-addons</url>
        </repository>
        <repository>
            <id>com-vaadin-prereleases</id>
            <url>https://maven.vaadin.com/vaadin-prereleases</url>
        </repository>
    </repositories>

    <dependencies>
        <dependency>
            <groupId>com.vaadin</groupId>
            <artifactId>vaadin-server</artifactId>
            <version>${vaadin.version}</version>
            <scope>provided</scope>
        </dependency>
        <dependency>
            <groupId>com.vaadin</groupId>
            <artifactId>vaadin-themes</artifactId>
            <version>${vaadin.version}</version>
        </dependency>
        <dependency>
            <groupId>javax.servlet</groupId>
            <artifactId>javax.servlet-api</artifactId>
            <version>3.0.1</version>
            <scope>provided</scope>
        </dependency>
    </dependencies>

    <build>
        <plugins>
            <plugin>
                <groupId>org.apache.maven.plugins</groupId>
                <artifactId>maven-compiler-plugin</artifactId>
                <version>3.2</version>
                <configuration>
                    <source>${java.version}</source>
                    <target>${java.version}</target>
                </configuration>
            </plugin>
            <plugin>
                <groupId>com.vaadin</groupId>
                <artifactId>vaadin-maven-plugin</artifactId>
                <version>${vaadin.version}</version>
            </plugin>

        </plugins>
    </build>
</project>

Answer 1

VAADIN folder in your theme should be in the root of your jar file:

VAADIN/themes/mytheme
    mytheme.scss
    styles.scss

Answer 2

Custom themes are placed in the VAADIN/themes folder of the web application, in an Eclipse project under the WebContent folder or src/main/webapp in Maven projects. This location is fixed. You need to have a theme folder for each theme you use in your application, although applications rarely need more than a single theme. After you place them in folder it's easy to call them with @Theme("your_theme_goes_here") annotation. Also make sure you are recompiling, simply Clean and Build to make changes work efficiently.