GWT CssResource中的基本算法

Question

我正在寻找一种方法来做这样的事情:

// style.css
@def borderSize '2px';

.style {
  width: borderSize + 2;
  height: borderSize + 2;
}

其中width和height属性最终的值为4px.

Answer 1

有时我会使用以下内容:

@eval BORDER_SIZE_PLUS_2 2+2+"px"; /* GWT evaluates this at compile time! */

奇怪的是,只有在+运算符和操作数之间没有任何空格时,这才有效.此外,在@eval中,您不能使用之前由@def定义的常量.但是,您可以在一个Java类中使用定义为静态字段的常量:

@eval BORDER_SIZE_PLUS_2 com.example.MyCssConstants.BORDER_SIZE+2+"px";

或者您可以让Java完全执行计算:

@eval WIDTH com.example.MyCssCalculations.width(); /* static function, 
                                                      no parameters! */
@eval HEIGHT com.example.MyCssCalculations.height();
.style {
    width: WIDTH;
    height: HEIGHT;
}

但我真正想做的是与你的建议非常相似:

@def BORDER_SIZE 2;
.style {
    width: value(BORDER_SIZE + 2, 'px'); /* not possible */
    height: value(BORDER_SIZE + 3, 'px');
}

我不认为这在GWT 2.0中是可能的.也许您找到了更好的解决方案 - 这是关于此主题的开发指南页面.