WPF DockPanel第一个子元素使用剩余空间

Question

我有一个窗口，里面有一些 DockPanel 列表，用来指定一些文件。每个 DockPanel 都有一个文本框（用于路径）和一个按钮（用于浏览文件）。

我在这里重新创建了一个简单的 WPF 页面以演示问题：

<Page
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Width="150"
    Height="22">
    <DockPanel>
        <TextBox HorizontalAlignment="Stretch"/> <!-- path to file -->
        <Button Content="..." DockPanel.Dock="Right"/> <!-- button to browse for file -->
    </DockPanel>
</Page>

问题在于我希望按钮位于文本框的右侧，但这会使得文本框非常小。因为DockPanel的LastChild是按钮，会占用剩余的空间。我已经尝试通过重新排列并设置LastChildFill="False"来改变这种情况，但这只会使按钮再次变小，而不是使文本框变宽（即使使用HorizontalAlignment="Stretch"也是如此）。

我之所以想要以那种顺序控制是因为我希望用户在使用tab键在窗口中导航时先到达文本框，然后再到达按钮。我研究了设置TabIndex，但这感觉很玩票。WPF的一个喜欢的功能是TabIndex按照在XAML中定义控件的顺序进行排序。更不用说我可能需要手动设置窗口中的每个控件的TabIndex。

对我来说，似乎并没有遵守TextBox.HorizontalAlignment的设置。 如何使第一个控件使用尽可能多的空间，但仍然保留选项卡顺序？

- Mizipzor

Answer 1

请将它修改为这样：

<DockPanel LastChildFill="True">
    <Button Content="..." DockPanel.Dock="Right"/> <!-- button to browse for file -->
    <TextBox DockPanel.Dock="Left" HorizontalAlignment="Stretch"/> <!-- path to file -->
</DockPanel>

- Jonathan Barez

---

太棒了！完全不直观和讨厌，但是效果很好，并且考虑到DockPanel的设计，有一种奇怪的合理感。做得好。 - TonganJedi

我曾多次见过这种情况。我最担心的是XAML中元素的顺序不再与窗口的视觉布局相匹配，这会破坏选项卡的顺序。 - Christoffer Lette

我同意@ChristofferLette +1的观点，但以防万一有人需要，这里是解决taborder问题的解决方法。这可能需要相当多的手动工作，并且并不总是有效（例如在DataGrid中）：https://dev59.com/xXA65IYBdhLWcg3w8zft#4808810 - surfen

太好了！我遇到了类似的问题，但没意识到子元素的顺序与视觉顺序不一致，这个解决方法对我很有帮助。 - Nathan Dace

这是在基本上下文中完成的（一个拉伸的顶部区域和一个底部区域），选项卡顺序非常好。也许问题只会在某些条件下出现？ - Chris

Answer 2

如果你不想使用 DockPanel 的行为，就不要使用 DockPanel。

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition/>
        <ColumnDefinition Width="Auto"/>
    </Grid.ColumnDefinitions>

    <TextBox />
    <Button Content="..." Grid.Column="1"/>
</Grid>

- John Bowen

---

因为它没有 TabOrder 问题，所以我点了 +1。如果任何人想避免在这种简单情况下输入 ColumnDefinitions，请看一下这个解决方案：http://rachel53461.wordpress.com/2011/09/17/wpf-grids-rowcolumn-count-properties/ - surfen