TabControl with DataGrid. Columns won't size correctly

aalex675

I am really hoping someone here can help me. I've been playing around with the WPF DataGrid and am having a weird problem. What I have is a TabControl with two tabs. Each tab has a DataGrid with two columns. The first column Width is "Auto" and the second column Width is "*" which should fill the remaining space in the Datagrid. What is happening is that the DataGrid in the first tab's columns are sized appropriately, but the second tab's second column is wider than it should be. Also, if I change the SelectedIndex to the second tab, it's columns are size correctly but the first tab's columns aren't. I have tried to Invalidate the DataGrid control when the selected tab changes but that didn't seem to do anything. I'm not sure how to explain this better but here is some example XAML:

Mark Salsbery

Well That's messed up :) Looking closely, it seems on the first switch to the other tab, its content (the datagrid) is sized to the entire tabcontrol size including the header... Then you can see the content shift right real quick as it gets positioned in the tab content area. From that point on, the content's size is incorrect, even if the tabcontrol is resized. The problem Can also be consistently seen at design time in both the Visual Studio designer and in Blend. What I can't figure out is a fix for this...I'll get back to you if I figure something out...

aalex675 wrote:

Sorry if the code is hard to read.

Any code I can copy right into a test window and run with minimal changes is just fine with me. Your posted code was great. :) Mark

Mark Salsbery Microsoft MVP - Visual C++ :java:

aalex675

Great! Thanks for trying it. I'm glad it's not something really obvious that I missed at least.

Mark Salsbery

I didn't dig into the DataGrid source code, but this workaround seems to work... I added a SelectionChanged handler to the tab control:

    private void TabControl\_SelectionChanged(object sender, SelectionChangedEventArgs e)
    {
        System.Collections.IEnumerable olditemssource = datagrid2.ItemsSource;
        datagrid2.ItemsSource = null;
        datagrid2.ItemsSource = olditemssource;// new MyItemCollection\_design();
    }

Resetting the ItemsSource on the DataGrid is the only way (I could figure out) to get the DataGrid to re-layout its columns correctly. That's not really a good fix though, since if the user changes the column sort order, it won't be preserved if the tab is navigated away from and back to. They key point is to NOT set the ItemsSource until the DataGrid's associated tab is navigated to for the first time. I'll leave that as an exercise for you ;P I'm thinking this should probably be reported as a bug on the toolkit CodePlex site...

Mark Salsbery Microsoft MVP - Visual C++ :java:

aalex675

Thanks, I tried setting ItemsSource in code the first time each tab is selected and that takes care of the issue. I think this may already be in the bug tracker on CodePlex as issue #8842(DataGrid Star Column Widths incorrect when DataGrid was loaded with its Visibility not Visibile[^]) so I just voted for that issue. Thanks again for the help.

Mark Salsbery

aalex675 wrote:

I think this may already be in the bug tracker on CodePlex as issue #8842

Cool! I didn't find it when I looked. Thanks! Cheers, Mark

Mark Salsbery Microsoft MVP - Visual C++ :java: