在DockPanel中可以很容易地停靠在所有四个方向的内容(上,下,左,右)。这使它在许多情况下成为一个很好的选择,您希望将窗口划分为特定区域,特别是因为默认情况下,DockPanel 内的最后一个元素,除非此功能被明确禁用,否则将自动填充其余空间(中心)。
我们在 WPF 中的许多其他面板中看到的那样,您可以通过使用面板的附加属性开始利用面板的可能性,在本例中为 DockPanel.Dock 属性,它决定了您希望子控件朝哪个方向移动停靠到。如果您不使用它,第一个控件将停靠在左侧,最后一个占用剩余空间。
<Window x:Class="WpfTutorialSamples.Panels.DockPanel"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="DockPanel" Height="250" Width="250">
<DockPanel>
<Button DockPanel.Dock="Left">Left</Button>
<Button DockPanel.Dock="Top">Top</Button>
<Button DockPanel.Dock="Right">Right</Button>
<Button DockPanel.Dock="Bottom">Bottom</Button>
<Button>Center</Button>
</DockPanel>
</Window>
正如已经提到的,我们没有为最后一个孩子分配停靠位置,因为它会自动将控件居中,让它填充剩余的空间。您还会注意到中心周围的控件仅占用它们所需的空间量 - 其他一切都留给中心位置。这也是为什么您会看到右按钮比左按钮占用更多空间的原因 - 文本中的额外字符只需要更多像素。
您可能会注意到的最后一件事是空间的划分方式。例如,顶部按钮不会获得所有顶部空间,因为左侧按钮占据了它的一部分。DockPanel 通过查看它们在标记中的位置来决定支持哪个控件。在这种情况下,Left 按钮优先,因为它位于标记中的第一个位置。幸运的是,这也意味着它很容易改变,正如我们将在下一个例子中看到的,我们还通过为子控件分配宽度/高度来稍微平衡空间:
<Window x:Class="WpfTutorialSamples.Panels.DockPanel"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="DockPanel" Height="250" Width="250">
<DockPanel>
<Button DockPanel.Dock="Top" Height="50">Top</Button>
<Button DockPanel.Dock="Bottom" Height="50">Bottom</Button>
<Button DockPanel.Dock="Left" Width="50">Left</Button>
<Button DockPanel.Dock="Right" Width="50">Right</Button>
<Button>Center</Button>
</DockPanel>
</Window>
顶部和底部控件现在优先于左侧和右侧控件,并且它们在高度或宽度上都占用 50 像素。如果您使窗口变大或变小,您还会看到无论发生什么情况,此静态宽度/高度都保持不变 - 调整窗口大小时,只有中心区域的大小会增加或减少。
最后一个子元素填充
如上面所述,默认行为是 DockPanel 的最后一个子项占用其余空间,但这可以使用 LastChildFill 禁用。这是我们禁用它的示例,同时我们将展示将多个控件停靠在同一侧的能力:
<Window x:Class="WpfTutorialSamples.Panels.DockPanel"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="DockPanel" Height="300" Width="300">
<DockPanel LastChildFill="False">
<Button DockPanel.Dock="Top" Height="50">Top</Button>
<Button DockPanel.Dock="Bottom" Height="50">Bottom</Button>
<Button DockPanel.Dock="Left" Width="50">Left</Button>
<Button DockPanel.Dock="Left" Width="50">Left</Button>
<Button DockPanel.Dock="Right" Width="50">Right</Button>
<Button DockPanel.Dock="Right" Width="50">Right</Button>
</DockPanel>
</Window>
在此示例中,我们将两个控件停靠在左侧,将两个控件停靠在右侧,同时关闭 LastChildFill 属性。这给我们留下了中心的空白空间,这在某些情况下可能更可取。
推荐一款WPF MVVM框架开源项目:Newbeecoder.UI
Newbeecoder.UI开源项目
Demo下载:文章来源:https://www.toymoban.com/news/detail-447859.html
Newbeecoder.UI开源项目https://share.weiyun.com/py6W1dcK文章来源地址https://www.toymoban.com/news/detail-447859.html
到了这里,关于WPF 入门教程DockPanel介绍的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!