WPF鼠标划线测距——模仿电子地图测距

原创 2013年12月05日 17:46:23

百度地图的测距工具,大家用过的应该知道。

选择进入测距模式,单击鼠标选择起始点。移动鼠标,出现随鼠标移动的直线,再单击,又可以选中一点,直至双击或右击结束测距。


核心:由于测距时,鼠标一直处于图片内部,且鼠标基本是移动的,所以IMAGE空间的mouseMove事件始终被触发。

而执行mouseMove的响应函数会阻塞其他事件的响应。

在这,我们就要借助IMAGE控件的父空间Grid,在父控件上定义mouseDown,这样,MouseMove的响应就不会被阻塞了。

这在图片处理上,给用户提供了更加友好的操作UI。

XAML代码

<Window x:Class="WpfApplication2.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="600" Width="700">
    <Grid x:Name="grid" MouseDown="grid_MouseDown" MouseRightButtonDown="grid_MouseRightButtonDown">
        <Image Name="imgBox" Height="500" Width="600" Source="E:\\gyy.jpg"
               MouseWheel="ImgBoxMouseWheel" RenderOptions.BitmapScalingMode="NearestNeighbor" 
               MouseRightButtonDown="imgBox_MouseRightButtonDown" HorizontalAlignment="Center"
               VerticalAlignment="Center" MouseMove="imgBox_MouseMove" 
               MouseLeftButtonDown="imgBox_MouseLeftButtonDown">
            <Image.RenderTransform>
                <ScaleTransform x:Name="ScaleTran" />
            </Image.RenderTransform>
        </Image>
        <Canvas Name="Imgcanvas" Height="500" Width="600">
            <Polyline Stroke="Red" StrokeThickness="1" Name="lines"></Polyline>
            <Path Stroke="Red">
                <Path.Data>
                    <PathGeometry>
                        <PathFigure x:Name="pathImg">
                            <LineSegment x:Name="lineImg"/>
                        </PathFigure>
                    </PathGeometry>
                </Path.Data>
            </Path>
        </Canvas>
    </Grid>
</Window>
鼠标移动事件响应代码段

        private void imgBox_MouseMove(object sender, MouseEventArgs e) {
            if (captureMode) {
                pathImg.StartPoint = lineStartPoint;
                lineImg.Point = e.GetPosition(Imgcanvas);
            }
        }

        private void grid_MouseDown(object sender, MouseButtonEventArgs e) {
            captureMode = false;
            Point point = new Point();
            point = e.GetPosition(Imgcanvas);
            lineStartPoint = point;
            pointsCollection.Add(point);
            lines.Points = pointsCollection;
            captureMode = true;
        }

运行结果 



鼠标测距1

这个项目不得不进行了,看来是推不掉了 今天终于找到点有用的东西,刚好是计算速度,正好用的上了,稍后转过来,方便使用 公式,单片机,fpga,vc,天啊,,,,,,...
  • becdecorbin
  • becdecorbin
  • 2010年05月26日 09:48
  • 250

百度地图测距和鼠标位置不一致

使用官方API开启百度测距后,浏览器显示测距点和鼠标位置不一致。 解决方法: 将http://api.map.baidu.com/library/DistanceTool/1.2/src/Dist...
  • Sparrowflying
  • Sparrowflying
  • 2018年01月25日 16:50
  • 55

鼠标测距2

巧妇难为无米之炊啊,不给我单片机,我怎么给你做啊 改为FPGA吧,反正学习嘛,高手就是要善于利用手中的一切!! 努力,加油!!!...
  • becdecorbin
  • becdecorbin
  • 2010年05月27日 10:36
  • 211

如何用摄像头来测距(opencv)

 如何用摄像头来测距(opencv)作者:郭世龙       最近一直忙着找工作,blog都长草了,今天把以前作的一个东西放上来充充门面吧。记得在哪看到过老外做的这个东西,觉得很好玩,就自己也做了一个...
  • xylary
  • xylary
  • 2007年10月25日 19:01
  • 19204

学习OpenCV(4) 基于OpenCV的双目测距程序

用MFC和OpenCV编写的双目测距程序,编写过程中参考了很多前人的经验,期间很多博主给我提供了源码或者问题解答,所以我想把我的经验写出来分享给大家,也许并没有什么使用价值,但是可以作为类似的项目的参...
  • Angle_Cal
  • Angle_Cal
  • 2017年02月27日 10:11
  • 1778

DRuler 拍照测距原理

拍照测距原理
  • shirakawakanaki
  • shirakawakanaki
  • 2016年12月28日 11:44
  • 5786

鼠标点击屏幕两点出现距离数字(算是测距),代码(3D)

using UnityEngine; using System.Collections; public class text : MonoBehaviour {     private...
  • juan_bo
  • juan_bo
  • 2016年10月13日 16:28
  • 699

AndroidBLE--Measuring distance(测量距离)

iBeacon介绍 iBeacon是苹果在2013年WWDC上推出一项基于蓝牙4.0(Bluetooth LE | BLE | Bluetooth Smart)的精准微定位技术,当你的手持设...
  • BlueAmerTJ
  • BlueAmerTJ
  • 2016年07月13日 18:56
  • 3183

双目测距数学原理详解

前言最近用到了双目测距的知识,乍想一下这应该是一个很简单很经典的知识了,理论介绍应该很对并且很详尽才对。可是真正想要明白到能给别人讲懂,还是花了一番功夫。网上的类似的文章很多,但是到多都是一样的知识的...
  • u013832707
  • u013832707
  • 2016年12月21日 11:24
  • 4339

OpenCV单目平面测距

单目测距广泛运用于车辆道路障碍物识别、机器人导航等领域,是计算机视觉中的重要技术之一。 众所周知的是,图像中的像素坐标只提供了二维信息,而空间坐标是三维信息,因此只能让空间坐标中的一维为0或固定值,才...
  • a361251388
  • a361251388
  • 2015年08月30日 23:49
  • 7624
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:WPF鼠标划线测距——模仿电子地图测距
举报原因:
原因补充:

(最多只允许输入30个字)