Google Web Toolkit - 具有CSS样式的UiBinder

Question

我是GWT的新手。这是我的问题：

Form.css

.text{
color: orange;
font-size: 16pt;}

FormResources.java

public interface FormResources extends ClientBundle{

@Source("Form.css")
MyCSS style();

public interface MyCSS extends CssResource{
    String text();
}}

Form.ui.xml

<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder"
         xmlns:g="urn:import:com.google.gwt.user.client.ui"
         xmlns:res="urn:with:com.org.yournamehere.client.FormResources">

<ui:with field='res' type='org.yournamehere.client.FormResources' />

<g:HTMLPanel>
    <g:Label res:styleName="style.text">ABC</g:Label>
</g:HTMLPanel></ui:UiBinder>

Form.java

public class Form extends Composite {

private static final FormUiBinder uiBinder = GWT.create(FormUiBinder.class);

@UiTemplate("Form.ui.xml")
interface FormUiBinder extends UiBinder<Widget, Form> {}

@UiField(provided = true)
final FormResources res;

public Form() {
    this.res = GWT.create(FormResources.class);
    res.style().ensureInjected();
    initWidget(uiBinder.createAndBindUi(this));
}}

我的问题是可以显示ABC字，但不是橙色，大小是16pt。 Css部分无法显示。请帮我解决这个问题。感谢。

Answer 1

你几乎做得对。

只需替换Form.ui.xml文件中的以下行。

<g:Label res:styleName="style.text">ABC</g:Label>

带

<g:Label res:styleName="{res.style.text}">ABC</g:Label>

截图：

---

问题："style.text"并未指代FormResources#MyCSS#text中定义的样式。

如果您想使用某些动态值，请始终将值括在{...}中。

有关详细信息，请查看GWT UiBinder - Hello Stylish World

上的示例