UIBinder: Overriding obfuscated CSS styleNames

[Brad Leupen]

Hello!

I've got a couple of uibinder-built widgets that use inline css. The
first is a custom toggle button that looks something like this:

class ToggleButton {
interface Style extends CssResource
{
public String down();
}

@UiField
Style style;

@UiField
ButtonElement buttonElt;
...

public void setDown(boolean down)
{
if (down)
addStyleName(style.down());
else
removeStyleName(style.down());
}
}

This class works great. However, trouble arises when i wish to use it
from within another uibound widget and override the down style. So far
i have this in my ui xml:

<ui:style>
.button {
background: #fff;
}

.button .down {
background: #fff;
}
</ui:style>

<g:HTMLPanel>
...
<e:CustomPushButton addStyleName="{style.button}">My White
Button</e:CustomPushButton>
</g:HTMLPanel>


Is it possible to override the .down secondary style?

Thanks!

[Joseph Lust]

On reading your problem, I became curious how this is achieved.

According to the following article, you can do this using the interfaces.

http://stackoverflow.com/questions/5943895/how-exactly-would-one-override-a-cssresource 

So, you'll need to use the interfaces in your UiBinder.

Something like:

# put this in your new widget's java class

interface CustomStlye extends ToggleButton.Style

{ 

@Override

public String down(); 

}

# put this in the UiBinder of your new widget

<ui:style type="com.mypackage.CustomStyle" > 

    .button .down { 

       background: #fff; 

    } 

</ui:style>

Let me know if this works for you. I don't have the time to make a module to test this on?

Sincerely,

Joseph

[Brad Leupen]

Ah, interesting idea! Thanks for the response. I'll try that this evening and report back.