Sunday, March 28, 2010

Straight line with user interaction

Hi,

?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,

?Paul.

Straight line with user interaction

Hi,

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.

Straight line with user interaction

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

As an example

http://code.google.com/p/flex-object-handles/

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

Here is a Flex 3.x sample...

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

?%26lt;mx:Script%26gt;
?%26lt;![CDATA[
?
?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 );
?invalidateDisplayList();
?}
?
?override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number) : void
?{
?super.updateDisplayList( unscaledWidth, unscaledHeight );
?
?overlay.graphics.clear();
?
?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 );
?}
?}?
?
?]]%26gt;
?%26lt;/mx:Script%26gt;

?%26lt;mx:Canvas id=''canvas'' mouseDown=''handleMouseDown(event);'' width=''400'' height=''150'' horizontalCenter=''0'' verticalCenter=''0'' backgroundColor=''#FFFFFF'' /%26gt;
?%26lt;mx:Label text=''( click in the white area )'' horizontalCenter=''0'' verticalCenter=''91''/%26gt;
?
%26lt;/mx:Application%26gt;

Thanks for your reponse.?That will really help : )

No comments:

Post a Comment