• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 911
  • Last Modified:

Enlarge a picture and add text on mouseover - using Listview

Hello.  Currently I am using a Listview box.  In the box I have a list of items, with pictures above each item title.  As I type into a textbox, the results of the Listview box change dynamicaly to match what I am typing.


I want to make it so that if I hold the mouse cursor over the picture of one of the items, the picture is enlarged, and some extra details about the item are displayed beneath the picture... then when I move the mouse away it shrinks back into the list.  

Is this possible with listview?  If so can somebody point me on the right track, or tell me what approach i need to take?

Thanks,
0
twibblejaway
Asked:
twibblejaway
  • 4
  • 4
2 Solutions
 
Bob LearnedCommented:
1) How are the pictures displayed?  

2) What is the View set to for the ListView?  LargeIcons?

Bob
0
 
twibblejawayAuthor Commented:
1)I am getting the image name from an access database,
then:
LargeImageList.Images.Add("image")

then putting it into the Listview:
Listview.Items.Insert(i, "item_name", i)


2) It is set to largeicons.  
0
 
Bob LearnedCommented:
Do you want to display larger images in the ListView or another control, like a PictureBox control?

Bob
0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 
twibblejawayAuthor Commented:
Maybe I am going about this the wrong way.  What I want is
A box on the screen with images:

-----------------------
|   IMG_A  IMG_B   |
|    texta    textb    |
|                          |
|                          |
|   IMG_C  IMG_D  |
|    textc    textd    |
|                          |
|                          |
|                          |
-----------------------

When I mouse over IMG_A, i want the image to be enlared, and also extra information about the image to be displayed (eg, price, quantity available)

How can I accomplish this?
0
 
Bob LearnedCommented:
I think that your approach would be very difficult, if not impossible, to accomplish.  Your ListView is bound to an ImageList.  ImageList's can only contain fixed image sizes.  You would have to switch ImageLists between a small list, and a large list, but that size would apply to all the images, and not just the selected item.  The ListView control has a StateImageList, but that wouldn't help.

Bob
0
 
twibblejawayAuthor Commented:
Any ideas how I can accomplish what I want to do?
0
 
Bob LearnedCommented:
I was asking before if you wanted to use a larger PictureBox to display the larger image with a caption below?  You have to have to form real estate, though.

-----------------------                     +---------------------------------------+
|   IMG_A  IMG_B   |                    |                                                  |
|    texta    textb    |                    |                                                  |
|                          |                    |           Larger IMG_A                   |
|                          |                    |                                                  |
|   IMG_C  IMG_D  |                    |                                                  |
|    textc    textd    |                    |                                                  |
|                          |                    |                                                  |
|                          |                     +---------------------------------------+
|                          |                    Label:  This is IMG_A.  It is a 10 KB GIF file.
-----------------------
0
 
arthurmnevCommented:
A few ways to go about it:

Use two forms:
1) the main form with all your controls on it
2) "tooltip form" that will contain a larger image and a blank label

If you want enlarged picture to appear kind of like tooltip when you move the mouse over then:

get the left side of the picture box
get pixel coordinate to identify line boundaries coordinates
trap mousemove event
as soon as mouse is over a particular set of coordinate populate a mini form with picture and text  and set location to left side of the X=listbox Y=mouse Y snapped to the lower Y (position the form over the current line or you can snap it to next line's Y to position it below)
position the form at coordinates over the line.
if you do dynamic opacity change, it will look like fade in/out.
If you change the window style, you can make the clicks go through the upper levle form.
0
 
twibblejawayAuthor Commented:
I decided to go another route, but I may use ideas from either or both of you so I'll just split the points.  Thanks for your help.  
0

Featured Post

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

  • 4
  • 4
Tackle projects and never again get stuck behind a technical roadblock.
Join Now