系列文章目录
第一章 Grid内控件拖动
第二章 Canvas内控件拖动(本章)
第三章 任意控件拖动
第四章 窗口拖动
第五章 附加属性实现任意拖动
第六章 拓展更多拖动功能
前言
有一些业务场景中我们需要拖动控件,上一篇文章《C# wpf 实现Grid内控件拖动》在Grid中实现了控件拖动,在Canvas中也可以实现控件拖动,通过设置Canvas的附加属性即可,根据鼠标的移动,设置相应Canvas的Left、Top。
一、如何实现?
1.注册鼠标事件
拖动的控件需要注册3个鼠标事件分别是,鼠标按下、鼠标移动、鼠标弹起。
以Button为例:
<Button PreviewMouseDown="Button_MouseDown"
PreviewMouseMove="Button_MouseMove"
PreviewMouseUp="Button_MouseUp"> </Button>
2.记录位置
在鼠标按下事件中记录位置。记录位置时需要判断属性值是否为NAN,如果为NAN则记录为0。
//鼠标是否按下
bool _isMouseDown = false;
//鼠标按下的位置
Point _mouseDownPosition;
//鼠标按下控件的位置
Point _mouseDownControlPosition;
//鼠标按下事件
private void Button_MouseDown(object sender, MouseButtonEventArgs e)
{
var c = sender as Control;
_isMouseDown = true;
_mouseDownPosition = e.GetPosition(this);
_mouseDownControlPosition = new Point(double.IsNaN(Canvas.GetLeft(c))? 0:Canvas.GetLeft(c),double.IsNaN(Canvas.GetTop(c)) ? 0 : Canvas.GetTop(c) );
c.CaptureMouse();
}
3.跟随鼠标移动
鼠标按下后移动鼠标,控件需要跟随鼠标移动。直接计算移动距离,设置Canvas.Left和Canvas.Top即可。
private void Button_MouseMove(object sender, MouseEventArgs e)
{
if (_isMouseDown)
{
var c = sender as Control;
var pos = e.GetPosition(this);
var dp = pos - _mouseDownPosition;
Canvas.SetLeft(c, _mouseDownControlPosition.X+ dp.X);
Canvas.SetTop(c, _mouseDownControlPosition.Y + dp.Y);
}
}
4.恢复标识
鼠标弹起后需要恢复标识,让控件不再跟随鼠标移动。
private void Button_MouseUp(object sender, MouseButtonEventArgs e)
{
var c = sender as Control;
_isMouseDown = false;
c.ReleaseMouseCapture();
}
二、示例
示例代码:
<Window x:Class="WpfControlMove.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:WpfControlMove"
mc:Ignorable="d"
Title="MainWindow" Height="360" Width="640">
<Canvas>
<Button Width="120" Height="50" Content="移动" PreviewMouseDown="Button_MouseDown" PreviewMouseMove="Button_MouseMove" PreviewMouseUp="Button_MouseUp"> </Button>
</Canvas>
</Window>
效果预览:
文章来源:https://www.toymoban.com/news/detail-447746.html
总结
以上就是今天要讲的内容,方法和Grid中移动的原理类似,也是使用了相对位置的计算方式,而且由于不需要判断停靠位置,位置移动的计算较为简单。文章来源地址https://www.toymoban.com/news/detail-447746.html
到了这里,关于C# wpf 实现Canvas内控件拖动的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!