Gradient Slider V1
12 years ago
Today I decided to redo my gradient slider as a reusable class. But first I had to learn better OOP so after watching a quick tutorial over at GotoAndLearn I started moving all the code into separate class files. The main thing I wanted to do was to have the slider dispatch a custom event, and be able to instantiate the slider from ActionScript. Now I have completed the main re-organising and you can down load the class files below. You can see it in action above as well. I have included most of the documentation on how to use it in the ‘gradientSlider.as’ file. But I will also put it here.
EVENTS:
Only 1 event… dispatched whenever anything is changed (colour, position, add or remove colour)
1 | gradientSliderEvent.GRADIENT_CHANGE |
Returns(?) arrays for gradient Colours, Alphas and Ratios:
colours:Array
positions:Array
alphas:Array
Which can be used for custom stuff (See my ParticlePlayground AIR app)
Or use the following Method…
METHODS:
1 | setGradient(mcToApplyTo:MovieClip); |
USAGE:
-first copy the customColourPicker folder from the supplied gradientSlider FLA and add to your library. The following code provides an example of how to add sliders and use them:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 | import com.nemenvisual.ui.gradientSlider.gradientSlider; import com.nemenvisual.ui.gradientSlider.gradientSliderEvent; var slider:gradientSlider = new gradientSlider(141,17); slider.x = 40; slider.y = 130; addChild(slider); slider.addEventListener(gradientSliderEvent.GRADIENT_CHANGE, onChange); slider.setGradient(sample); //sample is a MovieClip on the stage called 'sample' function onChange(e:gradientSliderEvent):void { slider.setGradient(sample); } |
The gradientSlider is by no means perfect but I do plan to update and improve it soon. Feel free to use it where ever.
[DOWNLOAD]