Necesita constantes de CSS en toda la aplicación en GWT

Question

Me gustaría definir algunos colores como constantes en un GWT CssResource, y usar esas constantes en toda mi aplicación; pero no sé cómo hacer eso.

Te diré lo que he intentado. He creado un ClientBundle y una CssResource de la siguiente manera:

public interface Resources extends ClientBundle { 
    public interface MyStyle extends CssResource { 
    String JUNGLEGREEN(); 
    String example(); 
    ... 
    } 
    @Source("Resources.css") 
    MyStyle css(); 
} 

he definido algunos constants en Resources.css:

@def JUNGLEGREEN #1F3D0A; 

Dentro Resources.css, utilizo esas constantes de este modo:

.example { color:JUNGLEGREEN; } 

No conozco una forma de reutilizar esas constantes en otros archivos CSS y plantillas de UiBinder. Me gustaría hacer esto en algún otro archivo UiBinder, digo LoginView.ui.xml:

<ui:with field='resources' type='com.example.Resources' /> 
<ui:style> 
    .mainPanel { 
    background:{resources.css.JUNGLEGREEN}; 
    ... 
    } 
</ui:style> 

... pero no parece que compilar. ¿Sabes cómo puedo lograr mi objetivo?

Answer 1

Usted debe ser capaz de utilizar

<ui:style> 
    @IMPORT url("../../../global.css"); 
    .mainPanel { 
    background:{resources.css.JUNGLEGREEN}; 
    ... 
    } 
</ui:style> 

Answer 2

Esto es cómo lo hacemos:

• colocamos todos nuestros atributos constantes en un archivo constant.css

@def black #241b15; /* text color */ 
@def orange #ff4f00; /* links */

• en cada archivo ui.xml y ou puede hacer referencia a esas constantes de la siguiente manera:

<ui:style src="../../resources/css/constants.css"> 
    .myStyle { 
     color: orange; 
    } 
</ui:style>

Espero que ayude.

EDIT:

Para evitar la ruta relativa en el elemento <ui:style> que podría hacer lo siguiente:

• definir sus constantes de nuevo en un archivo CSS (por ejemplo constants.css)

@def junglegreen #1f3d0a;

• crear un ClientBundle y CssResource para recuperar las constantes definidas

public interface MyResources extends ClientBundle { 

    public static final MyResources INSTANCE = GWT.create(MyResources.class); 

    public interface Constants extends CssResource { 

     String junglegreen(); 
    } 

    Constants constants(); 
}

-uso del @eval anotación para acceder a la constante

<ui:style> 
    @eval green com.gwt.client.widget.test.MyResources.INSTANCE.constants().junglegreen(); 

    .someClass { 
     color: green; 
    } 
</ui:style>

La única forma que conozco de cómo hacer frente a las constantes y sin hacer referencia al archivo CSS en sí.

Answer 3

Sé que esta respuesta podría ser un poco tarde pero puede ayudar a alguien.Yo estaba teniendo el mismo problema y era capaz de resolverlo mediante la adición de lo siguiente:.

Resources.css() ensureInjected()

he añadido en mi fábrica, pero lo probé en un par de lugares y sin importa dónde lo puse, funcionó.