Geek Answers Handbook

What is the preferred way to associate css styles with GWT widgets (using UiBinder)?

The GWT page ( http://code.google.com/webtoolkit/doc/latest/DevGuideUiCss.html#cssfiles ) mentions 2 ways (for a modern application):

  • Using the CssResource contained in the ClientBundle.
  • Using an inline element in a UiBinder template.

Modern GWT applications typically use a combination of CssResource and UiBinder.

So my question is: when should I use the css file and create a CssResource for it, and when should I define styles directly in the ui.xml file using <ui: style>? Are there any performance implications (i.e., the size of resources to download on the client)?

+5
source share
2 answers

It does not affect performance - if you specify CSS in the UiBinder file, the GWT compiler will dynamically create a CssResource based on the rules built into your .ui.xml file and use them.

So, it really comes down to whether you want to share this style elsewhere in your application. If you want the button in Something.ui.xml to have the same style as the other button in SomethingElse.ui.xml, you must specify this style in CssResource. Otherwise, specify the style in the UiBinder file, and no other classes will have access to it.

+9
source

Using UiBinder, the main use of CssResource is to dynamically change the style. If you are not going to change styles dynamically, do not waste time on CssResource.

CSS. UiBinder, 1 - . - .ui.xml , CSS .

CSS UiBinder, , . :

<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder"
    xmlns:g="urn:import:com.google.gwt.user.client.ui">

    <ui:style src="../css/StyleSheet.css" />
    ...
    ...
            <g:LayoutPanel ui:field="layoutName" styleName="{style.aCssRule}" >
    ...

, , CssResource ( ClientBundle) CSS, .

+2

More articles:


All Articles