Zoom Image on selected area using WPF

Pardhu2020
Posted by in WPF category on for Beginner level | Points: 250 | Views : 8944 red flag
Rating: 4 out of 5  
 1 vote(s)

In this article, we will discuss how to zoom a image using WPF Parameters.

Introduction

Hi friends today we will discuss how to zoom a image using WPF Parameters.


  1. Once open the Visual Studio click on File Click on the Project .

  1. As you are seeing there are many application(s) from them Select WPF application
  2. At name rename it as per your requirement.

Adding new folder :



  1. Right click on the project click on Add from there click on New Folder
  2. Name the folder as per your requirement .


We need to add existing item . we need to add image in this folder . its very important area ensure that you’re
going to add image with read,write permissions

<Canvas.Background>
<ImageBrush ImageSource= ":D\Beautyfull-Birds-1.jpg"/>

 </Canvas.Background>
Once image added into folder ensure that drag and drop at image source . 
Or
Type the image path and ensure that path is correct .



Once the image is added in that path preview of that of form will look like above .

<Window x:Class="ImageZoomExample.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <ScrollViewer x:Name="scrollViewer"
                  HorizontalScrollBarVisibility="Auto">
        <Canvas Height="200" Name="mainCanvas" Width="400"
                MouseLeftButtonDown="mainCanvas_MouseLeftButtonDown"
                MouseLeftButtonUp="mainCanvas_MouseLeftButtonUp"
                MouseMove="mainCanvas_MouseMove">
            <Canvas.Background>
                <ImageBrush ImageSource="D:\Beautiful-Birds-1.jpg"/>
            </Canvas.Background>
            <Canvas.LayoutTransform>
                <TransformGroup>
                    <ScaleTransform x:Name="scaleTransform"/>
                </TransformGroup>
            </Canvas.LayoutTransform>
        </Canvas>
    </ScrollViewer>
</Window>

  1. Click F5 and run the project the out put screen look like above .
  2. As your able to see a red color box area going to zoom and looks like below .

Conclusion:


In this article we have seen how to zoom Image on selected area Using WPF.





Page copy protected against web site content infringement by Copyscape

About the Author

Pardhu2020
Full Name: Pardha Saradhi
Member Level:
Member Status: Member
Member Since: 3/19/2013 2:21:22 PM
Country: India

http://www.dotnetfunda.com

Login to vote for this post.

Comments or Responses

Posted by: Thomas128 on: 10/27/2014 | Points: 25
Hi Padha,I&#39;m learning about image processing lately and thanks for your great post for image zooming !

Posted by: Azalin on: 4/12/2016 | Points: 25
So where is the .cs file?

Login to post response

Comment using Facebook(Author doesn't get notification)