Contribute

How to scale image on Mouse Wheel event in Silverlight


I have defined the image in XAML like this:

<UserControl
          xmlns=http://schemas.microsoft.com/winfx/2006/xaml/presentation
          xmlns:x=http://schemas.microsoft.com/winfx/2006/xaml
          x:Class="imginSL.MainPage"
          Width="640" Height="480">
          <Grid x:Name="LayoutRoot" Background="White">
                   <Image x:Name="img" Margin="151,127,208,142" Source="Waterfall.jpg" Stretch="Fill" MouseWheel="resize_onmousewheel">
                   <Image.RenderTransform>
                             <ScaleTransform x:Name="imagescale"></ScaleTransform>
                   </Image.RenderTransform>
                   </Image>
          </Grid>
</UserControl>

Now I am calling "resize_onmousewheel" method from MouseWheel event of the image.

private void resize_onmousewheel(object sender, System.Windows.Input.MouseWheelEventArgs e)
{
    if (e.Delta < 0)
    {
        imagescale.ScaleX = imagescale.ScaleX * 1.10;
        imagescale.ScaleY = imagescale.ScaleY * 1.10;
    }
    if (e.Delta > 0)
    {
        imagescale.ScaleX = imagescale.ScaleX / 1.10;
        imagescale.ScaleY = imagescale.ScaleY / 1.10;
    }
}

You can see the result by wheeling the mouse over the image.