September 3rd, 2007 by Kyle
Tags: , , , , , , , ,
Posted in: Flex

I had a customer asking how he could make the lines in a LineSeries have a sensitivity to mouse proximity similar to the datapoints.
Here is what I came up with:

The essence of the solution was to extend the LineRenderer and draw an additional line with alpha=0, but of specified width, to the graphics object that the visible line is drawn on. That way mouse events will be dispatched by this line.

I figured the most logical place to specify the lineSensitivity attribute would be on the “Stroke” object, so I added that property to an extension of the Stroke class that I then access in my custom LineRenderer.

Here is the Stroke extension:

package
{
    import mx.graphics.Stroke;

    public class MyStroke extends Stroke
    {
        public function MyStroke(color:uint=0.0, weight:Number=0.0, alpha:Number=1.0, pixelHinting:Boolean=false, scaleMode:String="normal", caps:String=null, joints:String=null, miterLimit:Number=0.0)
        {
            super(color, weight, alpha, pixelHinting, scaleMode, caps, joints, miterLimit);
        }
       
        private var _lineSensitivity:Number=50;
   
        [Inspectable(category="General")]
   
        public function get lineSensitivity():Number
        {
            return _lineSensitivity;
        }
       
        /**
         *  @private
         */

        public function set lineSensitivity(value:Number):void
        {
            _lineSensitivity = value;
        }      
       
    }
}
 

Read the rest of this post»


No Comments »

I had a customer who asked for help in modifying the Accordion component to change panes when a user moused over a pane header rather than when clicked upon. It turns out that this was a fairly straight forward modification.
In my extension to accordion upon child add, I merely add an eventlistenr to each child’s header, listening for mouseOver events and responding to them by dispatching a click event. Everything else just fall into place, since things are already wired to respond to the click event.

Here is my extension to accordion:

<mx:accordion xmlns:mx="http://www.adobe.com/2006/mxml">
childAdd="onChildAdd(event)">

    <mx:script>
        <!–[CDATA[
            import mx.containers.accordionClasses.AccordionHeader;
            import mx.containers.Accordion;

            private function onChildAdd(e:Event):void{
                var a:Accordion = e.target as Accordion;
                var header:AccordionHeader=a.getHeaderAt(acc.numChildren-1) as AccordionHeader;
                header.addEventListener(MouseEvent.MOUSE_OVER, onMouseOver);
            }

            private function onMouseOver(e:MouseEvent):void{
                (e.target as AccordionHeader).dispatchEvent(new MouseEvent(MouseEvent.CLICK));
            }

        ]]–>
    </mx:script>
</mx:accordion>

Read the rest of this post»


1 Comment »