Hi all,

I am using both Expression Blend and Visual studio to work on my project.I did a zoom function and i want to place it into a button,so whenever the user click on the button the zoom function will be activated.The problem is i don't how to implement it . Thank in advance those who helped me.

Below is the code for my zoom function.

public MainWindow()

TransformGroup group = new TransformGroup();

ScaleTransform xform = new ScaleTransform();

TranslateTransform tt = new TranslateTransform();

imagePicture.RenderTransform = group;

imagePicture.MouseWheel += image_mousewheel;
imagePicture.MouseLeftButtonDown += image_MouseLeftButtonDown;
imagePicture.MouseLeftButtonUp += image_MouseLeftButtonUp;
imagePicture.MouseMove += image_MouseMove;

public void image_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
var tt = (TranslateTransform)((TransformGroup)imagePicture.RenderTransform).Children.First(tr => tr is TranslateTransform);
start = e.GetPosition(border);
origin = new Point(tt.X, tt.Y);


public void image_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)

public void image_MouseMove(object sender, MouseEventArgs e)
if (!imagePicture.IsMouseCaptured) return;

var tt = (TranslateTransform)((TransformGroup)imagePicture.RenderTransform).Children.First(tr => tr is TranslateTransform);
Vector v = start - e.GetPosition(border);
tt.X = origin.X - v.X;
tt.Y = origin.Y - v.Y;

private void image_mousewheel(object sender, MouseWheelEventArgs e)

TransformGroup transformGroup = (TransformGroup)imagePicture.RenderTransform;
ScaleTransform transform = (ScaleTransform)transformGroup.Children[0];
RenderOptions.SetBitmapScalingMode(imagePicture, BitmapScalingMode.NearestNeighbor);

double zoom = e.Delta > 0 ? .01 : -.01;

transform.ScaleX += zoom;
transform.ScaleY += zoom;

The code appear in visual studio when the button is created

private void Zoom(object sender, RoutedEventArgs Args)


Basically i want to put the zoom function codes into the button.