Implementing a 'tag panel' control in Delphi?

Question

Please have a look at this screenshot

alt text http://www.maclife.com/files/u18/Yep3-big.jpg

I think these are the main features of such a 'tag panel':

1) Each tag on the panel is a standalone control and can be clicked

2) Auto line wrapping when there is not enough space to show the next tag in the current line.

3) Rounded corner rectangle border for each tag is a nice-to-have feature.

I want to implement the similar function in Delphi, Is there an existing control to do this? If not, what's the best way to implement such a control?

Thank you.

Answer 1

When you are on a recent Delphi version use a TFlowPanel and some appropriate controls for the tags. A simple TButton or a TLinkLabel should do for that.

Answer 2

Each clickable tag doesn't necessarily have to be its own control. It just has to be a region that you can detect being clicked.

Suppose you represent each area as a Windows region. You can figure out how wide each one should be based on its text with the TCanvas.TextExtent function. Then create a region with a function like CreateRectRgn. For rounded corners, try CreateRoundRectRgn instead. You can test for mouse events in each region with the PtInRegion function. You can paint borders around them with FrameRgn. The last obstacle is to draw them on the screen so they'll all fit. You're creating the regions and you know their widths, so assign tags to a row until you run out of space, and then start the next line.

Answer 3

There are two possible solutions to custom alignment in Delphi 7. You can make your own flowpanel by deriving from TCustomPanel and override the AlignControls( )-method, or you can set alignment to alCustom and handle the OnAlignPosition-event.

I guess I would have gone for the TCustomPanel-derivative option. TFlowPanel in form Delphi 2007 uses that option- I have to admit, though, that I have never tried either my self...