一、主要功能介绍
在MainWindow中调用自定义的图片展示控件。通过选择图片按钮将图片文件的路径传输进来,然后刷新按钮显示图片,清楚按钮则清楚展示的图片内容。这里左边分布了2*2的图片展示控件。
二、图片控件
<Border BorderBrush="Blue" BorderThickness="2" MinHeight="400" MinWidth="400"
x:Name="xBorder"
MouseWheel="Image_MouseWheel" MouseLeftButtonDown="Image_MouseLeftButtonDown"
MouseRightButtonDown="Image_MouseRightButtonDown" MouseRightButtonUp="Image_MouseRightButtonUp"
MouseMove="Image_MouseMove">
<Grid x:Name="xImageGrid" ClipToBounds="True">
<Image x:Name="xImage" Source="{Binding TheBitmapSource}" Stretch="Uniform" RenderOptions.BitmapScalingMode="NearestNeighbor">
<Image.RenderTransform>
<MatrixTransform x:Name="xMatrix"/>
</Image.RenderTransform>
</Image>
</Grid>
</Border>
该控件主要功能是:
- 右键按住移动
- 左键双击回原
- 鼠标滚轮放大缩小
资源绑定:
<views:ImageDispalyView x:Name="xView1"/>
控件图片资源中绑定的是 DataContext的 “TheBitmapSource"属性。在后台中有
Mat image = new Mat();
image = new Mat(imageFilePath,ImreadModes.ReducedColor2);
dispalyViews[viewIndex].DataContext = new Product(image);
其中Product:
public class Product
{
public Mat ImageMat { get; set; }
public BitmapSource TheBitmapSource { get; set; }
public Product(Mat mat)
{
ImageMat = mat;
TheBitmapSource=mat.ToBitmapSource();
}
}
三、功能实现
右键按住移动:
对应Border事件:MouseRightButtonDown、MouseRightButtonUp、MouseMove
private void Image_MouseRightButtonDown(object sender, MouseButtonEventArgs e)
{
var position = e.GetPosition(xImageGrid);
mousePos = position;
xImage.CaptureMouse();
}
当右键鼠标点下时,捕捉当前鼠标
private void Image_MouseRightButtonUp(object sender, MouseButtonEventArgs e)
{
xImage.ReleaseMouseCapture();
}
当右键鼠标松开时,释放当前鼠标
private void Image_MouseMove(object sender, System.Windows.Input.MouseEventArgs e)
{
if (xImage.IsMouseCaptured)
{
var pos = e.GetPosition(xImageGrid);
var m = xMatrix.Value;
m.OffsetX += pos.X - mousePos.X;
m.OffsetY += pos.Y - mousePos.Y;
xMatrix = new MatrixTransform(m);
xImage.RenderTransform = xMatrix;
mousePos = pos;
}
}
鼠标移动时,图片跟着移动
左键双击回原
对应Border事件:MouseLeftButtonDown
private void Image_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
if (e.ClickCount > 1)
{
var m = new Matrix();
xMatrix = new MatrixTransform(m);
xImage.RenderTransform = xMatrix;
}
}
鼠标滚轮缩放
对应border事件MouseWheel
private void Image_MouseWheel(object sender, MouseWheelEventArgs e)
{
var position = e.GetPosition(xImage);
var m = xMatrix.Value;
if (e.Delta > 0)
{
m.ScaleAtPrepend(1.1, 1.1, position.X, position.Y);
}
else
{
m.ScaleAtPrepend(1 / 1.1, 1 / 1.1, position.X, position.Y);
}
xMatrix = new MatrixTransform(m);
xImage.RenderTransform = xMatrix;
}