5 Replies Latest reply on Jun 7, 2009 12:14 PM by sam luke

    Straight line with user interaction

    sam luke Level 1


        I want to create graphics area within a panel.  Within the panel I want to have a straight vertical line(From top to bottom) within the box.  Then upon the user selecting an area within the graphics area I would like the vertical line to move to that location.  Is this possible?


      I originally wanted to use a chart to do this but there doesnt seem to be any way of doing this!


      Please help,


        • 1. Re: Straight line with user interaction
          _Natasha_ Level 4



          of course you can use chart for this, but you should understand that you need to convert coordinates from screen's to chart's. So it's can be implemented this way if you need to shown another data which have charts coordinates.

          Each component has mouseMove event. You can bind position of any component to coordinates of mouse from this event.

          • 2. Re: Straight line with user interaction
            sam luke Level 1

            Thanks for your response.  Do you know of an example which I can look at.

            • 3. Re: Straight line with user interaction
              _Natasha_ Level 4

              As an example



              Resizing and moving objects. Handling only catched object but idea and technick is the same.

              • 4. Re: Straight line with user interaction
                RWinscot Level 1

                Here is a Flex 3.x sample...


                <?xml version="1.0" encoding="utf-8"?>
                <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="ccomp();" layout="absolute" minWidth="1024" minHeight="768">

                        import mx.core.UIComponent;
                        private var overlay:UIComponent = new UIComponent();
                        private var pt:Point = null;
                        private function ccomp():void
                            canvas.addChild( overlay );
                        private function handleMouseDown( event:MouseEvent ):void
                            pt = new Point( event.localX, event.localY );
                        override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number) : void
                            super.updateDisplayList( unscaledWidth, unscaledHeight );
                            if ( pt != null )
                                overlay.graphics.lineStyle( 2.0, 0xFF0000, 0.65 );
                                overlay.graphics.moveTo( pt.x, 0 );
                                overlay.graphics.lineTo( pt.x, canvas.height );
                                overlay.graphics.moveTo( 0, pt.y );
                                overlay.graphics.lineTo( canvas.width, pt.y );

                    <mx:Canvas id="canvas" mouseDown="handleMouseDown(event);" width="400" height="150" horizontalCenter="0" verticalCenter="0" backgroundColor="#FFFFFF" />
                    <mx:Label text="( click in the white area )" horizontalCenter="0" verticalCenter="91"/>

                1 person found this helpful
                • 5. Re: Straight line with user interaction
                  sam luke Level 1

                  Thanks for your reponse.  That will really help : )