Tuesday, March 20, 2007

Skinning scrollbar in flex

All the components can be customized in flex.
Add the following lines of code in your stylesheet to customize your scrollbar

ScrollBar {
downArrowUpSkin: Embed(source="/assets/downArrow.png");
downArrowOverSkin: Embed(source="/assets/downArrowOver.png");
downArrowDownSkin: Embed(source="/assets/downArrow.png");

upArrowUpSkin: Embed(source="/assets/upArrow.png");
upArrowOverSkin: Embed(source="/assets/upArrowOver.png");
upArrowDownSkin: Embed(source="/assets/upArrow.png");

thumbDownSkin: Embed(source="/assets/thumb.png",
scaleGridLeft="7", scaleGridTop="5", scaleGridRight="8", scaleGridBottom="7");
thumbUpSkin: Embed(source="/assets/thumb.png",
scaleGridLeft="7", scaleGridTop="5", scaleGridRight="8", scaleGridBottom="7");
thumbOverSkin: Embed(source="/assets/thumb.png",
scaleGridLeft="7", scaleGridTop="5", scaleGridRight="8", scaleGridBottom="7");

trackSkin: Embed(source="/assets/scrolltrack.png",
scaleGridLeft="7", scaleGridTop="4", scaleGridRight="8", scaleGridBottom="6" );

}

3 comments:

Anonymous said...

This is the worst post ever. No explanation, no demo, no assets, nothing. Next time you post about something you should provide a little more detail.

Anonymous said...

Bhattt!!!!!

Anonymous said...

Very helpful, thanks!