Google Web Toolkit - 帶CSS樣式的UiBinder

我是GWT中的新成員。這裏是我的問題：Google Web Toolkit - 帶CSS樣式的UiBinder

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部分無法顯示。請幫我解決這個問題。謝謝。

來源

2014-04-26 user3007865

應該不是你的資產的文件名可以寫成小寫？像form.css，而不是Form.css。但這並不能解決問題。 – Matheus

謝謝你，馬修斯。 – user3007865

你幾乎做得對。

只需替換Form.ui.xml文件中的下一行即可。

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

與

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

截圖：

enter image description here

問題："style.text"是不是指在FormResources#MyCSS#text定義你的風格。

如果要使用某些動態值，請始終將值包含在{...}中。

欲瞭解更多信息看看樣品上GWT UiBinder - Hello Stylish World

來源

2014-04-26 08:28:03 Braj

Braj，非常感謝你。我從你身上學到了很多東西。 – user3007865

這是我的榮幸。 – Braj

Google Web Toolkit - 帶CSS樣式的UiBinder

回答

相關問題