限制最大寬度

Question

我有定義的標準WPF格柵2列爲：

<Grid> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="*" MinWidth="200" /> 
     <ColumnDefinition Width="Auto" /> 
    </Grid.ColumnDefinitions> 
    ... 
</Grid> 

我想要實現的是，第二列被自動調整大小基於其內容和第一列獲取所有剩餘空間。不過，我也希望第一列永遠不會少於200像素。問題是，使用這種配置，我的自動列將被切斷，而不是被調整大小。

我真正想要的是WPF首先爲第一列分配200個像素，然後佔用所有剩餘空間並請求第二列的內容以剩餘寬度的最大大小限制自行調整大小。如果內容需要較少的空間，則應將剩餘空間分配給第一列（使其大於200像素）。

使用案例：我的第二列是一個具有固定高寬比的圖像，因此對於給定的高度，存在最佳寬度。我也有第一欄，其中一些控件應始終可見。如果有更多的空間可用，我希望將空間分配給第一列而不是第二列。

有沒有一種方法來實現這與默認的WPF控件或我需要寫我自己的網格呢？

Answer 1

我看到第二列被切斷的唯一時間是列2 + 200的寬度大於網格的寬度。我打得周圍，也許這是你的解決方案：

<Grid Height="200" 
     Width="600"> 
    <Grid.ColumnDefinitions> 
    <ColumnDefinition Width="*" 
         MinWidth="200" /> 
    <ColumnDefinition Width="Auto" /> 
    </Grid.ColumnDefinitions> 
    <Border Background="Blue" 
      Grid.Column="0" /> 
    <Viewbox Grid.Column="1" 
      Stretch="Uniform" 
      MaxWidth="400"> 
    <Border Background="Yellow" 
      BorderBrush="Red" 
      BorderThickness="4" 
      Height="200" 
      Width="300" /> 
    </Viewbox> 
</Grid> 

我試着寫<ColumnDefinition Width="Auto" MaxWidth="400"/>但maxwidth都沒有效果呢。

視圖框的最大寬度以總寬度計算 - 保留的200如果不明顯。

Answer 2

這聽起來像你想要的基本上有2個不同的模式爲您的第二列。當整個圖像有足夠的空間顯示在當前的高度時，它應該是自動的，否則應該在獲得第一列200後留下剩餘空間。要進行這種模式切換，您可以使用轉換器並將寬度綁定到列。

在這裏，您有2個基本輸入：可用於網格的總大小以及圖像的所需寬度。既然你需要他們，你需要一個IMultiValueConverter。這是一個基本的實現來計算開關上述：

public class AutoColumnConverter : IMultiValueConverter 
{ 
    public object Convert(object[] values, Type targetType, object parameter, CultureInfo culture) 
    { 
     double imageWidth = values.OfType<double>().FirstOrDefault(); 
     double gridWidth = values.OfType<double>().ElementAtOrDefault(1); 
     int minWidth = System.Convert.ToInt32(parameter); 

     double availableSpace = gridWidth - minWidth; 
     if (imageWidth > availableSpace) 
      return new GridLength(availableSpace, GridUnitType.Pixel); 

     return new GridLength(0, GridUnitType.Auto); 
    } 

    public object[] ConvertBack(object value, Type[] targetTypes, object parameter, CultureInfo culture) 
    { 
     throw new NotImplementedException(); 
    } 
} 

要使用這個你需要用你的網格中，你可以結合的，而不是網格本身，這將從根本上撒謊可用空間的另一個元素它並嘗試用兩個定義的列進一步擴展。這裏我使用Source.Width來查找圖像所需的寬度。如果您更關心寬高比或者想要考慮高度，您可能需要調整。

<Border> 
    <Grid> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="*" MinWidth="200" /> 
      <ColumnDefinition> 
       <ColumnDefinition.Width> 
        <MultiBinding ConverterParameter="200"> 
         <MultiBinding.Converter> 
          <local:AutoColumnConverter/> 
         </MultiBinding.Converter> 
         <Binding ElementName="Img" Path="Source.Width"/> 
         <Binding RelativeSource="{RelativeSource Mode=FindAncestor, AncestorType={x:Type Border}}" Path="ActualWidth"/> 
        </MultiBinding> 
       </ColumnDefinition.Width> 
      </ColumnDefinition> 
     </Grid.ColumnDefinitions> 

     <Image x:Name="Img" Grid.Column="1" Stretch="Uniform" StretchDirection="DownOnly" 
       Source="..."/> 
    </Grid> 
</Border>