The following example shows how you can prevent a user from clicking on the track of a Flex HSlider control by setting the Boolean allowTrackClick property.
Full code after the jump.
<?xml version="1.0" encoding="utf-8"?> <!-- http://blog.flexexamples.com/2008/12/27/preventing-a-user-from-clicking-the-track-on-an-hslider-control-in-flex/ --> <mx:Application name="HSlider_allowTrackClick_test" xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" verticalAlign="middle" backgroundColor="white"> <mx:ApplicationControlBar dock="true"> <mx:Form styleName="plain"> <mx:FormItem label="allowTrackClick:"> <mx:CheckBox id="checkBox" selected="true" /> </mx:FormItem> </mx:Form> </mx:ApplicationControlBar> <mx:HSlider id="slider" allowTrackClick="{checkBox.selected}" /> </mx:Application>
View source is enabled in the following example.
You can also set the allowTrackClick property using ActionScript, as seen in the following example:
<?xml version="1.0" encoding="utf-8"?> <!-- http://blog.flexexamples.com/2008/12/27/preventing-a-user-from-clicking-the-track-on-an-hslider-control-in-flex/ --> <mx:Application name="HSlider_allowTrackClick_test" xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" verticalAlign="middle" backgroundColor="white"> <mx:Script> <![CDATA[ private function checkBox_change(evt:Event):void { slider.allowTrackClick = checkBox.selected; } ]]> </mx:Script> <mx:ApplicationControlBar dock="true"> <mx:Form styleName="plain"> <mx:FormItem label="allowTrackClick:"> <mx:CheckBox id="checkBox" selected="true" change="checkBox_change(event);" /> </mx:FormItem> </mx:Form> </mx:ApplicationControlBar> <mx:HSlider id="slider" /> </mx:Application>
{ 3 comments… read them below or add one }
I would encourage webmasters to not use this option on the videos because it is annoying!! I can see where it would be necessary though. For example if you were doing an online defensive driving course you would have to force your users to sit down and watch the entire video.
i use it but not work !!!
caiven,
I just tested the top example in Flex 3.4 SDK and it seems to work for me.
How is your code different?
Peter