How can I change icon size on a tab ?

[Eric Taix]

I can change easily the size of an icon in a TreeGrid. How can I have the same behaviour for a TabSet (or Tab) ?

I saw that i can change the close icon size, but i was unable to find a property to change the size of a tab?

Thanks for your anwser

[Isomorphic]

Tab width is specified on the individual tabs (property "width"). Height is specified on TabSet (property "tabBarThickness"), though you may need new image files if you're going to change that (as described in the docs here)

[Eric Taix]

I saw this attribut, but unfortunately it only changes the tab height but not the image height. Typically, i'm using 24x24 icons but they are rendering with a 16 pixels height and width, even if I set the tabBarTickness value with 50.

I'm using SmartGWT but I think this is not a SmartGWT issue. If you think it is, just let me know, I'll post this question to the correct forum.

Thks

[Isomorphic]

Sorry, I'm not sure I've understood you correctly. Do you want to change the size of the tab or the close icon? Your OP seems to say that you have already discovered how to change the close icon size.

[davidj6]

Try adding iconSize: 24 to the tab definition - default is 16. Or you can use iconHeight and iconWidth.

[Eric Taix]

Sorry for my english,

I would like to use a tab's icon which have a size of 24x24 (I'm not using the close feature). Here's an example of what i'm doing:

Tab myTab = new Tab();
myTab.setIcon("tabs/pilot.png");

TabSet myTabSet() = new TabSet();
myTabSet.setTabBarTchicknes(50);
myTabSet.addTab(myTab);

pilot.png has a size of 24x24, but when the TabSet (and the Tab) are rendered the icon is displayed with a size of 16x16 even if I set the property tabBarThickness to 50 (in this case the Tab height is 50, but it doesn't change anything to the icon size)

[davidj6]

I didn't see you are using SmartGWT. I suspect the iconSize property may not be supported in that library yet as it doesn't show in the standard reference docs either.

[Eric Taix]

Davidj6,

Thanks for your response.

Unfortunately, I didn't find iconSize nor iconWidth/iconHeight properties on Tab definition. Perhaps an omission in SmartGWT but I had a look into SmartClient reference (http://www.smartclient.com/docs/6.5.1/a/b/c/go.html#object..Tab), and I couldn't find the properties you mentionned !

[davidj6]

Nope, not there in the docs. But you can visit this feature explorer example and change the tab definitions as follows to see it work in the standard library. Here the comboBoxPicker.png is a 20x20 icon (in the TreeFrog skin anyway) so you can use iconSize 20 or 24 and it will be resized.

isc.TabSet.create({
    ID: "tabSet",
    width: 400,
    height: 200,
    tabs: [{
        id: "profile",
        title: "Profile",
        pane: profilePane,
        icon: "[SKIN]controls/comboBoxPicker.png",
        iconSize: 20

    },{
        id: "preferences",
        title: "Preferences",
        pane: preferencesPane
    }]
});

[Eric Taix]

Thank you very much David,

Your response solved my problem. Here is the final code which works fine:

Tab myTab = new Tab();
myTab.setIcon("tabs/pilot.png");
myTab.setAttribut("iconSize",24);

TabSet myTabSet() = new TabSet();
myTabSet.setTabBarThickness(28);
myTabSet.addTab(myTab);

I'll send a mail (or post a message) to Sanjiv a add a "setIconSize" method to the Tab class.