Search code examples
gwtsmartgwt

how to change GWT/SmartGWT theme at run time


I want to change the theme of my SmartGWT application at run time from the code

I can see this functionally in SmartGWT showcase , but I can't see any code for this in SmartGWT showcase.

What I am doing right now is

This is my XML class

<?xml version="1.0" encoding="UTF-8"?>
         <inherits name="com.smartgwt.SmartGwtNoTheme"/>
         <inherits name="com.smartclient.theme.graphite.Graphite"/>
         <inherits name="com.smartclient.theme.blackops.BlackOps"/>
         <inherits name="com.smartclient.theme.enterprise.Enterprise"/>
         <inherits name="com.smartclient.theme.enterpriseblue.EnterpriseBlue"/>

This is my HTML class snippet

             <title>My Web</title>


              <script>
          function readCookie(name) {
        var nameEQ = name + "=";
    var ca = document.cookie.split(';');
    for ( var i = 0; i < ca.length; i++) {
        var c = ca[i];
        while (c.charAt(0) == ' ')
            c = c.substring(1, c.length);
        if (c.indexOf(nameEQ) == 0)
            return c.substring(nameEQ.length, c.length);
    }
    return null;
}

// Determine what skin file to load
var currentSkin = readCookie('skin');
if (currentSkin == null){
    currentSkin = "Enterprise";
}
alert(currentSkin);
        </script>
           <script type="text/javascript">
        document.write("<" + "script src=testtheme/sc/skins/"
        + currentSkin + "/load_skin.js><"+"/script>");
           </script>     

This is my Java class

       SelectItem selectItem = new SelectItem("skin", "Choose Skin");
    DynamicForm df = new DynamicForm();
    hpnlMain.add(df);
    df.setItems(selectItem);
    selectItem.setWidth(130);
    java.util.LinkedHashMap<String, String> valueMap = new java.util.LinkedHashMap<String, String>();
    valueMap.put("Enterprise", "Enterprise");
    valueMap.put("EnterpriseBlue", "EnterpriseBlue");
    valueMap.put("TreeFrog", "TreeFrog");
    valueMap.put("BlackOps", "BlackOps");
    valueMap.put("Graphite", "Graphite");


    selectItem.setValueMap(valueMap);

    String currentSkin = Cookies.getCookie("skin");

    if (currentSkin == null) {
        currentSkin = "Enterprise";
    }
    selectItem.setDefaultValue(currentSkin);
    selectItem.addChangedHandler(new ChangedHandler() {

        @Override
        public void onChanged(ChangedEvent event) {
            // TODO Auto-generated method stub
            Cookies.setCookie("skin", event.getValue().toString());
            Window.Location.reload();
        }
    });

The expected outcome is that when I select any skin form my SelectItem, that skin should be applied, but I am having no Effect .

Please look into this line in my HTML file

         <script type="text/javascript">
document.write("<" + "script src=testtheme/sc/skins/"
        + currentSkin + "/load_skin.js><"+"/script>");

Here I'm not sure what will be the exact path , I have the smatgwt-skins.jar in my class path

Thanks


Solution

  • What does the 'alert(currentSkin)' line in your html file display when you change the skin and the application gets reloaded? Does it show the newly selected skin name?

    It looks like you are using code from the SmartGWT showcase, or it just happens to appear almost identical to it.

    http://code.google.com/p/smartgwt/source/browse/trunk/samples/showcase/src/com/smartgwt/sample/showcase/client/Showcase.java