调整自定义 WPF 窗口大小

• 下载演示 - 61.63 KB

引言

在本文中，我将向您展示如何启用自定义/透明WPF窗口的调整大小功能。本文是对一篇先前文章《调整自定义窗口大小》的后续，在该文章中，我描述了如何通过处理矩形对象的鼠标事件来调整自定义窗口的大小。
对于不熟悉创建自定义WPF窗口的用户，Kirupa Chinnathambi在他的博客上写了一篇很棒的文章，您可以在此处访问。

背景

在本文中，我采用了不同的方法来解决大小调整问题，使用了Thumb控件。Thumb控件是最适合调整其他控件大小的控件。通过使用Thumb控件，编码比我第一篇文章中采用的方法要简单得多。

为了调整大小，我将专门处理Thumb控件的DragDelta事件。当Thumb控件获得焦点并捕获鼠标时，会多次引发DragDelta事件。当用户按下鼠标左键时，Thumb控件会获得焦点并捕获鼠标。

步骤 1

我们将从设计自定义窗口并放置必要的控件开始。

1. 启动Expression Blend并创建一个名为“Custom Win Resize”的新WPF项目。确保语言设置为Visual Basic。
2. 在“对象和时间线”中选择“窗口”元素。在“属性”面板的“布局”部分，将宽度设置为400，高度设置为300。
3. 在“外观”部分勾选AllowsTransparency复选框。
4. 在“画笔”部分，将Background属性设置为No Brush。现在窗口应该显得为空白。

5. 在“布局”面板中，点击“显示高级属性” 按钮，并将MinWidth设置为200，MinHeight设置为100。
6. 在工具箱中双击“矩形”工具。这会在LayoutRoot中放置一个矩形。
7. 在“对象和时间线”中右键单击矩形，然后选择AutoSize > Fill。
8. 在工具箱中单击选择工具，以显示矩形的调整大小手柄。使用角落的调整大小手柄可以使矩形呈现圆角。

9. 在“属性”面板的“外观”部分，将StrokeThickness设置为2。确保描边是黑色实心画笔。
10. 在“资源”面板的搜索框中，键入“thumb”一词。当您开始键入时，会显示几个工具选项。选择thumb工具。
11. 在LayoutRoot的顶部绘制一个thumb对象。

12. 确保其VerticalAlignment设置为Top，左边距和右边距设置为14。上边距应为零。

13. 将thumb对象重命名为‘TopThumb’，并在CommonProperties部分将其光标设置为SizeNS。
14. 在仍然选中TopThumb的情况下，复制粘贴一个新的thumb对象。将新thumb对象的VerticalAlignment设置为Bottom。
15. 将新thumb对象重命名为‘BtmThumb’。
16. 在LayoutRoot的右边缘绘制另一个thumb对象。

17. 确保HorizontalAlignment设置为Right，右边距为零，并且上边距和下边距设置为14。

18. 将thumb对象重命名为‘RgtThumb’，并将其光标设置为SizeWE。
19. 选中RgtThumb后，复制粘贴一个thumb控件。将其HorizontalAlignment设置为Left，并将其重命名为‘LftThumb’。保存您的工作。

第二步

现在，让我们提供必要的代码来实现自定义窗口的大小调整。代码将在Blend的代码编辑器中完成。

1. 选择TopThumb，然后在“属性”面板中单击“事件”按钮。

   .

2. 在DragDelta事件文本框中键入‘Top_DragDelta’，然后按Enter键。

3. 在Blend的代码编辑器中，在TopThumb的DragDelta事件处理程序中键入以下代码：

      If Me.Height > Me.MinHeight Then 
         Me.Height -= e.VerticalChange
         Me.Top += e.VerticalChange
      Else 
         Me.Height = Me.MinHeight + 4 
         TopThumb.ReleaseMouseCapture()
      End If 

4. 切换回设计器窗口，选择BtmThumb。在DragDelta事件文本框中，键入‘Btm_DragDelta’，然后按Enter键。在事件处理程序中键入以下代码：

      If Me.Height > Me.MinHeight Then 
        Me.Height += e.VerticalChange
      Else 
        Me.Height = Me.MinHeight + 4 
        BtmThumb.ReleaseMouseCapture()
      End If

5. 切换回设计器窗口，选择RgtThumb。在DragDelta事件文本框中键入‘Rgt_DragDelta’，然后按Enter键。键入以下代码：

      If Me.Width > Me.MinWidth Then 
        Me.Width += e.HorizontalChange
      Else 
        Me.Width = Me.MinWidth + 4 
        RgtThumb.ReleaseMouseCapture()
      End If

6. 切换回设计器窗口，选择LftThumb。在DragDelta事件文本框中键入‘Lft_DragDelta’，然后按Enter键。在LftThumb的DragDelta事件处理程序中键入以下代码：

      If Me.Width > Me.MinWidth Then 
        Me.Width -= e.HorizontalChange
        Me.Left += e.HorizontalChange
      Else 
        Me.Width = Me.MinWidth + 4 
        LftThumb.ReleaseMouseCapture()
      End If

7. 切换回设计器窗口，并将所有thumb对象的不透明度设置为零。您可以在“对象和时间线”中进行多选，一次更改所有thumb控件的不透明度。

选择“窗口”元素，在“属性”面板的“通用属性”部分，将WindowStartupLocation设置为CenterScreen。运行项目。尝试调整自定义窗口的顶部、底部、左侧和右侧边缘的大小。
请注意，在调整自定义窗口的顶部和左侧边缘大小时，会出现闪烁。发生这种情况是因为应用程序无法像鼠标事件触发那样快地调整客户端区域的大小。在某些标准窗口中也会出现闪烁。按ALT+F4关闭应用程序。

结论

希望这篇文章有所帮助。如果您还没有阅读我关于调整自定义窗口大小的第一篇文章，请阅读它，以了解解决此问题的另一种方法。