How do I Flex lines drawn with lineTo selectable?

This comes in from a reader:

I need to make a application which helps in making a Data Flow Diagram, everything is done in it but I need to make lines selectable on that diagram. That means once a line drawn can be re sized. I am using Graphics.lineTo() functions to draw a line but once line drawn can never be selected.

It sounds like a cool app. I don't have an answer this time, though, and as such my answer might be off.

From what I understood, you need a sprite for something to be selectable. Graphics.lineTo does not create one as best I understand it.

He'll have to put the line in some specific container to make it selectable, perhaps a highly customized Button or a mod of the VRule or HRule classes.

Next Day Update I got a solution from the reader. He wrapped up his 'line' in a UIComponent and was able to get everything working great / as expected.

I do like answering questions, even though I tend to get real busy these days trying to make Flextras work as a business. You can ask me your question here, or stop by a Flextras Friday Lunch session and ask me in person. If you're really inspired to show you support check out The Flex Show's sponsorship drive.

Comments (Comment Moderation is enabled. Your comment will not appear until approved.)
Adobe Flex Tutorial's Gravatar Hi,
Simply use a Sprite cause Shape ain't dispatching any event. If you want to make it clickable, just add an event listener on MOUSE_UP (or MOUSE_DOWN if you like) and that's it. Overriding HRule or Button would highly decrease the performances of the application
# Posted By Adobe Flex Tutorial | 1/20/10 5:54 AM
Tink's Gravatar To do this you would need at least 2 Sprites for each line, lets call these 'handles' (you may want a 3rd to contain the 2 in question, and to use as the drawing container).

A Sprite is the lowest level DisplayObject that can receive interaction from the mouse, and has a Graphics object for drawing.

The handles would mark either end of the line. When a user mouse's down on one of them you can add a listener for mouse movement, and re-position the handle accordingly, then redraw the line from one handle to the other. Remove the listener when they release the mouse (probably best to add a mouse up listener to the stage).

You'd then wrap all this stuff in a UIComponent so is can be added to a standard container in Flex.

Hope thats helpful.
# Posted By Tink | 1/20/10 5:09 PM
All Content Copyright 2005, 2006, 2007, 2008, 2009 Jeffry Houser. May not be reused without permission
BlogCFC was created by Raymond Camden. This blog is running version 5.9.2.002.