Solving DataGrid ridimensionamento della larghezza della colonna incoerente

Question

Nella nostra applicazione utilizziamo i datagrids per le righe di layout riempite con contenuto e pulsanti di modello, tuttavia si verifica un problema a intermittenza dove alcune colonne si ridimensionano a volte fino alla larghezza minima della colonna e talvolta al larghezza del contenuto dell'intestazione della colonna. Questo sembra essere qualcosa legato al momento in cui viene impostata la fonte di elementi e quando si verifica l'evento di caricamento, ma non posso definirlo di sicuro.

esempio di comportamento non corretto

Esempio di corretto comportamento

L'ItemsSource è associato a un ObservableCollection sulla viewmodel che popola asincrono usando l'asincrono e attendere parole chiave e un Dataservice.

Ho tentato di risolvere il problema nascondendo tutte le colonne sull'inizializzazione e poi, una volta impostata la sorgente di elementi e scaricato è stata richiamata l'impostazione di tutte le colonne alla visibilità iniziale, questo sembrava avere qualche effetto ma non ha risolto il problema problema completamente.

XAML per la colonna Definizione

<Style x:Key="MainDataGridColumnHeader" TargetType="{x:Type DataGridColumnHeader}"> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type DataGridColumnHeader}"> 
       <TextBlock Text="{TemplateBinding Content}" Foreground="{StaticResource HighlightedTextBrush}" 
          Background="Transparent" 
          FontSize="16" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center"/> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

<Style x:Key="MainDataGridRow" TargetType="{x:Type DataGridRow}"> 
    <Setter Property="Background" Value="{StaticResource LightBackgroundBrush}" /> 
    <Setter Property="BorderBrush" Value="{StaticResource Faded10MidBackgroundBrush}"/> 
    <Setter Property="BorderThickness" Value="0,0,0,1" /> 
    <Setter Property="SnapsToDevicePixels" Value="true" /> 
    <Setter Property="Padding" Value="5"/> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type DataGridRow}"> 
       <Border x:Name="DGR_Border" 
         BorderBrush="{TemplateBinding BorderBrush}" 
         BorderThickness="{TemplateBinding BorderThickness}" 
         Background="{TemplateBinding Background}" 
         SnapsToDevicePixels="True" 
         CornerRadius="0" 
         Margin="0,5" 
         Width="{Binding ActualWidth, RelativeSource={RelativeSource AncestorType={x:Type DataGridRow}}}"> 
        <SelectiveScrollingGrid> 
         <SelectiveScrollingGrid.ColumnDefinitions> 
          <ColumnDefinition Width="Auto" /> 
          <ColumnDefinition Width="*" /> 
         </SelectiveScrollingGrid.ColumnDefinitions> 
         <SelectiveScrollingGrid.RowDefinitions> 
          <RowDefinition Height="*" /> 
          <RowDefinition Height="Auto" /> 
         </SelectiveScrollingGrid.RowDefinitions> 
         <DataGridCellsPresenter Grid.Column="1" 
              ItemsPanel="{TemplateBinding ItemsPanel}" 
              SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" /> 
         <DataGridDetailsPresenter Grid.Column="1" 
               Grid.Row="1" 
               SelectiveScrollingGrid.SelectiveScrollingOrientation="{Binding AreRowDetailsFrozen, ConverterParameter={x:Static SelectiveScrollingOrientation.Vertical}, Converter={x:Static DataGrid.RowDetailsScrollingConverter}, RelativeSource={RelativeSource AncestorType={x:Type DataGrid}}}" 
               Visibility="{TemplateBinding DetailsVisibility}" /> 
         <DataGridRowHeader Grid.RowSpan="2" 
             SelectiveScrollingGrid.SelectiveScrollingOrientation="Vertical" 
             Visibility="{Binding HeadersVisibility, ConverterParameter={x:Static DataGridHeadersVisibility.Row}, Converter={x:Static DataGrid.HeadersVisibilityConverter}, RelativeSource={RelativeSource AncestorType={x:Type DataGrid}}}" /> 
        </SelectiveScrollingGrid> 
       </Border> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

<Style x:Key="MainDataGridCell" TargetType="{x:Type DataGridCell}"> 
    <Setter Property="Background" Value="Transparent"/> 
    <Setter Property="BorderBrush" Value="Transparent"/> 
    <Setter Property="BorderThickness" Value="1"/> 
    <Setter Property="Foreground" Value="{StaticResource TextBrush}"/> 
    <Setter Property="Focusable" Value="False"/> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type DataGridCell}"> 
       <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True"> 
        <ContentPresenter ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" ContentStringFormat="{TemplateBinding ContentStringFormat}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/> 
       </Border> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
    <Style.Triggers> 
     <Trigger Property="IsEnabled" Value="False"> 
      <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/> 
     </Trigger> 
    </Style.Triggers> 
</Style> 

XAML per intestazione di colonna, di riga e di cella stili

<DataGrid.Columns> 
      <DataGridTemplateColumn x:Name="dateColumn" Header="Race Time" MinWidth="110" Width="Auto" CellTemplate="{StaticResource RacesRaceTimeTemplate}" /> 
      <DataGridTemplateColumn x:Name="iconColumn" Width="62" CellTemplate="{StaticResource RacesRaceIconTemplate}"/> 
      <DataGridTemplateColumn x:Name="nameColumn" Width="*" CellTemplate="{StaticResource RacesRaceDescriptionTemplate}"/> 
      <DataGridTemplateColumn x:Name="favsColumn" Width="auto" Header="Fav/2nd Fav" CellTemplate="{StaticResource RacesFavSelectionsTemplate}" /> 
      <DataGridTemplateColumn x:Name="additionalColumn" Width="78" CellTemplate="{StaticResource RacesAdditionalOptionsTemplate}" /> 
     </DataGrid.Columns> 

Per ora posso principalmente risolvere il problema impostando larghezze hardcoded per le colonne, ma questa non è una soluzione ragionevole in futuro, poiché avremo un contenuto a larghezza variabile.

Qualcuno ha una soluzione per questo problema?

Answer 1

Hai provato impostando la larghezza min di tutte le colonne, quindi specificare la larghezza in base a percentuali

<DataGrid.Columns> 
     <DataGridTemplateColumn x:Name="dateColumn" MinWidth="110" Width="*" Header="Race Time" CellTemplate="{StaticResource RacesRaceTimeTemplate}" /> 
     <DataGridTemplateColumn x:Name="iconColumn" MinWidth="62" Width="2*" CellTemplate="{StaticResource RacesRaceIconTemplate}"/> 
     <DataGridTemplateColumn x:Name="nameColumn" MinWidth="500" Width="3*" CellTemplate="{StaticResource RacesRaceDescriptionTemplate}"/> 
     <DataGridTemplateColumn x:Name="favsColumn" MinWidth="232" Width="3*" Header="Fav/2nd Fav" CellTemplate="{StaticResource RacesFavSelectionsTemplate}" /> 
     <DataGridTemplateColumn x:Name="additionalColumn" MinWidth="78" Width="*" CellTemplate="{StaticResource RacesAdditionalOptionsTemplate}" /> 
</DataGrid.Columns> 

Answer 2

è possibile visualizzare questo answer.

tenta di aggiornare le colonne di larghezza di programmazione dopo aver impostato il tuo ItemsSource

foreach (DataGridColumn c in dg.Columns) 
    c.Width = 0; 

// Update your DG's source here 

foreach (DataGridColumn c in dg.Columns) 
    c.Width = DataGridLength.Auto; 

e quindi UpdateLayout DataGrid.