當在WPF中調整窗口大小時，負邊距控制會被剪切

Question

我嘗試瞭解爲什麼在縮小主窗口寬度時邊框元素會被剪切。 請看下面的代碼塊。

<Window x:Class="WpfApplication1.MainWindow" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     Title="MainWindow" Height="300" Width="500" Name="MainWin"> 
    <Grid> 
     <Grid.RowDefinitions> 
      <RowDefinition /> 
      <RowDefinition /> 
     </Grid.RowDefinitions> 

     <Border Background="Blue" Grid.Row="0" BorderBrush="Black" Width="{Binding ElementName=MainWin, Path=Width}" /> 
     <Grid Grid.Row="1" Margin="0"> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="150" /> 
       <ColumnDefinition Width="150" /> 
       <ColumnDefinition Width="*" /> 
      </Grid.ColumnDefinitions> 
      <StackPanel Grid.Column="0" Background="Black"> 
       <Border Background="White" Width="150" Height="150" BorderBrush="Black" BorderThickness="2" 
         Margin="0,-100,0,0"> 

        <TextBlock Text="{Binding ElementName=MainWin, Path=Width}" FontSize="14" FontWeight="Bold" 
           HorizontalAlignment="Center" 
           VerticalAlignment="Center" /> 

       </Border> 
      </StackPanel> 
      <StackPanel Grid.Column="1" Background="Red" /> 
      <StackPanel Grid.Column="2" Background="Yellow" /> 
     </Grid> 
    </Grid> 
</Window> 

這裏是邊境出現在原始窗口寬度是什麼：

非調整窗口

正如你可以看到邊框顯示它的容器外面，因爲在這種情況下負的上邊距爲-100。這是我期望的邊界。但是，當我減少主窗口寬度到達紅色矩形的右邊緣時，邊界的外部部分會被剪切。

大小的窗口

我曾嘗試這個邊界元素放置自定義的StackPanel它覆蓋ArrangeOverride，的MeasureOverride和GetLayoutClip方法，但被調整主窗口時不調用遺憾的是這些方法裏面。

我很感激，如果有人能解釋我是什麼原因，以及如何解決這個問題。 非常感謝。

Answer 1

基於@Marks的解釋，這裏是我的解決方案

1. 創建自定義網格和重寫的MeasureOverride方法
2. 通過此自定義網格更換內網格

CustomGrid類

public class CustomGrid : Grid 
{ 
    private double _originalHeight = 0; 

    protected override Size MeasureOverride(Size constraint) 
    { 
     Size? size = null; 
     if (constraint.Width <= 300) 
     { 
      size = new Size(constraint.Width, _originalHeight); 
     } 
     else 
     { 
      size = base.MeasureOverride(constraint); 
      _originalHeight = constraint.Height; 

     } 
     return size.Value; 
    } 

} 

XAML代碼

<Window x:Class="WpfApplication1.MainWindow" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:wpfApplication1="clr-namespace:WpfApplication1" 
    Title="MainWindow" Height="300" Width="500" Name="MainWin"> 
<Grid> 
    <Grid.RowDefinitions> 
     <RowDefinition /> 
     <RowDefinition /> 
    </Grid.RowDefinitions> 

    <Border Background="Blue" Grid.Row="0" BorderBrush="Black" Width="{Binding ElementName=MainWin, Path=Width}" /> 
    <wpfApplication1:CustomGrid Grid.Row="1"> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="150" /> 
      <ColumnDefinition Width="150" /> 
      <ColumnDefinition Width="*" /> 
     </Grid.ColumnDefinitions> 
     <StackPanel Grid.Column="0" Background="Black"> 
      <Border Background="White" Width="150" Height="150" BorderBrush="Black" BorderThickness="2" 
        Margin="0,-100,0,0"> 

       <TextBlock Text="{Binding ElementName=MainWin, Path=Width}" FontSize="14" FontWeight="Bold" 
          HorizontalAlignment="Center" 
          VerticalAlignment="Bottom" /> 

      </Border> 
     </StackPanel> 
     <StackPanel Grid.Column="1" Background="Red" /> 
     <StackPanel Grid.Column="2" Background="Yellow" /> 
    </wpfApplication1:CustomGrid> 
</Grid> 

Answer 2

1. 你結合藍色邊框的Width到主窗口的Width。 未來：如果你想綁定到任何FrameworkElement的寬度綁定到它的ActualWidth屬性。

2. WPF繪製其內容的順序完全依賴於包含控件。我會說在你的情況下，外Grid繪製其子需要更新他們所定義的順序。所以，只要內部網格隨着邊界一起變化，你就可以走了。只要第三列的Width發生變化，情況就是如此。一旦它在0沒有更多的變化，所以它不會更新。

3. （2）是炒作=）

4. 不做（1），有沒有必要爲它

5. 使用一個網格

一些XAML：

<Grid> 
    <Grid.RowDefinitions> 
     <RowDefinition /> 
     <RowDefinition /> 
    </Grid.RowDefinitions>   
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="150" /> 
      <ColumnDefinition Width="150" /> 
      <ColumnDefinition Width="*" /> 
     </Grid.ColumnDefinitions> 
    <Border Background="Blue" BorderBrush="Black" Grid.ColumnSpan="3"/> 
    <StackPanel Grid.Column="0" Grid.Row="1" Background="Black" > 
     <Border Background="White" Width="150" Height="150" BorderBrush="Black" BorderThickness="2" Margin="0,-100,0,0"> 
     <TextBlock Text="{Binding ElementName=MainWin, Path=ActualWidth}" FontSize="14" FontWeight="Bold" 
          HorizontalAlignment="Center" 
          VerticalAlignment="Center" /> 
     </Border> 
    </StackPanel> 
    <StackPanel Grid.Column="1" Grid.Row="1" Background="Red" /> 
    <StackPanel Grid.Column="2" Grid.Row="1" Background="Yellow" />   
</Grid>