WPF DataGrid uses a lot of memory, or is slow to scroll
-
I have a problem with a DataGrid consuming a huge amount of memory when we have ~15,000 cells, each cell holding an edit control ie CheckBox, TextBox or ComboBox. The view takes 40 seconds to appear, and then consumes 1GB RAM. I can turn on virtualisation of rows and columns, which cures the slow start, and reduces memory by a factor of 3. However, that makes scrolling unacceptably slow ie many seconds. I have a test app which allows me to test methods to improve performance. It displays values in a 2D matric, which is defined as a list of Row instance. Each Row object contains an array of node instances which hold the values. The DataGrid is simple enough:
The view constructor creates the column data templates:
public MainWindow()
{
InitializeComponent();MainViewModel viewModel = new MainViewModel(); DataContext = viewModel; //\_gridDataTemplateSelector = new TouchHub2.View.DataGridTemplateSelector(); \_gridDataTemplateSelector = new GridDataTemplateSelector(); \_gridDataTemplateSelector.LabelDataTemplate = Resources\["LabelDataTemplate"\] as DataTemplate; \_gridDataTemplateSelector.TextBoxDataTemplate = Resources\["TextBoxDataTemplate"\] as DataTemplate; \_gridDataTemplateSelector.CheckBoxDataTemplate = Resources\["CheckBoxDataTemplate"\] as DataTemplate; \_gridDataTemplateSelector.ComboBoxDataTemplate = Resources\["ComboBoxDataTemplate"\] as DataTemplate; for (int i = 0; i < Row.constColumnCount; i++) { DataGridTemplateColumn col = new DataGridTemplateColumn(); FrameworkElementFactory fef = new FrameworkElementFactory(typeof(ContentPresenter)); Binding binding = new Binding(); fef.SetBinding(ContentPresenter.ContentProperty, binding); -
I have a problem with a DataGrid consuming a huge amount of memory when we have ~15,000 cells, each cell holding an edit control ie CheckBox, TextBox or ComboBox. The view takes 40 seconds to appear, and then consumes 1GB RAM. I can turn on virtualisation of rows and columns, which cures the slow start, and reduces memory by a factor of 3. However, that makes scrolling unacceptably slow ie many seconds. I have a test app which allows me to test methods to improve performance. It displays values in a 2D matric, which is defined as a list of Row instance. Each Row object contains an array of node instances which hold the values. The DataGrid is simple enough:
The view constructor creates the column data templates:
public MainWindow()
{
InitializeComponent();MainViewModel viewModel = new MainViewModel(); DataContext = viewModel; //\_gridDataTemplateSelector = new TouchHub2.View.DataGridTemplateSelector(); \_gridDataTemplateSelector = new GridDataTemplateSelector(); \_gridDataTemplateSelector.LabelDataTemplate = Resources\["LabelDataTemplate"\] as DataTemplate; \_gridDataTemplateSelector.TextBoxDataTemplate = Resources\["TextBoxDataTemplate"\] as DataTemplate; \_gridDataTemplateSelector.CheckBoxDataTemplate = Resources\["CheckBoxDataTemplate"\] as DataTemplate; \_gridDataTemplateSelector.ComboBoxDataTemplate = Resources\["ComboBoxDataTemplate"\] as DataTemplate; for (int i = 0; i < Row.constColumnCount; i++) { DataGridTemplateColumn col = new DataGridTemplateColumn(); FrameworkElementFactory fef = new FrameworkElementFactory(typeof(ContentPresenter)); Binding binding = new Binding(); fef.SetBinding(ContentPresenter.ContentProperty, binding);For your DataGrid, set this
ScrollViewer.IsDeferredScrollingEnabled="True"
This space for rent
-
I have a problem with a DataGrid consuming a huge amount of memory when we have ~15,000 cells, each cell holding an edit control ie CheckBox, TextBox or ComboBox. The view takes 40 seconds to appear, and then consumes 1GB RAM. I can turn on virtualisation of rows and columns, which cures the slow start, and reduces memory by a factor of 3. However, that makes scrolling unacceptably slow ie many seconds. I have a test app which allows me to test methods to improve performance. It displays values in a 2D matric, which is defined as a list of Row instance. Each Row object contains an array of node instances which hold the values. The DataGrid is simple enough:
The view constructor creates the column data templates:
public MainWindow()
{
InitializeComponent();MainViewModel viewModel = new MainViewModel(); DataContext = viewModel; //\_gridDataTemplateSelector = new TouchHub2.View.DataGridTemplateSelector(); \_gridDataTemplateSelector = new GridDataTemplateSelector(); \_gridDataTemplateSelector.LabelDataTemplate = Resources\["LabelDataTemplate"\] as DataTemplate; \_gridDataTemplateSelector.TextBoxDataTemplate = Resources\["TextBoxDataTemplate"\] as DataTemplate; \_gridDataTemplateSelector.CheckBoxDataTemplate = Resources\["CheckBoxDataTemplate"\] as DataTemplate; \_gridDataTemplateSelector.ComboBoxDataTemplate = Resources\["ComboBoxDataTemplate"\] as DataTemplate; for (int i = 0; i < Row.constColumnCount; i++) { DataGridTemplateColumn col = new DataGridTemplateColumn(); FrameworkElementFactory fef = new FrameworkElementFactory(typeof(ContentPresenter)); Binding binding = new Binding(); fef.SetBinding(ContentPresenter.ContentProperty, binding);Displaying a "collection of UI CONTROLS" in a data grid is probably the worst thing you can do with a data grid for a "large collection". You're supposed to bind data grid "cell types" to a "DATA collection" if you want to "virtualize" (the UI).
"(I) am amazed to see myself here rather than there ... now rather than then". ― Blaise Pascal
-
For your DataGrid, set this
ScrollViewer.IsDeferredScrollingEnabled="True"
This space for rent
Thanks. Sadly that doesn't really improve things, still slow.
-
Displaying a "collection of UI CONTROLS" in a data grid is probably the worst thing you can do with a data grid for a "large collection". You're supposed to bind data grid "cell types" to a "DATA collection" if you want to "virtualize" (the UI).
"(I) am amazed to see myself here rather than there ... now rather than then". ― Blaise Pascal
Thanks. Can you expand on your answer? I don't know what you mean by data grid "cell types".
-
Displaying a "collection of UI CONTROLS" in a data grid is probably the worst thing you can do with a data grid for a "large collection". You're supposed to bind data grid "cell types" to a "DATA collection" if you want to "virtualize" (the UI).
"(I) am amazed to see myself here rather than there ... now rather than then". ― Blaise Pascal
Thanks. Can you expand on your answer? I don't know what you mean by data grid "cell types". I assume you are saying that I should not create an instance of a UI control for each data item. Instead I should have a minimal set of UI controls, and change the data each displays. Clearly for a uniform grid where all controls are the same, or all cells in a given column are the same, that is easy, and it can be done in the view model. However, I might have one row of check boxes, followed by several rows of combo boxes, followed by several rows of hex number edit boxes etc and this can be scrolled vertically.
-
Thanks. Can you expand on your answer? I don't know what you mean by data grid "cell types". I assume you are saying that I should not create an instance of a UI control for each data item. Instead I should have a minimal set of UI controls, and change the data each displays. Clearly for a uniform grid where all controls are the same, or all cells in a given column are the same, that is easy, and it can be done in the view model. However, I might have one row of check boxes, followed by several rows of combo boxes, followed by several rows of hex number edit boxes etc and this can be scrolled vertically.
You need to be more specific than "rows of checkboxes and combo boxes"; I've used "list views" to display "user controls" that contained "rows". I said before that there was more than one way to get a "grid effect"; your description of "why" and from "what" is non-existent so it is hard to make more concrete suggestions. [ListView basics and virtualization concepts – Blog Alain Zanchetta](https://blogs.msdn.microsoft.com/alainza/2014/09/03/listview-basics-and-virtualization-concepts/) Bottom line: no "data binding", no virtualization.
"(I) am amazed to see myself here rather than there ... now rather than then". ― Blaise Pascal
-
You need to be more specific than "rows of checkboxes and combo boxes"; I've used "list views" to display "user controls" that contained "rows". I said before that there was more than one way to get a "grid effect"; your description of "why" and from "what" is non-existent so it is hard to make more concrete suggestions. [ListView basics and virtualization concepts – Blog Alain Zanchetta](https://blogs.msdn.microsoft.com/alainza/2014/09/03/listview-basics-and-virtualization-concepts/) Bottom line: no "data binding", no virtualization.
"(I) am amazed to see myself here rather than there ... now rather than then". ― Blaise Pascal
Some requirements were given in my previous question along with example code, that you replied to, however it was a long post. We need to display tabular data, in a table with rows and columns. A given data value can be a Boolean, or a combo box selection, or a numeric value (signed or unsigned). In general each value is editable. The table of settings is to be displayed in a WPF view and hence the size will depend on the view size. Clearly not all of the items will be visible to the user as the table is so large, so there will be vertical and horizontal scroll bars. I had hoped that the DataGrid implemented virtualisation well enough to reduce the overhead, but it appears that WPF is very very memory intensive. When I turn on virtualisation for both columns and rows, the performance is unacceptable (slow). I haven't tried the list view. I guess I could define a list view item as a GRID control with one row, and multiple columns and use the
SharedSizeGroup
property to create columns, assuming that would work, but I can't see why it would reduce the massive memory overhead. A possible solution I am working on is to use a DataGrid with each item being a Label control. That massively reduces the memory usage. Double clicking on an item makes it editable, displaying the appropriate edit control e.g. CheckBox.
-
Some requirements were given in my previous question along with example code, that you replied to, however it was a long post. We need to display tabular data, in a table with rows and columns. A given data value can be a Boolean, or a combo box selection, or a numeric value (signed or unsigned). In general each value is editable. The table of settings is to be displayed in a WPF view and hence the size will depend on the view size. Clearly not all of the items will be visible to the user as the table is so large, so there will be vertical and horizontal scroll bars. I had hoped that the DataGrid implemented virtualisation well enough to reduce the overhead, but it appears that WPF is very very memory intensive. When I turn on virtualisation for both columns and rows, the performance is unacceptable (slow). I haven't tried the list view. I guess I could define a list view item as a GRID control with one row, and multiple columns and use the
SharedSizeGroup
property to create columns, assuming that would work, but I can't see why it would reduce the massive memory overhead. A possible solution I am working on is to use a DataGrid with each item being a Label control. That massively reduces the memory usage. Double clicking on an item makes it editable, displaying the appropriate edit control e.g. CheckBox.
You still haven't provided any sense of the logic or purpose for the "UI". All data has some sort of "structure" that drives the design. Nothing you've described justifies your reasoning about the "technical" details.
"(I) am amazed to see myself here rather than there ... now rather than then". ― Blaise Pascal
-
Some requirements were given in my previous question along with example code, that you replied to, however it was a long post. We need to display tabular data, in a table with rows and columns. A given data value can be a Boolean, or a combo box selection, or a numeric value (signed or unsigned). In general each value is editable. The table of settings is to be displayed in a WPF view and hence the size will depend on the view size. Clearly not all of the items will be visible to the user as the table is so large, so there will be vertical and horizontal scroll bars. I had hoped that the DataGrid implemented virtualisation well enough to reduce the overhead, but it appears that WPF is very very memory intensive. When I turn on virtualisation for both columns and rows, the performance is unacceptable (slow). I haven't tried the list view. I guess I could define a list view item as a GRID control with one row, and multiple columns and use the
SharedSizeGroup
property to create columns, assuming that would work, but I can't see why it would reduce the massive memory overhead. A possible solution I am working on is to use a DataGrid with each item being a Label control. That massively reduces the memory usage. Double clicking on an item makes it editable, displaying the appropriate edit control e.g. CheckBox.
Why not change your UI design to a more sensible layout. List all the setting values in a grid but make the user edit them in a dialog box. The user should have to double click on the grid row he wants to edit, pop a dialog with the data from that row, allow the user to edit the data of the single data row in discreet controls, save the data back to the underlying collection. The design eliminates the need to editable controls in the data grid and will simplify your life enormously.
Never underestimate the power of human stupidity RAH
-
Why not change your UI design to a more sensible layout. List all the setting values in a grid but make the user edit them in a dialog box. The user should have to double click on the grid row he wants to edit, pop a dialog with the data from that row, allow the user to edit the data of the single data row in discreet controls, save the data back to the underlying collection. The design eliminates the need to editable controls in the data grid and will simplify your life enormously.
Never underestimate the power of human stupidity RAH
Thanks. I might well use that approach, depending on how much progress I make. Currently I am implementing a solution whereby the grid is read only but when the user double clicks on a cell, it becomes editable. So instead of plain text, they now see a combo box, or a tick box, or a numeric value editor. Double click elsewhere, and the cell becomes read only. This works well with the Microsoft WPF DataGrid though the memory usage is still rather high. The non editable cell control is a Label. I am also looking at the WPF Table View control on CodePlex. As yet I cannot find out how to make the current cell active when double clicked on, but the memory usage and speed are better. Clearly I can easily pop up a dialog to edit a cell, or a row as you suggest since I can trap the mouse double click. From searching around it does seem that the performance of grids is a widespread problem.
-
Thanks. I might well use that approach, depending on how much progress I make. Currently I am implementing a solution whereby the grid is read only but when the user double clicks on a cell, it becomes editable. So instead of plain text, they now see a combo box, or a tick box, or a numeric value editor. Double click elsewhere, and the cell becomes read only. This works well with the Microsoft WPF DataGrid though the memory usage is still rather high. The non editable cell control is a Label. I am also looking at the WPF Table View control on CodePlex. As yet I cannot find out how to make the current cell active when double clicked on, but the memory usage and speed are better. Clearly I can easily pop up a dialog to edit a cell, or a row as you suggest since I can trap the mouse double click. From searching around it does seem that the performance of grids is a widespread problem.
Don't use a Label if you can help it. Use a TextBlock instead. A Label is, relatively speaking, a much heavier weight control than a TextBlock.
This space for rent
-
Don't use a Label if you can help it. Use a TextBlock instead. A Label is, relatively speaking, a much heavier weight control than a TextBlock.
This space for rent
Thanks, that's very helpful. :)
-
Thanks, that's very helpful. :)
You're welcome.
This space for rent
-
Thanks. I might well use that approach, depending on how much progress I make. Currently I am implementing a solution whereby the grid is read only but when the user double clicks on a cell, it becomes editable. So instead of plain text, they now see a combo box, or a tick box, or a numeric value editor. Double click elsewhere, and the cell becomes read only. This works well with the Microsoft WPF DataGrid though the memory usage is still rather high. The non editable cell control is a Label. I am also looking at the WPF Table View control on CodePlex. As yet I cannot find out how to make the current cell active when double clicked on, but the memory usage and speed are better. Clearly I can easily pop up a dialog to edit a cell, or a row as you suggest since I can trap the mouse double click. From searching around it does seem that the performance of grids is a widespread problem.
That design would drive nuts, double click to edit a single cell, double click to end editing, rinse and repeat. Plus you have horizontal scroll so you cannot see the entire row of data. I use the dialog style because the user can double click on a row and see and edit the entire set of data. The users often double click the row just to view the data. I have a rule that no more than 2 fields may be edited in a grid and absolutely no controls other than a textblock/box are to be used in a grid.
Never underestimate the power of human stupidity RAH
-
That design would drive nuts, double click to edit a single cell, double click to end editing, rinse and repeat. Plus you have horizontal scroll so you cannot see the entire row of data. I use the dialog style because the user can double click on a row and see and edit the entire set of data. The users often double click the row just to view the data. I have a rule that no more than 2 fields may be edited in a grid and absolutely no controls other than a textblock/box are to be used in a grid.
Never underestimate the power of human stupidity RAH
I agree. However, this is an application for engineers rather than general consumers, and this particular view displays configuration settings that will only be examined by two or three people who are based in our company (super users). The values are rather abstruse, and control fine details of a display device. Most of the time users will just examine the values, and maybe tweak one or two. For general editing we stream the data to and from a .CSV file. So in practice this horrible view will be okay.
-
I agree. However, this is an application for engineers rather than general consumers, and this particular view displays configuration settings that will only be examined by two or three people who are based in our company (super users). The values are rather abstruse, and control fine details of a display device. Most of the time users will just examine the values, and maybe tweak one or two. For general editing we stream the data to and from a .CSV file. So in practice this horrible view will be okay.
Leif Simon Goodwin wrote:
this is an application for engineers
You don't like your engineers!!! Sorry but that is no excuse for a lousy design.
Never underestimate the power of human stupidity RAH
-
I agree. However, this is an application for engineers rather than general consumers, and this particular view displays configuration settings that will only be examined by two or three people who are based in our company (super users). The values are rather abstruse, and control fine details of a display device. Most of the time users will just examine the values, and maybe tweak one or two. For general editing we stream the data to and from a .CSV file. So in practice this horrible view will be okay.
I get the impression you don't "understand" the purpose of these "configuration settings"; and because there are "a lot of them", a "grid" should do the trick. Have you "talked" to the "engineers"? WPF has the ability to "expand" "details" of a selected row. One can have a list view of "grids"; etc. What's missing is a UI "visual" designer; who's familiar with WPF (or not at all) ... oh, and familiar with the problem domain.
"(I) am amazed to see myself here rather than there ... now rather than then". ― Blaise Pascal
-
Leif Simon Goodwin wrote:
this is an application for engineers
You don't like your engineers!!! Sorry but that is no excuse for a lousy design.
Never underestimate the power of human stupidity RAH
This is the design requested by the engineers including the technical director. It's the one they use in the current application (which the new one replaces).
-
Leif Simon Goodwin wrote:
this is an application for engineers
You don't like your engineers!!! Sorry but that is no excuse for a lousy design.
Never underestimate the power of human stupidity RAH
This is the design requested by the firmware engineers including the technical director, and does all that they need. They have the same layout in the current application, which the new one replaces.