需要棘手的 Wpf 布局

Question

我需要一个布局，当我通过移动它的右边缘来减小 window 宽度时，首先灰色部分的宽度减小到 0，只有在白色部分的宽度开始减小之后。我尝试使用 DockPanel 和 Grid 来做到这一点，但没有成功。

更新：白色部分的宽度取决于用户数据，无法固定。

Answer 1

您可以将白色部分设置为固定宽度，将灰色部分设置为动态宽度。

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="500"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    ...
</Grid>

然而，当 Window 的宽度小于 500 时，这不会动态调整第一列的宽度。也许不是最优雅的解决方案，但它是一个开始。

Answer 2

DockPanel 中的最后一个元素将跨越到可用 space。毕竟没那么棘手。

<Grid Background="LightGray">
    <DockPanel Background="White" HorizontalAlignment="Left">
        <TextBlock Text="Element 1"/>
        <TextBlock Text="Element 2"/>
        <TextBlock DockPanel.Dock="Right" Text="Element N" MinWidth="100"/>
        <TextBlock Text="Element with variable width, can be less than text"/>
    </DockPanel>
</Grid>

需要棘手的 Wpf 布局

Need tricky Wpf layout

wpf

layout

resize

width