Enlarge image on mouseover (.NET 2.0)

O

Odd TSi

I'm trying to create a smoothly animated doubling in size of an image when
the user moves the mouse over it and shrinking back to normal when the mouse
leaves. The image needs to enlarge/shrink while staying centered, NOT pinned
to the top-left corner. With WPF this is apparently only a couple lines of
XAML code but I'm at a loss so far in doing it efficiently and cleanly in
..NET 2.0.

First I tried simply using a timer, picturebox (sizemode set to zoom), and
making successive calls to setbounds(). This would work fine if the image
stays pinned to the top-left corner but I need it to be pinned in the center.
Doing it this way the animation is very jittery. For a split second after the
bounds of the picturebox change and before the image is redrawn to fit the
new size the old-sized image is moved to the top-left corner of the box. This
creates jittery zig-zag-like movement.

Next I tried hiding the picturebox right before the call to setbounds() and
showing it right after. As I expected that got rid of one problem but created
another. It got rid of the jitter but introduced flicker. The solution that
I've found works with just one image is akin to double-buffering. I'm using
two pictureboxes, showing one while enlarging the hidden one, bringing the
hidden one to the front and showing it.

This works smoothly but will cause issues when I add more than one image
since the delay in animation of enlargement and shrinking might cause them to
overlap and they'll be fighting eachother with bringtofront() and
sendtoback() calls.

Does anyone know of a better way of accomplishing this? And no, switching to
3.0 or 3.5 so I can just do it with XAML isn't a possibility just yet.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Top