WPF 简单绘制矩形

Canvas 画矩形:

view和viewModel 绑定一起才显示移动轨迹(可以定义一个string 看是否绑定属性的路径是正确的)

前台(绑定事件和显示移动的线):

XML 复制代码
<Canvas Name="canvas" Background="#01FFFFFF" 
	PreviewMouseLeftButtonDown="VDM_MouseLeftButtonDown" 
	PreviewMouseMove="VDM_MouseMove"
	PreviewMouseLeftButtonUp="VDM_MouseLeftButtonUp">
</Canvas>

<Canvas>
	<Rectangle IsHitTestVisible="False" Stroke="Red" x:Name="rect"
		   StrokeDashArray="1,2" StrokeThickness="1" Stretch="Fill" 
		   Width="{Binding RectWidth}" 
		   Height="{Binding RectHeight}" 
		   Canvas.Left="{Binding RectLeft}" 
		   Canvas.Top="{Binding RectTop}"
		   />
</Canvas>

后台:

若view和其他viewmodel绑定了 可以用(rect.DataContext = Model; DVMModel Model = new DVMModel(); DVMModel属性定义)

如果view和后台绑定:

cs 复制代码
bool is_LeftButtonDown = false;
 public void VDM_MouseLeftButtonDown(object view, MouseButtonEventArgs e)
{
	Canvas canvas = view as Canvas;
	Point pt = Mouse.GetPosition(canvas);
	downPt = pt;
	is_LeftButtonDown = true;
	if (pt.X < 0 || pt.X > canvas.ActualWidth || pt.Y < 0 || pt.Y > canvas.ActualHeight)
	{
		is_LeftButtonDown = false;
	}
}

鼠标移动绘制矩形

cs 复制代码
public void VDM_MouseMove(object view, MouseEventArgs e)
{
	//鼠标坐标点
	Point pt = Mouse.GetPosition(view as Canvas);
	if (is_LeftButtonDown && e.LeftButton == MouseButtonState.Pressed)	//确定鼠标左键处于按下状态
	{
		isMove = true;
		if (pt.X < 0 || pt.X > canvas.ActualWidth || pt.Y < 0 || pt.Y > canvas.ActualHeight)
		{
			is_LeftButtonDown = false;
			Model.RectHeight = 0;
			Model.RectWidth = 0;
		}
		else
		{
			double left = (downPt.X < pt.X) ? downPt.X : pt.X;
			double top = (downPt.Y < pt.Y) ? downPt.Y : pt.Y;
			double width = Math.Abs(downPt.X - pt.X);
			double height = Math.Abs(downPt.Y - pt.Y);

			// 画矩形
			Model.RectLeft = left;
			Model.RectTop = top;
			Model.RectWidth = width;
			Model.RectHeight = height;
			canvas.CaptureMouse();	//捕获鼠标
		}
	}
}

鼠标弹起完成矩形绘制

cs 复制代码
public void VDM_MouseLeftButtonUp(object view, MouseButtonEventArgs e)
{
	Canvas canvas = view as Canvas;
	if (is_LeftButtonDown && isMove)
	{
		is_LeftButtonDown = false;
		isMove = false;
		Point pt = Mouse.GetPosition(canvas);

		double Wscale = canvas.ActualWidth / SingalSize.Width;		//SingalSize 分辨率
		double Hscale = canvas.ActualHeight / SingalSize.Height;

		double left = (downPt.X < pt.X) ? downPt.X : pt.X;
		double top = (downPt.Y < pt.Y) ? downPt.Y : pt.Y;
		double width = Math.Abs(pt.X - downPt.X);
		double height = Math.Abs(pt.Y - downPt.Y);

		OsdStartX.Text = Convert.ToInt32(left).ToString();
		OsdStartY.Text = Convert.ToInt32(top).ToString();

		if (width * Wscale > 512)
			HLength.Text = "512";
		else
			HLength.Text = Convert.ToInt32(width * Wscale).ToString();

		if (height * Hscale > 64)
			VLength.Text = "64";
		else
			VLength.Text = Convert.ToInt32(height * Hscale).ToString();
		// 画矩形
		Model.RectHeight = 0;
		Model.RectWidth = 0;
		canvas.ReleaseMouseCapture();	//释放捕获鼠标
	}
}
相关推荐
Bofu-1 小时前
【Storage存储测试】07-WPF 通过 WMI + NVMe SMART 实现 SSD 规格自动验证
wpf·nvme·wmi·smart·ssd检测
Bofu-6 小时前
【键盘测试】05-WPF 可视化键盘布局配置 + 全局钩子按键检测实战
wpf·键盘测试·全局键盘钩子·scancode·组合键检测
bugcome_com6 小时前
WPF 路径动画完全指南:自绘制控件实战
wpf
不会编程的懒洋洋2 天前
WPF 性能优化+异步+渲染
开发语言·笔记·性能优化·c#·wpf·图形渲染·线程
求学中--3 天前
状态管理一文通:@State、@Prop、@Link、@Provide/Consume全解析
人工智能·小程序·uni-app·wpf·harmonyos
雨浓YN4 天前
GKTGD 工业监控系统-00设计文档
wpf
秋の本名5 天前
第一章 鸿蒙生态架构与开发理念
华为·wpf·harmonyos
Bofu-5 天前
【音频测试】03-WPF 实现声道自动验证 + Whisper 语音识别录音检测
c#·whisper·wpf·音视频·音频测试·naudio 声道控制