Loading 2 DataGrids + StackPanel with ScrollViewer Taking too long, Alternatives?
I have 3 content items, two DataGrid
and a StackPanel
that all need to scroll together in a WPF application. Everything works OK with ScrollViewer
as long as I only have a small dataset, but when I get to 500 rows with 150 columns, it lags for about 8 seconds before drawing the screen. After reading this: Unreasonable WPF DataGrid Loading Time I disabled the ScrollViewer
and it loaded in just 2.5 seconds.
<ScrollViewer CanContentScroll="True"
HorizontalScrollBarVisibility="Visible"
VerticalScrollBarVisibility="Visible">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="20" />
<RowDefinition Height="22" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<DataGrid x:Name="DataGridViewHeader" CellEditEnding="ColumnNameUpdate" Grid.Row="0" HeadersVisibility="None" HorizontalAlignment="Stretch" Margin="0,0,0,0" VerticalAlignment="Stretch" ItemsSource="{Binding}" CurrentCellChanged="DataGridCellChange" Grid.Column="0" DataGridCell.Selected="DataGrid_GotFocus" />
<StackPanel Orientation="Horizontal" VerticalAlignment="Top" Name="ComboBoxPanel" Grid.Row="1" Margin="0,0,0,0" HorizontalAlignment="Left" >
</StackPanel>
<DataGrid x:Name="DataGridView" Grid.Row="2" HeadersVisibility="None" HorizontalAlignment="Stretch" Margin="0,0,0,0" VerticalAlignment="Stretch" ItemsSource="{Binding}" CurrentCellChanged="DataGridCellChange" Grid.Column="0"/>
</Grid>
</ScrollViewer>
The trouble is, that the ScrollViewer
offers the following layout, which allows me to rename columns at the top, use a dropdown on the second row to select DataType
of that column and then shows the data. With 150 columns, they have to all stay lined up, but performance is taking a huge hit.
While I realize that ScrollViewer
is an easy solution, is there a better way when taking performance into account?
wpf datagrid scrollview scrollbar
add a comment |
I have 3 content items, two DataGrid
and a StackPanel
that all need to scroll together in a WPF application. Everything works OK with ScrollViewer
as long as I only have a small dataset, but when I get to 500 rows with 150 columns, it lags for about 8 seconds before drawing the screen. After reading this: Unreasonable WPF DataGrid Loading Time I disabled the ScrollViewer
and it loaded in just 2.5 seconds.
<ScrollViewer CanContentScroll="True"
HorizontalScrollBarVisibility="Visible"
VerticalScrollBarVisibility="Visible">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="20" />
<RowDefinition Height="22" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<DataGrid x:Name="DataGridViewHeader" CellEditEnding="ColumnNameUpdate" Grid.Row="0" HeadersVisibility="None" HorizontalAlignment="Stretch" Margin="0,0,0,0" VerticalAlignment="Stretch" ItemsSource="{Binding}" CurrentCellChanged="DataGridCellChange" Grid.Column="0" DataGridCell.Selected="DataGrid_GotFocus" />
<StackPanel Orientation="Horizontal" VerticalAlignment="Top" Name="ComboBoxPanel" Grid.Row="1" Margin="0,0,0,0" HorizontalAlignment="Left" >
</StackPanel>
<DataGrid x:Name="DataGridView" Grid.Row="2" HeadersVisibility="None" HorizontalAlignment="Stretch" Margin="0,0,0,0" VerticalAlignment="Stretch" ItemsSource="{Binding}" CurrentCellChanged="DataGridCellChange" Grid.Column="0"/>
</Grid>
</ScrollViewer>
The trouble is, that the ScrollViewer
offers the following layout, which allows me to rename columns at the top, use a dropdown on the second row to select DataType
of that column and then shows the data. With 150 columns, they have to all stay lined up, but performance is taking a huge hit.
While I realize that ScrollViewer
is an easy solution, is there a better way when taking performance into account?
wpf datagrid scrollview scrollbar
My suggestion would be to use Paging on Datagrid to show minimum of 20 records. Now if user needs to search a particular record, you can provide a text filer above the grid, where the record will displayed instantly.
– Satish Pai
Nov 15 '18 at 16:41
It is a good suggestion, but not ideal. I am building a universal binary database parser youtube.com/watch?v=OMeghA82kSk and sometimes the records that help you identify the column and datatype are not visible in the first 100 or so records. I have updated my GUI to allow you to use sliders to select how many records to pull, but still would love to fix this performance issue if possible.
– Alan
Nov 15 '18 at 16:52
reasonable solution will be to have only one DataGird instead of all 2 DataGrids+StackPanel inside ScrollViewer. Retemplate DataGrid headers so each of them includes dropdown
– ASh
Nov 15 '18 at 18:32
Thanks ASh, that was what I wanted, but couldn't make headway with that when I tried here: stackoverflow.com/questions/53288632/…, here: stackoverflow.com/questions/53272634/…, or here: stackoverflow.com/questions/53215418/… So I ended up with this method
– Alan
Nov 15 '18 at 20:41
add a comment |
I have 3 content items, two DataGrid
and a StackPanel
that all need to scroll together in a WPF application. Everything works OK with ScrollViewer
as long as I only have a small dataset, but when I get to 500 rows with 150 columns, it lags for about 8 seconds before drawing the screen. After reading this: Unreasonable WPF DataGrid Loading Time I disabled the ScrollViewer
and it loaded in just 2.5 seconds.
<ScrollViewer CanContentScroll="True"
HorizontalScrollBarVisibility="Visible"
VerticalScrollBarVisibility="Visible">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="20" />
<RowDefinition Height="22" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<DataGrid x:Name="DataGridViewHeader" CellEditEnding="ColumnNameUpdate" Grid.Row="0" HeadersVisibility="None" HorizontalAlignment="Stretch" Margin="0,0,0,0" VerticalAlignment="Stretch" ItemsSource="{Binding}" CurrentCellChanged="DataGridCellChange" Grid.Column="0" DataGridCell.Selected="DataGrid_GotFocus" />
<StackPanel Orientation="Horizontal" VerticalAlignment="Top" Name="ComboBoxPanel" Grid.Row="1" Margin="0,0,0,0" HorizontalAlignment="Left" >
</StackPanel>
<DataGrid x:Name="DataGridView" Grid.Row="2" HeadersVisibility="None" HorizontalAlignment="Stretch" Margin="0,0,0,0" VerticalAlignment="Stretch" ItemsSource="{Binding}" CurrentCellChanged="DataGridCellChange" Grid.Column="0"/>
</Grid>
</ScrollViewer>
The trouble is, that the ScrollViewer
offers the following layout, which allows me to rename columns at the top, use a dropdown on the second row to select DataType
of that column and then shows the data. With 150 columns, they have to all stay lined up, but performance is taking a huge hit.
While I realize that ScrollViewer
is an easy solution, is there a better way when taking performance into account?
wpf datagrid scrollview scrollbar
I have 3 content items, two DataGrid
and a StackPanel
that all need to scroll together in a WPF application. Everything works OK with ScrollViewer
as long as I only have a small dataset, but when I get to 500 rows with 150 columns, it lags for about 8 seconds before drawing the screen. After reading this: Unreasonable WPF DataGrid Loading Time I disabled the ScrollViewer
and it loaded in just 2.5 seconds.
<ScrollViewer CanContentScroll="True"
HorizontalScrollBarVisibility="Visible"
VerticalScrollBarVisibility="Visible">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="20" />
<RowDefinition Height="22" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<DataGrid x:Name="DataGridViewHeader" CellEditEnding="ColumnNameUpdate" Grid.Row="0" HeadersVisibility="None" HorizontalAlignment="Stretch" Margin="0,0,0,0" VerticalAlignment="Stretch" ItemsSource="{Binding}" CurrentCellChanged="DataGridCellChange" Grid.Column="0" DataGridCell.Selected="DataGrid_GotFocus" />
<StackPanel Orientation="Horizontal" VerticalAlignment="Top" Name="ComboBoxPanel" Grid.Row="1" Margin="0,0,0,0" HorizontalAlignment="Left" >
</StackPanel>
<DataGrid x:Name="DataGridView" Grid.Row="2" HeadersVisibility="None" HorizontalAlignment="Stretch" Margin="0,0,0,0" VerticalAlignment="Stretch" ItemsSource="{Binding}" CurrentCellChanged="DataGridCellChange" Grid.Column="0"/>
</Grid>
</ScrollViewer>
The trouble is, that the ScrollViewer
offers the following layout, which allows me to rename columns at the top, use a dropdown on the second row to select DataType
of that column and then shows the data. With 150 columns, they have to all stay lined up, but performance is taking a huge hit.
While I realize that ScrollViewer
is an easy solution, is there a better way when taking performance into account?
wpf datagrid scrollview scrollbar
wpf datagrid scrollview scrollbar
edited Nov 15 '18 at 20:41
Alan
asked Nov 15 '18 at 16:25
AlanAlan
826818
826818
My suggestion would be to use Paging on Datagrid to show minimum of 20 records. Now if user needs to search a particular record, you can provide a text filer above the grid, where the record will displayed instantly.
– Satish Pai
Nov 15 '18 at 16:41
It is a good suggestion, but not ideal. I am building a universal binary database parser youtube.com/watch?v=OMeghA82kSk and sometimes the records that help you identify the column and datatype are not visible in the first 100 or so records. I have updated my GUI to allow you to use sliders to select how many records to pull, but still would love to fix this performance issue if possible.
– Alan
Nov 15 '18 at 16:52
reasonable solution will be to have only one DataGird instead of all 2 DataGrids+StackPanel inside ScrollViewer. Retemplate DataGrid headers so each of them includes dropdown
– ASh
Nov 15 '18 at 18:32
Thanks ASh, that was what I wanted, but couldn't make headway with that when I tried here: stackoverflow.com/questions/53288632/…, here: stackoverflow.com/questions/53272634/…, or here: stackoverflow.com/questions/53215418/… So I ended up with this method
– Alan
Nov 15 '18 at 20:41
add a comment |
My suggestion would be to use Paging on Datagrid to show minimum of 20 records. Now if user needs to search a particular record, you can provide a text filer above the grid, where the record will displayed instantly.
– Satish Pai
Nov 15 '18 at 16:41
It is a good suggestion, but not ideal. I am building a universal binary database parser youtube.com/watch?v=OMeghA82kSk and sometimes the records that help you identify the column and datatype are not visible in the first 100 or so records. I have updated my GUI to allow you to use sliders to select how many records to pull, but still would love to fix this performance issue if possible.
– Alan
Nov 15 '18 at 16:52
reasonable solution will be to have only one DataGird instead of all 2 DataGrids+StackPanel inside ScrollViewer. Retemplate DataGrid headers so each of them includes dropdown
– ASh
Nov 15 '18 at 18:32
Thanks ASh, that was what I wanted, but couldn't make headway with that when I tried here: stackoverflow.com/questions/53288632/…, here: stackoverflow.com/questions/53272634/…, or here: stackoverflow.com/questions/53215418/… So I ended up with this method
– Alan
Nov 15 '18 at 20:41
My suggestion would be to use Paging on Datagrid to show minimum of 20 records. Now if user needs to search a particular record, you can provide a text filer above the grid, where the record will displayed instantly.
– Satish Pai
Nov 15 '18 at 16:41
My suggestion would be to use Paging on Datagrid to show minimum of 20 records. Now if user needs to search a particular record, you can provide a text filer above the grid, where the record will displayed instantly.
– Satish Pai
Nov 15 '18 at 16:41
It is a good suggestion, but not ideal. I am building a universal binary database parser youtube.com/watch?v=OMeghA82kSk and sometimes the records that help you identify the column and datatype are not visible in the first 100 or so records. I have updated my GUI to allow you to use sliders to select how many records to pull, but still would love to fix this performance issue if possible.
– Alan
Nov 15 '18 at 16:52
It is a good suggestion, but not ideal. I am building a universal binary database parser youtube.com/watch?v=OMeghA82kSk and sometimes the records that help you identify the column and datatype are not visible in the first 100 or so records. I have updated my GUI to allow you to use sliders to select how many records to pull, but still would love to fix this performance issue if possible.
– Alan
Nov 15 '18 at 16:52
reasonable solution will be to have only one DataGird instead of all 2 DataGrids+StackPanel inside ScrollViewer. Retemplate DataGrid headers so each of them includes dropdown
– ASh
Nov 15 '18 at 18:32
reasonable solution will be to have only one DataGird instead of all 2 DataGrids+StackPanel inside ScrollViewer. Retemplate DataGrid headers so each of them includes dropdown
– ASh
Nov 15 '18 at 18:32
Thanks ASh, that was what I wanted, but couldn't make headway with that when I tried here: stackoverflow.com/questions/53288632/…, here: stackoverflow.com/questions/53272634/…, or here: stackoverflow.com/questions/53215418/… So I ended up with this method
– Alan
Nov 15 '18 at 20:41
Thanks ASh, that was what I wanted, but couldn't make headway with that when I tried here: stackoverflow.com/questions/53288632/…, here: stackoverflow.com/questions/53272634/…, or here: stackoverflow.com/questions/53215418/… So I ended up with this method
– Alan
Nov 15 '18 at 20:41
add a comment |
1 Answer
1
active
oldest
votes
remove ScrollViewer and add
VirtualizingStackPanel.IsVirtualizing="True"
VirtualizingStackPanel.VirtualizationMode = "recycling"
EnableColumnVirtualization = "true"
EnableRowVirtualization = "true"
VirtualizingPanel.IsVirtualizingWhenGrouping="True"
MaxWidth="2560" MaxHeight="1600"
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53323826%2floading-2-datagrids-stackpanel-with-scrollviewer-taking-too-long-alternatives%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
remove ScrollViewer and add
VirtualizingStackPanel.IsVirtualizing="True"
VirtualizingStackPanel.VirtualizationMode = "recycling"
EnableColumnVirtualization = "true"
EnableRowVirtualization = "true"
VirtualizingPanel.IsVirtualizingWhenGrouping="True"
MaxWidth="2560" MaxHeight="1600"
add a comment |
remove ScrollViewer and add
VirtualizingStackPanel.IsVirtualizing="True"
VirtualizingStackPanel.VirtualizationMode = "recycling"
EnableColumnVirtualization = "true"
EnableRowVirtualization = "true"
VirtualizingPanel.IsVirtualizingWhenGrouping="True"
MaxWidth="2560" MaxHeight="1600"
add a comment |
remove ScrollViewer and add
VirtualizingStackPanel.IsVirtualizing="True"
VirtualizingStackPanel.VirtualizationMode = "recycling"
EnableColumnVirtualization = "true"
EnableRowVirtualization = "true"
VirtualizingPanel.IsVirtualizingWhenGrouping="True"
MaxWidth="2560" MaxHeight="1600"
remove ScrollViewer and add
VirtualizingStackPanel.IsVirtualizing="True"
VirtualizingStackPanel.VirtualizationMode = "recycling"
EnableColumnVirtualization = "true"
EnableRowVirtualization = "true"
VirtualizingPanel.IsVirtualizingWhenGrouping="True"
MaxWidth="2560" MaxHeight="1600"
answered Dec 18 '18 at 8:21
Ghotekar RahulGhotekar Rahul
134
134
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53323826%2floading-2-datagrids-stackpanel-with-scrollviewer-taking-too-long-alternatives%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
My suggestion would be to use Paging on Datagrid to show minimum of 20 records. Now if user needs to search a particular record, you can provide a text filer above the grid, where the record will displayed instantly.
– Satish Pai
Nov 15 '18 at 16:41
It is a good suggestion, but not ideal. I am building a universal binary database parser youtube.com/watch?v=OMeghA82kSk and sometimes the records that help you identify the column and datatype are not visible in the first 100 or so records. I have updated my GUI to allow you to use sliders to select how many records to pull, but still would love to fix this performance issue if possible.
– Alan
Nov 15 '18 at 16:52
reasonable solution will be to have only one DataGird instead of all 2 DataGrids+StackPanel inside ScrollViewer. Retemplate DataGrid headers so each of them includes dropdown
– ASh
Nov 15 '18 at 18:32
Thanks ASh, that was what I wanted, but couldn't make headway with that when I tried here: stackoverflow.com/questions/53288632/…, here: stackoverflow.com/questions/53272634/…, or here: stackoverflow.com/questions/53215418/… So I ended up with this method
– Alan
Nov 15 '18 at 20:41