MaxWidth的'自動'？

Question

我試圖創建一個網格，處理不同大小的屏幕。我的代碼目前看起來是這樣的：

<Grid> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="*"/> 
     <ColumnDefinition Width="Auto"/> 
    </Grid.ColumnDefinitions> 
    <TextBlock Grid.Column="0" ... /> 
    <TextBlock Grid.Column="1" ... /> 
</Grid> 

，因爲我結束了在第一列的最後一個巨大的空白，當我在全屏我這不正常，我想在每一個文本列相鄰。但是，當我縮小/調整屏幕大小時，它會正確縮小第一列。

我也使用這樣的代碼嘗試：

<Grid> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="Auto"/> 
     <ColumnDefinition Width="Auto"/> 
    </Grid.ColumnDefinitions> 
    <TextBlock Grid.Column="0" ... /> 
    <TextBlock Grid.Column="1" ... /> 
</Grid> 

這個代碼看上去很完美，當應用程序是全屏，但是當我縮小/調整屏幕的第一列將不縮小以適合。它使我的網格保持相同的大小，這會將我的文本從較小的屏幕推出。

如何限制「自動」大小的寬度，並仍然調整其大小，如'*'？

Answer 1

我怎麼能蓋住內對齊文本塊舒展寬度在任何大小「自動」將是，並仍然有它調整大小，如'*'？

根據Define page layouts with XAML，Auto意味着該列將大小以適應其內容，*裝置計算自動列之後，列獲得剩餘的寬度的一部分。

Width的ColumnDefinition不能設置爲Auto以及*。但是，因爲您的問題是在將Auto設置爲ColumnDefinition時，它會將您的文本從較小的屏幕中彈出，因此我們可能使用AdaptiveTrigger。默認情況下，我們可以將Width設置爲*，這可以確保調整大小不會切斷文本。當窗口調整爲較大的大小而不會導致文本被截斷時，AdaptiveTrigger可以幫助將Width屬性從*更改爲Auto。例如：

<Grid 
    Background="Azure" 
    BorderBrush="Pink" 
    BorderThickness="2"> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition x:Name="col1" Width="*" /> 
     <ColumnDefinition Width="Auto" /> 
    </Grid.ColumnDefinitions> 
    <TextBlock   
     Grid.Column="0"   
     Foreground="Blue" 
     Text="layouttest1layouttest1layouttest1layou" 
     TextWrapping="Wrap" /> 
    <TextBlock  
     Grid.Column="1"   
     Foreground="Red" 
     Text="layouttest2layouttest2layouttest2layouttest2layout" 
     TextWrapping="Wrap" /> 
    <VisualStateManager.VisualStateGroups> 
     <VisualStateGroup> 
      <VisualState> 
       <VisualState.StateTriggers> 
        <AdaptiveTrigger MinWindowWidth="600" /> 
       </VisualState.StateTriggers> 
       <VisualState.Setters> 
        <Setter Target="col1.Width" Value="Auto" /> 
       </VisualState.Setters> 
      </VisualState> 
     </VisualStateGroup> 
    </VisualStateManager.VisualStateGroups> 
</Grid> 

的MinWindowWidth值取決於TextBlock總Width。更多詳情請參考official sample。

更新的代碼如下，如果的TextBlock是動態的。

XAML代碼

<Grid 
    Background="Azure" 
    BorderBrush="Pink" 
    BorderThickness="2"> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition x:Name="col1" Width="*" /> 
     <ColumnDefinition Width="Auto" /> 
    </Grid.ColumnDefinitions> 
    <TextBlock   
     Grid.Column="0" 
     x:Name="txt1" 
     Foreground="Blue" 
     Text="layouttest1layouttest1layouttest1layou" 
     TextWrapping="Wrap" /> 
    <TextBlock  
     Grid.Column="1"   
     Foreground="Red" 
     x:Name="txt2" 
     Text="layouttest2layouttest2layouttest2layouttest2layout" 
     TextWrapping="Wrap" />  
    <VisualStateManager.VisualStateGroups> 
     <VisualStateGroup> 
      <VisualState> 
       <VisualState.StateTriggers> 
        <AdaptiveTrigger x:Name="adptivetrigger" /> 
       </VisualState.StateTriggers> 
       <VisualState.Setters> 
        <Setter Target="col1.Width" Value="Auto" /> 
       </VisualState.Setters> 
      </VisualState> 
     </VisualStateGroup> 
    </VisualStateManager.VisualStateGroups> 
</Grid> 

背後

private void Page_Loaded(object sender, RoutedEventArgs e) 
{ 
    var testwidth = txt1.ActualWidth + txt2.ActualWidth; 
    adptivetrigger.MinWindowWidth = testwidth;   
} 

Answer 2

你可以試試這個一個

<Grid> 
<Grid.ColumnDefinitions> 
    <ColumnDefinition Width="*"/> 
    <ColumnDefinition Width="*"/> 
</Grid.ColumnDefinitions> 
<TextBlock Grid.Column="0" ... HorizontalAlignment="Stretch"/> 
<TextBlock Grid.Column="1" ... HorizontalAlignment="Stretch"/> 

在這裏，我只是說的Horizo​​ntalAlignment =「拉伸」屬性，將列