DataGrid not sizing columns on initial load

[Bart]

I have the following DataGrid:

<tl:RadDataGrid
Name="DataGridShipmentInformation"
Width="1920"
d:DataContext="{StaticResource SampleData}"
AutoGenerateColumns="False"
CanUserChooseColumns="False"
IsBusyIndicatorEnabled="True"
ItemsSource="{Binding}"
UserFilterMode="Disabled"
UserGroupMode="Disabled"
UserSortMode="None">
<tl:RadDataGrid.Columns>
<tl:DataGridTemplateColumn Header="Shpmnt #" HeaderStyle="{StaticResource DefaultDataGridColumnHeader}">
<tl:DataGridTemplateColumn.CellContentTemplate>
<DataTemplate>
<Border Background="{Binding Path=TransportStatus, Converter={StaticResource TransportStatusToColorBrushConverter}}">
<TextBlock Style="{StaticResource DefaultLabel}" Text="{Binding ShipmentNumber}" />
</Border>
</DataTemplate>
</tl:DataGridTemplateColumn.CellContentTemplate>
</tl:DataGridTemplateColumn>
<tl:DataGridTemplateColumn Header="Route" HeaderStyle="{StaticResource DefaultDataGridColumnHeader}">
<tl:DataGridTemplateColumn.CellContentTemplate>
<DataTemplate>
<Border Background="{Binding Path=TransportStatus, Converter={StaticResource TransportStatusToColorBrushConverter}}">
<TextBlock Style="{StaticResource DefaultLabel}" Text="{Binding Route}" />
</Border>
</DataTemplate>
</tl:DataGridTemplateColumn.CellContentTemplate>
</tl:DataGridTemplateColumn>
<tl:DataGridTemplateColumn Header="Route Descr." HeaderStyle="{StaticResource DefaultDataGridColumnHeader}">
<tl:DataGridTemplateColumn.CellContentTemplate>
<DataTemplate>
<Border Background="{Binding Path=TransportStatus, Converter={StaticResource TransportStatusToColorBrushConverter}}">
<TextBlock
Style="{StaticResource DefaultLabel}"
Text="{Binding RouteDescription}"
TextWrapping="Wrap" />
</Border>
</DataTemplate>
</tl:DataGridTemplateColumn.CellContentTemplate>
</tl:DataGridTemplateColumn>
<tl:DataGridTemplateColumn Header="Bxs" HeaderStyle="{StaticResource DefaultDataGridColumnHeader}">
<tl:DataGridTemplateColumn.CellContentTemplate>
<DataTemplate>
<Border Background="{Binding Path=TransportStatus, Converter={StaticResource TransportStatusToColorBrushConverter}}">
<TextBlock
HorizontalAlignment="Center"
Style="{StaticResource DefaultLabel}"
Text="{Binding Boxes}" />
</Border>
</DataTemplate>
</tl:DataGridTemplateColumn.CellContentTemplate>
</tl:DataGridTemplateColumn>
<tl:DataGridTemplateColumn Header="Plts" HeaderStyle="{StaticResource DefaultDataGridColumnHeader}">
<tl:DataGridTemplateColumn.CellContentTemplate>
<DataTemplate>
<Border Background="{Binding Path=TransportStatus, Converter={StaticResource TransportStatusToColorBrushConverter}}">
<TextBlock
HorizontalAlignment="Center"
Style="{StaticResource DefaultLabel}"
Text="{Binding Pallets}" />
</Border>
</DataTemplate>
</tl:DataGridTemplateColumn.CellContentTemplate>
</tl:DataGridTemplateColumn>
<tl:DataGridTemplateColumn Header="Pln. Shpmt." HeaderStyle="{StaticResource DefaultDataGridColumnHeader}">
<tl:DataGridTemplateColumn.CellContentTemplate>
<DataTemplate>
<Border Background="{Binding TransportStatus, Converter={StaticResource TransportStatusToColorBrushConverter}}">
<TextBlock
HorizontalAlignment="Center"
Style="{StaticResource DefaultLabel}"
Text="{Binding FormattedPlannedDateForShipmentCompletion}" />
</Border>
</DataTemplate>
</tl:DataGridTemplateColumn.CellContentTemplate>
</tl:DataGridTemplateColumn>
<tl:DataGridTemplateColumn Header="Pck. Up" HeaderStyle="{StaticResource DefaultDataGridColumnHeader}">
<tl:DataGridTemplateColumn.CellContentTemplate>
<DataTemplate>
<Border Background="{Binding TransportStatus, Converter={StaticResource TransportStatusToColorBrushConverter}}">
<TextBlock
HorizontalAlignment="Center"
Style="{StaticResource DefaultLabel}"
Text="{Binding PickUpIndicator}" />
</Border>
</DataTemplate>
</tl:DataGridTemplateColumn.CellContentTemplate>
</tl:DataGridTemplateColumn>
</tl:RadDataGrid.Columns>
</tl:RadDataGrid>

The ObservableCollection for the grid is loaded asynchronously in the Loaded event of the page.
When the data is loaded into the grid, the columns are not sized properly. The data is reloaded every x seconds by means of a timer.
When the timer elapses and the data is reloaded (using the same method as the first time) the grid is updating its layout and sizes perfectly to the width of the screen.

How can I get the same result on the first, initial load?

[Yana]

Hello Bart,

It seems Loaded event is raised too early.  One approach I could suggest is to use Dispatcher to delay a little bit loading of the items the first time or you could consider not using the Loaded event and load the data from the ViewModel.

I hope this would help.

Regards,
Yana
Progress Telerik