Group photo

Got a LiveCode personal license? Are you a beginner, hobbyist or educator that's new to LiveCode? This forum is the place to go for help getting started. Welcome!

Moderators: FourthWorld, heatherlaine, Klaus, kevinmiller

Post Reply
montymay
Posts: 145
Joined: Thu Jul 18, 2013 5:23 am

Group photo

Post by montymay » Wed Jul 09, 2014 11:51 pm

I cant find any discussion on the forum on how one could enhance a group photo so that when the cursor enters over face or body of each person, a window pops up allowing the user to find out more information about that person. In my project, it is a photo of 21 elected senators for a US territory. On mouseover I want to show the his/her name, and allow the user to read a short biographical sketch and other information by clicking in the popup. I tried putting labels at the feet of each person, but it seems you would have to write code to make the 21 labels invisible at the same time as the photo is hidden. Is there a better way? Thanks for any suggestions?

Monty

Mark
Livecode Opensource Backer
Livecode Opensource Backer
Posts: 5150
Joined: Thu Feb 23, 2006 9:24 pm
Contact:

Re: Group photo

Post by Mark » Thu Jul 10, 2014 12:22 am

Hi Monty,

An easy way to do this is by using the polygon tool to draw silhouettes around the figures. If each figure has its own polygon, you can use the mouseWithin message to detect that the message is within the figure or the mouseEnter message to detect that mouse has moved to that figure. Use the mouseLeave message to hide your pop-up.

To make the polygons invisible, you can set their inks to addMax or noop, or just experiment with some inks to see what suits you best.

Kind regards,

Mark
The biggest LiveCode group on Facebook: https://www.facebook.com/groups/livecode.developers
The book "Programming LiveCode for the Real Beginner"! Get it here! http://tinyurl.com/book-livecode

Simon
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 3901
Joined: Sat Mar 24, 2007 2:54 am

Re: Group photo

Post by Simon » Thu Jul 10, 2014 12:40 am

Well I was having too much fun with this one so here it is:

Code: Select all

on mouseUp
   show fld "detailedDescription"
end mouseUp

on mouseWithin
   set the topRight of fld 1 to the bottomLeft of me--wherever you like
   put "This is senator 1" into fld 1
  set the blendLevel of fld 1 to 0
end mouseWithin
on mouseLeave
set the blendLevel of fld 1 to 99
end mouseLeave
Draw 1 rectangle over the face of 1 person
no border
Set it's opacity to true
set it's blendLevel to 99
Add the above code to the rectangles script
Now clone that rect (Ctrl+click) and drag it over another face, rewrite the description and keep going for all the faces.

FUN!
Simon
I used to be a newbie but then I learned how to spell teh correctly and now I'm a noob!

sefrojones
Livecode Opensource Backer
Livecode Opensource Backer
Posts: 447
Joined: Mon Jan 23, 2012 12:46 pm

Re: Group photo

Post by sefrojones » Thu Jul 10, 2014 1:05 am

I made a pretty simple version of this using a group with a label field, a button, and an invisible field for the bio info. Basically you can just copy my group "FaceBox", and drag it over each face. You can then change the label of the button "face" of that group, and add your short bio to the fld "Face Info" of the group. check out my sample, it's just a quick attempt at what you're looking for. If you went the silhouette route that mark mentioned, the button "face" could easily be replaced with a polygon......

check my sample.

--Sefro

My image i used in this stack make it a bit bigger than the allowed filesize, I hosted it on my Google drive. You can download from this link:

https://9f3842e07d8c6feae8cc3e01e8f91f1 ... t.livecode

jiml
Posts: 339
Joined: Sat Dec 09, 2006 1:27 am

Re: Group photo

Post by jiml » Thu Jul 10, 2014 5:54 pm

Take a look at the TOOLTIP entry in the dictionary.

Mark
Livecode Opensource Backer
Livecode Opensource Backer
Posts: 5150
Joined: Thu Feb 23, 2006 9:24 pm
Contact:

Re: Group photo

Post by Mark » Thu Jul 10, 2014 6:05 pm

Hi,

Using tooltips actually isn't a bad idea, except that it automatically hides after some time. I think OP wants the senator's name to disappear when the mouse moves away.

Kind regards,

Mark
The biggest LiveCode group on Facebook: https://www.facebook.com/groups/livecode.developers
The book "Programming LiveCode for the Real Beginner"! Get it here! http://tinyurl.com/book-livecode

Post Reply