带有 GridSplitter 的网格不考虑第二列的最小宽度

Question

我是 WPF 新手，遇到了一个小但令人沮丧的问题。

我有一个两行两列的网格。第一行包含一个菜单栏，第二行包含左侧的一列（包含一个列表框）和右侧的一列（包含一个列表框）。

它还包含一个 GridSplitter 来处理调整两列的大小。这个界面我自然只想要一个GridSplitter。

我将第一列的最小宽度设置为 260 像素，效果很好。我无法调整低于 260 像素的列的大小。但是，对于第二列（右侧的那一列），它根本不考虑最小宽度属性。

我可以调整它的大小，使其完全不可见。

我在这里做错了什么？

XAML 如下：

谢谢

<Window x:Class="MyProject.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:MyProject"
        mc:Ignorable="d"
        Title="MainWindow" Width="800" Height="600" Background="Black" MinWidth="800" MinHeight="600" Icon="/MyProject;component/Images/Porgram Icons/Icon1.ico">
    <Window.Resources>
        <ItemsPanelTemplate x:Key="ItemsPanelTemplate1">
            <WrapPanel />
        </ItemsPanelTemplate>
        <ItemsPanelTemplate x:Key="ItemsPanelTemplate2">
            <StackPanel/>
        </ItemsPanelTemplate>
    </Window.Resources>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="20"/>
            <RowDefinition />
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="260" MinWidth="260"/>
            <ColumnDefinition MinWidth="450"/>
        </Grid.ColumnDefinitions>

        <Menu Width="Auto" Height="20" Background="#272822" Foreground="#FFFFFF" DockPanel.Dock="Top" Grid.Row="0" Grid.ColumnSpan="2">
            <MenuItem Header="_File" Background="#272822" Foreground="#FFFFFF" BorderBrush="Black">
                <MenuItem Header="Quit" Background="#272822"/>
                <Separator />
            </MenuItem>
        </Menu>

        <ListBox x:Name="listBox1" ItemsPanel="{DynamicResource ItemsPanelTemplate2}" ScrollViewer.HorizontalScrollBarVisibility="Disabled" BorderThickness="0" Background="#272822" Grid.Column="0" Grid.Row="1" MinWidth="110" VerticalContentAlignment="Top" ScrollViewer.VerticalScrollBarVisibility="Hidden"/>

        <GridSplitter Width="5" Background="#272824" Grid.Column="0" Grid.Row="1"/>

        <Border CornerRadius="10" BorderBrush="#272824" 
              BorderThickness="1" Grid.Column="1" Grid.Row="1">
            <ListBox x:Name="listBox2" ItemsPanel="{DynamicResource ItemsPanelTemplate1}" ScrollViewer.HorizontalScrollBarVisibility="Disabled" BorderThickness="1" Background="#272822" Grid.Row="1" Grid.Column="1"/>
        </Border>
    </Grid>
</Window>

Answer 1

你会发现这个效果好多了...

    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="30*" MinWidth="260"/>
        <ColumnDefinition Width="70*" MinWidth="450"/>
    </Grid.ColumnDefinitions>

我不清楚为什么您的定义不起作用。第一列的固定宽度似乎使拆分器感到困惑。

最佳做法是将拆分器放在自己的列中。

    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="30*" MinWidth="260"/>
        <ColumnDefinition Width="5"/>
        <ColumnDefinition Width="70*" MinWidth="450"/>
    </Grid.ColumnDefinitions>
    <GridSplitter Width="5" Background="#272824" Grid.Column="1" Grid.Row="1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"/>

Answer 2

在column 或row 中使用GridSplitter，如下所示，

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="20"/>
        <RowDefinition />
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="260" MinWidth="260"/>
        <ColumnDefinition Width="5"/>
        <ColumnDefinition MinWidth="260"/>
    </Grid.ColumnDefinitions>

  //First Control in Column 0

  <GridSplitter Width="5" Grid.Column="0" Grid.Row="1"/>// Splitter in column 1

  //Second Control in column 2

</Grid>