gwt using CssResource throw exception "no source code is available did you forget inherit a required module

Question

I build gwt application and I want add css to my application I know I can add style like this

setStyleName("style")

but is bad option I want to use the better way I want to use CssResource class so I found this guide http://hcklab.blogspot.co.il/2011/02/classes-uibinder-and-css-gwt.html

and I write this class

public interface ResourceBundle extends ClientBundle
{
public static final Resources INSTANCE =  GWT.create(ResourceBundle.class);

    public interface Resources extends ClientBundle { 
       @Source("style.css")
       CommonsCss commonsCss();
    }
    public interface CommonsCss extends CssResource {
        String toolBarButton();
    }
}

I have style.css file with my css and in my code i write

ResourceBundle.INSTANCE.commonsCss().ensureInjected();
setStyleName(ResourceBundle.INSTANCE.commonsCss().toolBarButton());

but I get this error No source code is available for type java.util.ResourceBundle; did you forget to inherit a required module? what I need to do to solve it? thank you

Braj Braj · Accepted Answer · 2014-03-28T20:16:32

Thee might be some unused import in your project.

java.util.ResourceBundle

find it in the project and remove it from client side code.

-- EDIT --

Sample code: (All files are placed in same package)

import com.google.gwt.resources.client.ClientBundle;
import com.google.gwt.resources.client.CssResource;

public interface LoginResources extends ClientBundle {
    public interface MyCss extends CssResource {
        String blackText();

        String redText();

        String loginButton();

        String box();

        String background();

    }

    @Source("Login.css")
    MyCss style();
}

import com.google.gwt.core.client.GWT;
import com.google.gwt.dom.client.Style.VerticalAlign;
import com.google.gwt.uibinder.client.UiBinder;
import com.google.gwt.uibinder.client.UiField;
import com.google.gwt.uibinder.client.UiTemplate;
import com.google.gwt.user.client.ui.Composite;
import com.google.gwt.user.client.ui.Label;
import com.google.gwt.user.client.ui.TextBox;
import com.google.gwt.user.client.ui.Widget;

public class Login extends Composite {

    private static LoginUiBinder uiBinder = GWT.create(LoginUiBinder.class);

    /*
     * @UiTemplate is not mandatory but allows multiple XML templates to be used for the same
     * widget. Default file loaded will be <class-name>.ui.xml
     */
    @UiTemplate("Login.ui.xml")
    interface LoginUiBinder extends UiBinder<Widget, Login> {
    }

    @UiField(provided = true)
    final LoginResources res;

    public Login() {
        this.res = GWT.create(LoginResources.class);
        res.style().ensureInjected();
        initWidget(uiBinder.createAndBindUi(this));

        completionLabel1.getElement().getStyle().setVerticalAlign(VerticalAlign.BOTTOM);
    }

    @UiField
    TextBox loginBox;

    @UiField
    TextBox passwordBox;

    @UiField
    Label completionLabel1;

    @UiField
    Label completionLabel2;

}

Login.css

.blackText {
   font-family: Arial, Sans-serif;
   color: #000000;
   font-size: 11px;
   text-align: right;
}

.redText {
   font-family: Arial, Sans-serif;
   color: #ff0000;
   font-size: 11px;
   text-align: left;
}

.loginButton {
   border: 1px solid #3399DD;
   color: #FFFFFF;
   background: #555555;
   font-size: 11px;
   font-weight: bold;
   margin: 0 5px 0 0;
   padding: 4px 10px 5px;
   text-shadow: 0 -1px 0 #3399DD;
}

.box {
   border: 1px solid #AACCEE;
   display: block;
   font-size: 12px;
   margin: 0 0 5px;
   padding: 3px;
   width: 203px;
}

.background {
   background-color: #999999;
   border: 1px none transparent;
   color: #000000;
   font-size: 11px;
   margin-left: -8px;
   margin-top: 5px;
   padding: 6px;
}

Login.ui.xml

<ui:UiBinder xmlns:ui='urn:ui:com.google.gwt.uibinder'
    xmlns:gwt='urn:import:com.google.gwt.user.client.ui' xmlns:res='urn:with:com.gwt.test.client.LoginResources'
    xmlns:p='urn:import:com.gwt.test.client'>
    <ui:with type="com.gwt.test.client.LoginResources" field="res">
    </ui:with>
    <gwt:HTMLPanel>
        <div align="center">
            <gwt:VerticalPanel res:styleName="{res.style.background}">
                <gwt:Label text="Login" res:styleName="{res.style.blackText}" />
                <gwt:TextBox ui:field="loginBox" res:styleName="{res.style.box}" />
                <gwt:Label text="Password" res:styleName="{res.style.blackText}" />
                <gwt:PasswordTextBox ui:field="passwordBox"
                    res:styleName="{res.style.box}" />
                <gwt:HorizontalPanel verticalAlignment="middle">
                    <gwt:Button ui:field="buttonSubmit" text="Submit"
                        res:styleName="{res.style.loginButton}" />
                    <gwt:CheckBox ui:field="myCheckBox" />
                    <gwt:Label ui:field="myLabel" text="Remember me"
                        res:styleName="{res.style.blackText}" />
                </gwt:HorizontalPanel>
                <gwt:Label ui:field="completionLabel1" res:styleName="{res.style.blackText}" />
                <gwt:Label ui:field="completionLabel2" res:styleName="{res.style.blackText}" />                 
            </gwt:VerticalPanel>
        </div>
    </gwt:HTMLPanel>
</ui:UiBinder>

Snapshot

enter image description here

gwt using CssResource throw exception "no source code is available did you forget inherit a required module

2 Answers