Avoid declare icon when using sprites

[ipindado]

Hi,

I've some doubts about the best way of using sprites with isomorphic for out of the box images that I can't resolve with the online reference guide...

Please consider the following example

I've loaded following css text to define an sprite for an accept icon with two possible states (release/down)

.icons16 {
    background-image: url(spritesheet.png);
    background-repeat: no-repeat;
}
.icons16-accept {
    width: 16px;
    height: 16px;
    background-position: -5px -5px;
}
.icons16-acceptDown {
    width: 16px;
    height: 16px;
    background-position: -31px -5px;
}

In order to display for example a button with this icon, if a try this code:

var b1 = isc.Button.create({
    iconStyle : "icons16 icons16-accept",
    title: "My Button",
    showDownIcon: true,
    width: 150
});
var b2 = isc.Button.create({
    icon: "icons16/accept.png",
    title: "My Button",
    width: 150
});
var a = isc.VLayout.create({members: [b1, b2]});

The button is displayed withouth the icon



If I set up the icon property to a transparent image I get it right...

var b1 = isc.Button.create({
    icon: "icons16/_blank.png",
    iconStyle : "icons16 icons16-accept",
    title: "My Button",
    showDownIcon: true,
    width: 150
});
var b2 = isc.Button.create({
    icon: "icons16/accept.png",
    title: "My Button",
    width: 150
});
var a = isc.VLayout.create({members: [b1, b2]});

But as I've enabled the "down state" button when this become pressed both style css class and src properties are changed



I suppose that I can create also "_blank_Down.png" and all possible button states empty images, but I was wondering If this is a valid approach or if it can be avoid in some way (I've tried with icon set to "blank" but it seems that this special tag not works with Buttons).

Thanks and best regards....

[Isomorphic]

At the moment, you would need to add a blank_Down image to make this work. Note that there is already a "blank.gif" in the skin that you can use for the base state, and this is used by other components, so if you just add a blank_Down.gif in the same place you will only have introduced one extra image which can be used across all of the Button or other icons where you want to apply spriting.

We'll look at allowing the special "blank" constant string for button.icon as well, to avoid this small penalty.

[ipindado]

Ok.. many thanks for your quick response.

[Isomorphic]

Note that, as of builds of 11.0+ dated November 23 and later, we've added support for the special "blank" constant when setting the icon attribute of stateful buttons - this will effectively use the system "blank" image without any state suffixes.