Customizing TabSet via Skin and Component Extension

[mduduzik]

SmartGWT Version: 2.4


We would like to customize the TabSet such that it looks different depending on its level within the app UI. E.g., one TabSet look for the main application navigation and another for when editing an entity and so forth.

We have played with load_skin.js and the other custom skin artifacts but we cannot seem to figure out where the code is that loads/manipulates _Start,_Stretch,_End PNG's. We figure the customization should be accomplished as follows (theoretically):

1. Create subclass of a TabSet using isc....defineClass('EntityEditorTabSet','TabSet');

2. Modify load_skin to do magic on 'EntityEditorTabSet' (somehow)

3. Create CSS entries for 'EntityEditorTabSet' within a custom skin.

Is there a better way to accomplish this?


Any help will be appreciated.

[Isomorphic]

That's the correct approach, if you concrete questions on the process that aren't answered by the Skinning Guide, let us know.

[mduduzik]

Thanks,
Specifically we are not sure where the code/CSS is to "do magic on 'EntityEditorTabSet'" as referenced above. We guessed that preLoadSkin() method within TabSet java class might be a candidate - no luck yet.

Any pointers will be appreciated.

Rgds.

[Isomorphic]

To define your custom TabSet class, just make changes to load_skin.js in your custom skin, or execute the equivalent JavaScript before any components are created (such as in a JSNI method called from onModuleLoad).

To use the custom class, use setScClassName() in your TabSet subclass' constructor.

[mduduzik]

Therein is the problem: what change should we make in load_skin.js to accomplish the following:

1. Set a different image dir/path for 'CustomTabSet' to load _Start,_Stretch,and _End images.

2. Then load these images to construct tabs.

It's almost like we need to create different image paths for each TabSet subclass - we just don't know where this is done in the code.


I hope this makes sense and thanks for your patience.

Rgds.

[Isomorphic]

Seems like you haven't read the Skinning Guide, or perhaps haven't read all the materials it links to (AutoChild overview, StretchImg explanation etc). Start there.

[mduduzik]

You got me - I didn't catch the subtleties. Thanks again. This is a great start.