2017-10-10 55 views
1

之前在這裏解釋我的問題無限增長的是我的代碼:文本框寬度與文本

<DataGrid.RowDetailsTemplate> 
    <DataTemplate> 
     <StackPanel Background="WhiteSmoke" > 
      <Grid Margin="0,10"> 
       <Grid.ColumnDefinitions> 
        <ColumnDefinition /> 
        <ColumnDefinition /> 
        <ColumnDefinition /> 
        <ColumnDefinition /> 
       </Grid.ColumnDefinitions> 
       <Grid.RowDefinitions> 
        <RowDefinition Height="Auto" /> 
        <RowDefinition Height="10" /> 
        <RowDefinition Height="Auto" /> 
        <RowDefinition Height="10" /> 
        <RowDefinition Height="Auto" /> 
        <RowDefinition Height="10" /> 
        <RowDefinition Height="Auto" /> 
        <RowDefinition Height="10" /> 
        <RowDefinition Height="Auto" /> 
        <RowDefinition Height="10" /> 
       </Grid.RowDefinitions> 
       <TextBlock Text="Name: " FontWeight="Bold" Grid.Row="0" /> 
       <TextBlock x:Name="parametro" Text="{Binding Username}" Grid.Column="1" Grid.Row="0" /> 
       <TextBlock Text="Creation Date: " FontWeight="Bold" Grid.Row="2" /> 
       <TextBlock Text="{Binding CreationDate}" Grid.Column="1" Grid.Row="2" /> 
       <TextBlock Text="Creation User: " FontWeight="Bold" Grid.Row="4" /> 
       <TextBlock Text="{Binding CreationUser}" Grid.Column="1" Grid.Row="4" /> 
       <Button Style="{DynamicResource MetroCircleButtonStyle}" Grid.RowSpan="3" Foreground="Green" FontSize="13" Width="50" FontFamily="{StaticResource FontAwesome}" Content="&#xf00c;" Grid.Column="2" Grid.Row="0" /> 
       <Button Style="{DynamicResource MetroCircleButtonStyle}" Grid.RowSpan="3" Foreground="Red" FontSize="13" Width="50" FontFamily="{StaticResource FontAwesome}" Content="&#xf00d;" Grid.Column="3" Grid.Row="0" 
         Command="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type DataGrid}}, Path=DataContext.DeleteUser}" 
         CommandParameter="{Binding ElementName=parametro, Path=Text}"/> 
       <ComboBox x:Name="combo" SelectedItem="{Binding Role}" ItemsSource="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type DataGrid}}, 
        Path=DataContext.Roles}" Grid.Row="6" Grid.Column="1"/> 
       <TextBlock Text="Ruolo: " FontWeight="Bold" Grid.Row="6" Grid.Column="0"/> 
       <TextBlock Text="Descrizione: " FontWeight="Bold" Grid.Row="8" Grid.Column="0"/> 
       <TextBox Grid.Row="8" Grid.Column="1"></TextBox> 
      </Grid> 
     </StackPanel> 
    </DataTemplate> 
</DataGrid.RowDetailsTemplate> 

我的問題是,當我寫在文本框中(在XAML中最後一個元素)的文本,該文本框的寬度增長用它。現在我知道有一個maxwidth屬性,但由於我沒有爲我的網格列定義寬度,我無法將其綁定到我的文本框的寬度。我不想根據真實像素設置寬度,因爲我希望我的應用程序「可調整大小」。我也試圖創建一個像邊框一樣的假控件,並將文本框的寬度綁定到它,但它不起作用。我該如何解決這個問題?

回答

1

首先,我們需要讓模板假定其父項的大小。

  1. 在文本框中設置TextWrapping =「WrapWithOverflow」。
  2. 至少一列的寬度必須爲*,而不是默認的Auto。這將導致網格自行調整到其父項。第二欄對我來說似乎是最好的角色。
  3. 給網格HorizontalAlignment="Left",所以它不會最終居中。
  4. 你可以擺脫StackPanel;它沒有爲你做任何事情。

其次,我們需要在DataGrid中進行一些更改以約束其行細節區域的寬度。

這是我測試過的例子;你的ItemsSource當然會有所不同。

<DataGrid 
    ItemsSource="{Binding Items}" 
    AutoGenerateColumns="False" 
    RowHeaderWidth="0" 
    > 
    <!-- 
    ScrollContentPresenter includes the row header column. 
    DataGridDetailsPresenter doesn't. So we set RowHeaderWidth="0" 
    above to avoid making the details too wide by an amount equal to 
    the width of the row header. 

    This is just cosmetic, so leave RowHeaderWidth alone if you have 
    a requirement to keep the row header visible. 
    --> 
    <DataGrid.RowDetailsTemplate> 
     <DataTemplate> 
      <Grid 
       Margin="0,10" 
       Background="WhiteSmoke" 
       HorizontalAlignment="Left" 
       Width="{Binding ActualWidth, RelativeSource={RelativeSource AncestorType=ScrollContentPresenter}}" 
       > 
       <Grid.ColumnDefinitions> 
        <ColumnDefinition Width="Auto" /> 
        <ColumnDefinition Width="*" /> 
        <ColumnDefinition Width="Auto" /> 
        <ColumnDefinition Width="Auto" /> 
       </Grid.ColumnDefinitions> 
       <Grid.RowDefinitions> 
        <RowDefinition Height="Auto" /> 
        <RowDefinition Height="10" /> 
        <RowDefinition Height="Auto" /> 
        <RowDefinition Height="10" /> 
        <RowDefinition Height="Auto" /> 
        <RowDefinition Height="10" /> 
        <RowDefinition Height="Auto" /> 
        <RowDefinition Height="10" /> 
        <RowDefinition Height="Auto" /> 
        <RowDefinition Height="10" /> 
       </Grid.RowDefinitions> 
       <TextBlock Text="Name: " FontWeight="Bold" Grid.Row="0" /> 
       <TextBlock x:Name="parametro" Text="{Binding Username}" Grid.Column="1" Grid.Row="0" /> 
       <TextBlock Text="Creation Date: " FontWeight="Bold" Grid.Row="2" /> 
       <TextBlock Text="{Binding CreationDate}" Grid.Column="1" Grid.Row="2" /> 
       <TextBlock Text="Creation User: " FontWeight="Bold" Grid.Row="4" /> 
       <TextBlock Text="{Binding CreationUser}" Grid.Column="1" Grid.Row="4" /> 
       <Button Style="{DynamicResource MetroCircleButtonStyle}" Grid.RowSpan="3" Foreground="Green" FontSize="13" Width="50" Content="&#xf00c;" Grid.Column="2" Grid.Row="0" /> 
       <Button Style="{DynamicResource MetroCircleButtonStyle}" Grid.RowSpan="3" Foreground="Red" FontSize="13" Width="50" Content="&#xf00d;" Grid.Column="3" Grid.Row="0" 
        Command="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type DataGrid}}, Path=DataContext.DeleteUser}" 
        CommandParameter="{Binding ElementName=parametro, Path=Text}"/> 
       <ComboBox MaxWidth="185" x:Name="combo" SelectedItem="{Binding Role}" ItemsSource="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type DataGrid}}, 
       Path=DataContext.Roles}" Grid.Row="6" Grid.Column="1"/> 
       <TextBlock Text="Ruolo: " FontWeight="Bold" Grid.Row="6" Grid.Column="0"/> 
       <TextBlock Text="Descrizione: " FontWeight="Bold" Grid.Row="8" Grid.Column="0"/> 
       <TextBox 
        Grid.Row="8" 
        TextWrapping="WrapWithOverflow" 
        Grid.Column="1" 
        ></TextBox> 
      </Grid> 
     </DataTemplate> 
    </DataGrid.RowDetailsTemplate> 

我是怎麼算出這個?

我加入預覽鼠標按下處理程序到網格中的DataTemplate:

<Grid Margin="0,10" Background="WhiteSmoke" PreviewMouseDown="Grid_PreviewMouseDown"> 

然我的測試程序和一些測試數據,點擊一排,擴大該行的詳細信息,並在該行的詳細信息點擊區。這是處理我爲鼠標事件:

private void Grid_PreviewMouseDown(object sender, MouseButtonEventArgs e) 
{ 
    List<DependencyObject> parents = new List<DependencyObject>(); 
    var parent = VisualTreeHelper.GetParent(sender as DependencyObject); 
    while (parent != null) 
    { 
     parents.Add(parent); 
     parent = VisualTreeHelper.GetParent(parent); 
    } 

    ; 
} 

我設置一個斷點,並在監視窗口看着parents

-  parents Count = 16 System.Collections.Generic.List<System.Windows.DependencyObject> 
+  [0] {System.Windows.Controls.Primitives.DataGridDetailsPresenter} System.Windows.DependencyObject {System.Windows.Controls.Primitives.DataGridDetailsPresenter} 
+  [1] {System.Windows.Controls.Primitives.SelectiveScrollingGrid} System.Windows.DependencyObject {System.Windows.Controls.Primitives.SelectiveScrollingGrid} 
+  [2] {System.Windows.Controls.Border} System.Windows.DependencyObject {System.Windows.Controls.Border} 
+  [3] {System.Windows.Controls.DataGridRow} System.Windows.DependencyObject {System.Windows.Controls.DataGridRow} 
+  [4] {System.Windows.Controls.Primitives.DataGridRowsPresenter} System.Windows.DependencyObject {System.Windows.Controls.Primitives.DataGridRowsPresenter} 
+  [5] {System.Windows.Controls.ItemsPresenter} System.Windows.DependencyObject {System.Windows.Controls.ItemsPresenter} 
+  [6] {System.Windows.Controls.ScrollContentPresenter} System.Windows.DependencyObject {System.Windows.Controls.ScrollContentPresenter} 
+  [7] {System.Windows.Controls.Grid} System.Windows.DependencyObject {System.Windows.Controls.Grid} 
+  [8] {System.Windows.Controls.ScrollViewer} System.Windows.DependencyObject {System.Windows.Controls.ScrollViewer} 
+  [9] {System.Windows.Controls.Border} System.Windows.DependencyObject {System.Windows.Controls.Border} 
+  [10] {System.Windows.Controls.DataGrid Items.Count:10} System.Windows.DependencyObject {System.Windows.Controls.DataGrid} 
+  [11] {System.Windows.Controls.Grid} System.Windows.DependencyObject {System.Windows.Controls.Grid} 
+  [12] {System.Windows.Controls.ContentPresenter} System.Windows.DependencyObject {System.Windows.Controls.ContentPresenter} 
+  [13] {System.Windows.Documents.AdornerDecorator} System.Windows.DependencyObject {System.Windows.Documents.AdornerDecorator} 
+  [14] {System.Windows.Controls.Border} System.Windows.DependencyObject {System.Windows.Controls.Border} 
+  [15] {CS7Test02.MainWindow} System.Windows.DependencyObject {CS7Test02.MainWindow} 

網格的母公司爲DataGridDetailsPresenter

+  [0] {System.Windows.Controls.Primitives.DataGridDetailsPresenter} System.Windows.DependencyObject {System.Windows.Controls.Primitives.DataGridDetailsPresenter} 

他的父母是SelectiveScrollingGrid,並且環比上漲。通過簡單的試驗和錯誤,我找到了我想要的ActualWidth的父母,並且受此限制。

我發現了另一種將所需寬度作爲DataGrid本身的特性而不是數據模板應用的方式。這使您可以使用任意的細節模板,而無需單獨修改每個模板以使用正確的寬度。

<DataGrid.RowStyle> 
    <!-- 
    This style exists only so we can use its Resources to declare 
    the DataGridDetailsPresenter style someplace where it'll be taken 
    as an implicit style for DataGridDetailsPresenter in this grid's 
    row details children. 
    -->     
    <Style TargetType="DataGridRow"> 
     <Style.Resources> 
      <Style TargetType="DataGridDetailsPresenter"> 
       <Setter 
        Property="Width" 
        Value="{Binding ActualWidth, RelativeSource={RelativeSource AncestorType=ScrollContentPresenter}}" 
        /> 
      </Style> 
     </Style.Resources> 
    </Style> 
</DataGrid.RowStyle> 
+0

當文本框寬度超過尺寸 –

+0

@DanieleSartori對不起,我犯了一個錯誤。至少一列需要寬度爲'*'。 –

+0

問題仍然存在 –