title: How to build a Magnifier in WPF C# 4.0?
body: <p>I have an image rendered big and need a zoomed section of what's under user cursor.</p>
  
  <p>My image is inside a Grid and is defined in XAML this way:</p>
  
  <pre><code>&lt;Grid x:Name="RootImgGrid" Background="#FF333333" &gt;
      &lt;Viewbox x:Name="imgViewBox"  Margin="1,1,1,1" Stretch="Fill" &gt;
          &lt;Canvas x:Name="imgCanvas"  ClipToBounds="True" Width="{Binding ElementName=RootImgGrid, Path=ActualWidth}" Height="{Binding ElementName=RootImgGrid, Path=ActualHeight}"&gt;
              &lt;Image x:Name="imgObj" MouseWheel="img_MouseWheel" Cursor="Hand" MouseMove="Img_MouseMove" MouseDown="Img_MouseDown" MouseUp="Img_MouseUp"  &gt;
                  &lt;Image.RenderTransform&gt;
                      &lt;TransformGroup x:Name="imgTransformGroup"&gt;
                          &lt;ScaleTransform x:Name="imgScaleTransform"&gt;&lt;/ScaleTransform&gt;
                          &lt;TranslateTransform x:Name="imgTranslateTransform"&gt;&lt;/TranslateTransform&gt;
                      &lt;/TransformGroup&gt;
                  &lt;/Image.RenderTransform&gt;
                  &lt;Image.LayoutTransform&gt;
                      &lt;RotateTransform x:Name="imgRotateTransform"&gt;&lt;/RotateTransform&gt;
                  &lt;/Image.LayoutTransform&gt;
              &lt;/Image&gt;
          &lt;/Canvas&gt;
      &lt;/Viewbox&gt;
  &lt;/Grid&gt;
  </code></pre>
  
  <p>And I have a zoomed area where should appear the image under my cursor zoomed 2x.</p>
  
  <pre><code>&lt;Viewbox x:Name="imgViewBoxMagnifier" Width="400" Height="90"&gt;
      &lt;Canvas  x:Name="imgCanvasMagnifier" Width="400" Height="90"&gt;
          &lt;Canvas.Clip&gt;
              &lt;RectangleGeometry Rect="0,0,400,90" /&gt;
          &lt;/Canvas.Clip&gt;
          &lt;Image  x:Name="imgMagnifier" Margin="2" Width="400" Height="90"&gt;
              &lt;Image.RenderTransform&gt;
                  &lt;TransformGroup x:Name="imgMagnifierTransformGroup"&gt;
                      &lt;ScaleTransform x:Name="imgMagnifierScaleTransform"&gt;&lt;/ScaleTransform&gt;
                      &lt;TranslateTransform x:Name="imgMagnifierTranslateTransform"&gt;&lt;/TranslateTransform&gt;
                  &lt;/TransformGroup&gt;
              &lt;/Image.RenderTransform&gt;
              &lt;Image.LayoutTransform&gt;
                  &lt;RotateTransform x:Name="imgMagnifierRotateTransform"&gt;&lt;/RotateTransform&gt;
              &lt;/Image.LayoutTransform&gt;
          &lt;/Image&gt;
      &lt;/Canvas&gt;
  &lt;/Viewbox&gt;
  </code></pre>
  
  <p>Now, in my .CS code I've got the function that should show the zoomed image:</p>
  
  <pre><code>public void Magnifier(Canvas imgCanvas, Image imgObject, Image imgMagnifier, MouseEventArgs e)
      {
          Int32 width = 400;
          Int32 height = 90;
  
          if (imgMagnifier.Source != imgObject.Source)
          {
              imgMagnifier.Source = imgObject.Source;
          }
  
          Size size = imgObject.RenderSize;
          RotateTransform rt = (RotateTransform)imgObject.LayoutTransform;
          TranslateTransform tt = (TranslateTransform)((TransformGroup)imgObject.RenderTransform).Children[1];
          ScaleTransform st = (ScaleTransform)((System.Windows.Media.TransformGroup)(imgObject.RenderTransform)).Children[0];
          Double x = e.GetPosition(imgCanvas).X - tt.X;
          Double y = e.GetPosition(imgCanvas).Y - tt.Y;
          Point pos = e.MouseDevice.GetPosition(imgCanvas);
  
          TransformGroup transformGroup = new TransformGroup();
          ScaleTransform scale = new ScaleTransform();
  
          scale.CenterX = x;
          scale.CenterY = y;
          scale.ScaleX = st.ScaleX * 10;
          scale.ScaleY = st.ScaleY * 10;
          transformGroup.Children.Add(scale);
  
          TranslateTransform translate = new TranslateTransform();
          translate.X = ??????????????????;
          translate.Y = ??????????????????;
          transformGroup.Children.Add(translate);
  
          imgMagnifier.RenderTransform = transformGroup;
  
      }
  </code></pre>
  
  <p>How can I find the correct value of those "????????"</p>
  
  <pre><code>translate.X = -x * 10 / (size.Width / 400);
  translate.Y = -y * 10 / (size.Height / 90);
  </code></pre>
  
  <p>It shows the correct image, zoomed, but it doesn't show the image area under my cursor.</p>
  
  <p>Thanks in advance.</p>