Flex Examples
The following example shows how you can set the thickness of a tick on a Flex HSlider control by setting the tickThickness style.
Full code after the jump.
<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/05/06/setting-the-tick-thickness-on-a-slider-control-in-flex/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
verticalAlign="middle"
backgroundColor="white">
<mx:Form>
<mx:FormItem label="tickThickness:">
<mx:HSlider id="slider"
minimum="1"
maximum="4"
liveDragging="true"
snapInterval="1"
tickInterval="1"
tickThickness="{slider.value}" />
</mx:FormItem>
</mx:Form>
</mx:Application>
View source is enabled in the following example.
Peter deHaan
Peter deHaan currently works for Adobe on the Flex SDK QA team. While not working on Flex, Flash, and ColdFusion applications, Peter enjoys making up bios and writing in 3rd person. Peter's rarely updated blog can be found at blogs.adobe.com/pdehaan/, actionscriptexamples.com, airexamples.com, and coldfusionexamples.com.
Share
Visually it looks like the tick is not centered when it’s drawn. ie, in your example when it gets thicker is moves to the left.
When you look at the source for Slider, HSlider’s super class in the layoutTicks method there is an XOffset value which should be compensating for this. Annoyingly there’s no way to extend this and fix this method as it’s private.
From what I can tell, short of ripping the code out and re-writing your own, there’s not a lot you can do.
Jolyon
Jolyon,
I’ve filed a bug in the public Flex bug base at http://bugs.adobe.com/jira/browse/SDK-15529.
Peter