XAML - 無法在這種情況下將元素大小調整爲0寬度

Question

鑑於以下XAML，我的目標是始終保持列AAA，BBB，CCC始終可見。具有列表框的列可以一直調整到零。

如果我刪除列表框，那麼應用程序的工作方式就是我想要的。也就是說，它沒有遵守最小寬度的怪異行爲。

隨着列表框（或DataGrid中）以下XAML有此行爲：

啓動應用程序後，如果我拖動splitterA一路接近BBB（BBB將保持25所需的寬度），然後將分離器B一直拖到右邊，那麼AAA將具有期望的寬度25.

另一方面，在啓動應用程序後，如果將splitterA一直拖到右側（AAA將保持所需的寬度25），然後拖動splitterB一直到右側，那麼AAA將離開屏幕。令人驚訝的是，如果我然後拖動splitterA只是一個像素向左，那麼兩列將「捕捉」到正確的位置。

<Grid Background="CadetBlue" > 
    <Grid.ColumnDefinitions> 
    <ColumnDefinition Width="Auto"/> 
    <ColumnDefinition /> 
    <ColumnDefinition MinWidth="60"/> 
    </Grid.ColumnDefinitions> 
    <TextBlock Text="CCC" Width="25" /> 
    <ListBox Grid.Column="1" /> 
    <GridSplitter Width="5" Grid.Column="2" Name="splitterB" HorizontalAlignment="Left" /> 
    <Grid Background="Aqua" Grid.Column="2" Margin="5,0,0,0" > 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="Auto"/> 
     <ColumnDefinition /> 
     <ColumnDefinition MinWidth="30"/> 
    </Grid.ColumnDefinitions> 
    <TextBlock Text="BBB" Width="25" /> 
    <ListBox Grid.Column="1" /> 

    <GridSplitter Width="5" Grid.Column="2" Name="splitterA" HorizontalAlignment="Left" /> 
    <Grid Background="BurlyWood" Grid.Column="2" Margin="5,0,0,0" > 
     <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="Auto" /> 
     <ColumnDefinition /> 
     </Grid.ColumnDefinitions> 
     <TextBlock Text="AAA" Width="25" /> 
     <ListBox Grid.Column="1" /> 
    </Grid> 
    </Grid> 
</Grid> 

爲什麼當我刪除列表框？

注意：我稍微修改了問題和XAML代碼，以澄清事情並顯示我剛纔發現的有關列表框的內容。

Answer 1

這是一個WPF錯誤：

https://connect.microsoft.com/VisualStudio/feedback/details/636072/msdn-forum-grid-layout-issue-with-minwidth-starsizing

http://social.msdn.microsoft.com/Forums/en/wpf/thread/24460784-7d09-4627-89fe-975e0ca7b303

我周圍有一個黑客。如果任何人有一個更好的解決方案我很想聽聽它...

XAML：

<Grid Background="CadetBlue" > 
    <Grid.ColumnDefinitions> 
    <ColumnDefinition Width="Auto"/> 
    <ColumnDefinition /> 
    <ColumnDefinition MinWidth="60"/> 
    </Grid.ColumnDefinitions> 
    <TextBlock Text="CCC" Width="25" /> 
    <ListBox Grid.Column="1" /> 
    <GridSplitter Width="5" Grid.Column="2" Name="splitterB" HorizontalAlignment="Left" DragDelta="splitterB_DragDelta" /> 
    <Grid Background="Aqua" Grid.Column="2" Margin="5,0,0,0" > 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="Auto"/> 
     <ColumnDefinition Name="bbbColumn"/> 
     <ColumnDefinition MinWidth="30"/> 
    </Grid.ColumnDefinitions> 
    <TextBlock Text="BBB" Width="25" /> 
    <ListBox Grid.Column="1" Name="bbbListBox" /> 

    <GridSplitter Width="5" Grid.Column="2" Name="splitterA" HorizontalAlignment="Left" DragDelta="splitterA_DragDelta" /> 
    <Grid Background="BurlyWood" Grid.Column="2" Margin="5,0,0,0" > 
     <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="Auto" /> 
     <ColumnDefinition /> 
     </Grid.ColumnDefinitions> 
     <TextBlock Text="AAA" Width="25" /> 
     <ListBox Grid.Column="1" /> 
    </Grid> 
    </Grid> 
</Grid> 

代碼：

private void ToggleWidths() 
{ 
    if (bbbColumn.ActualWidth < 10 
    && bbbListBox.Visibility != System.Windows.Visibility.Collapsed) 
    bbbListBox.Visibility = System.Windows.Visibility.Collapsed; 
    else if (bbbColumn.ActualWidth >= 10 
    && bbbListBox.Visibility != System.Windows.Visibility.Visible) 
    bbbListBox.Visibility = System.Windows.Visibility.Visible; 
} 

private void splitterA_DragDelta(object sender, System.Windows.Controls.Primitives.DragDeltaEventArgs e) 
{ 
    ToggleWidths(); 
} 

private void splitterB_DragDelta(object sender, System.Windows.Controls.Primitives.DragDeltaEventArgs e) 
{ 
    ToggleWidths(); 
} 

Answer 2

我一直在玩弄一點點的代碼，看起來你的主要問題在於你的GridSplitters沒有自己的列。

GridSplitter的工作方式是立即調整列的左側和右側。因此，爲GridSplitter添加一個額外的列將不會完全削減它，因爲您的Grid中將有4列，並且需要影響分離器左側的兩列。所以我會建議把它們放在一個額外的網格中。

的另一個問題是50，你對外部電網不佔GridSplitter的寬度MinWidth，所以它應該是55

看起來這整個事情可以更清晰地完成，但因爲我不知道你要完成什麼，我一直在你的代碼完整的「精神」，並更新了一些東西：

<Grid Background="CadetBlue"> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition MinWidth="50" Width="Auto"/> 
     <ColumnDefinition Width="3*"/> 
     <ColumnDefinition MinWidth="55" Width="5*"/> 
    </Grid.ColumnDefinitions> 
    <TextBlock Text="CCC" /> 
    <ListBox Grid.Column="0"/> 
    <GridSplitter Width="5" Grid.Column="1" /> 
    <Grid Background="Aqua" Grid.Column="2"> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition MinWidth="25"/> 
      <ColumnDefinition Width="3*"/> 
      <ColumnDefinition MinWidth="25" Width="5*" /> 
     </Grid.ColumnDefinitions> 
     <TextBlock Text="BBB"/> 
     <ListBox Margin="0,20,10,20"/> 
     <GridSplitter Width="5" Grid.Column="1" /> 
     <Grid Background="BurlyWood" Grid.Column="2"> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="Auto" /> 
       <ColumnDefinition Width="*"/> 
      </Grid.ColumnDefinitions> 
      <TextBlock Text="AAA" Width="25" /> 
      <ListBox Margin="0,20,10,20" Grid.Column="1" /> 
     </Grid> 
    </Grid> 
</Grid> 

希望這有助於！