Search code examples
delphifacebooktagstaggingphotos

Delphi: How to tag photos the way facebook does

I need a way to tag photos in a Delphi desktop application the way Facebook does it.

That includes some way to easily add the tags over the people, and then hovering the mouse over the person in the photo to show the tag.

The two suggestions in the answer given to: "Delphi Components for Face Identification and Tagging" don't solve this.

But I have no idea where to start, and have been unable to find ideas on the web on how to do this. How does Facebook do it? Or maybe there's a component for Delphi that will allow it.

What would be the best way to try to implement Facebook-like tagging?

p.s. This is some of Facebook's API definition for this: http://wiki.developers.facebook.com/index.php/Photos.addTag

Here is a Java program that implements the face tagging functionality that I want to do in my Delphi app: fb-photo-uploader

Solution

  • The key parameters of the API you cited are the picture ID, the coordinates, and the tag. The tag can be either the user ID of a Facebook user, or it can be free-form text (for the case when the tagged subject is not a Facebook user). Facebook uses just one coordinate because it uses fixed-size regions to denote a tagged area; the idea is that you click on the center of a person's face, and Facebook just stores that point.

    If you display a picture in a TImage control (that's the obvious first choice, after all), you can detect mouse clicks with the OnMouseDown and OnMouseUp events. (The OnClick event is simpler, but doesn't tell you the coordinates.) Once you've acquired a point, prompt for a label to accompany that point. You can use predetermined labels, like Facebook's user IDs, or just use ordinary text, or use something of your own devising. The question of what you use to represent a tag value is orthogonal to whatever other questions you've asked so far.

    The other half of Facebook's photo tagging is that moving the mouse over the image displays the tag text over the image, and moving the mouse over the labels below highlight the associated regions. Handle OnMouseMove events and write some code to display or hide labels and shapes as appropriate. If you use TLabel and TShape, you might not even have to modify the image, but showing those controls on top of the image might interfere with further OnMouseMove events for the image. It shouldn't take too long to try some experiments and see what works for you.