真・WPF 按钮拖动和调整大小

真・WPF 按钮拖动和调整大小

真・WPF 按钮拖动和调整大小

独立观察员 2020 年 8 月 29 日

手头有个 Winform 程序，是使用动态生成按钮，然后拖动、调整大小，以此来记录一些坐标数据，最后保存坐标数据的。

在数据量（按钮数量）比较小的时候是使用得挺愉快的，但是，当按钮数上去之后，比如达到四五百个按钮，那就比较痛苦了。具体来说就是，无论是移动窗口，还是拖动滚动条，或者是最小化窗口再还原，都会引起界面重绘，表现为按钮一个接一个地出现。

经过实测，与电脑的性能和 GPU 都没有关系，网上针对 Winform 这个问题的解决方案，比如开启双缓冲等，都大致尝试了，并无任何起色，反而可能更糟。所以就像网友所说，这个要么不要在同一个界面上放置太多控件；要么使用 WPF，毕竟 WPF 采用的是 DirectX 作为底层绘图引擎，而 Winform 则采用传统的 GDI 。由于业务需求，不让在界面上放置过多控件的方案不太可行，或者说暂未想到有什么变通的办法，所以决定改版为 WPF 试试。

 

经过几天的改造，原 Winform 版软件的一小部分功能已改版为 WPF 版，而且成果喜人，同样的按钮数量，现在无论怎样折腾，这几百个按钮就如同钉在了界面上一样，不再能看到他们载入的过程了。在这个改造的过程中，我是将 Winform 版软件中关于按钮拖动和调整大小的代码改造为 WPF 版的，听上去挺简单的，但是还是碰到了一些问题，比如 WPF 屏蔽了鼠标左键的一些事件，需要额外处理一下，还有的就是关于坐标定位的一些问题了，下面将给出一些关键代码，和大家相互交流学习一下。

 

首先，先上一道小菜，解决一下 WPF 按钮控件（Button）中文字自动换行的问题。

不对，还是先看看 Demo 的界面结构吧：

 

其它控件和布局就不说了（最后会给出 Demo 地址），关键的是中间这个 ScrollViewer 包裹的 Canvas，我们生成的按钮都是在这个 Canvas 上的，拖动和调整大小也是。Winform 的布局是依赖于坐标的，WPF 的布局控件则基本是不使用坐标定位的，甚至都不推荐指定大小，而只有 Canvas 布局控件保留了以坐标定位的模式，正好适合我们的需求（之前 Winform 版使用的是 Panel 控件）。

可以看到里面我还注释了一个 Button ，这个就是用来演示我们的 “小菜” 问题（按钮文字自动换行）的。我们先把注释放开，并且只保留其宽和高的设置：

 

可以看到当按钮宽度窄于文本内容时，文本内容并不能进行自动换行，且 Button 控件并没有相关属性进行设置。解决方法就是在按钮中添加 TextBlock 控件，然后设置其 TextWrapping 属性，当然，这里我们不直接这样写，而是使用内容模板：

<Button Width="38" Height="75" ContentTemplate="{DynamicResource DataTemplateButtonWrap}">1A005</Button>

 

这个模板的资源放在 App.xaml 中：

<Application.Resources> <DataTemplate x:Key="DataTemplateButtonWrap" DataType="Button">  <Grid>   <TextBlock TextWrapping="Wrap" Text="{TemplateBinding Content}"></TextBlock>  </Grid> </DataTemplate></Application.Resources>

 

TextBlock 中使用了 TemplateBinding 将 Button 的 Content “绑架” 到了自己的 Text 中，哈哈。看看效果：

 

至于后台动态绑定资源则是使用 SetResourceReference 方法，后面代码里也有体现。

 

好了，小菜吃完了，开始吃主菜吧：

#region 成员private Control _control;private int _btnNum = 0;