how can I enable scrollbars on the WPF Datagrid?

Question

When I run the following Northwind WPF Toolkit Datagrid code from this article, I get a datagrid, but there are no scrollbars and hence the user can only see part of the datagrid. I am using the newest version March 2009.

What do I need to specify so that the WPF Datagrid has scrollbars?

I tried putting the datagrid in a ScrollViewer but that didn't help.

XAML:

<Window x:Class="TestDataGrid566.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:toolkit="http://schemas.microsoft.com/wpf/2008/toolkit"
    Title="Window1" Height="600" Width="800">
    <StackPanel>
        <toolkit:DataGrid x:Name="TheDataGrid" AutoGenerateColumns="True"/>
    </StackPanel>
</Window>

code-behind:

using System.Linq;
using System.Windows;
using TestDataGrid566.Model;

namespace TestDataGrid566
{
    public partial class Window1 : Window
    {
        public Window1()
        {
            InitializeComponent();

            NorthwindDataContext db = new NorthwindDataContext();
            var customers = from c in db.Customers
                            select c;
            TheDataGrid.ItemsSource = customers;
        }
    }
}

Possible duplicate of [WPF Datagrid - Not showing any Scrollbar](https://stackoverflow.com/questions/24015890/wpf-datagrid-not-showing-any-scrollbar) — NoWar, Nov 03 '17 at 03:10

score 115 · Accepted Answer · edited Sep 27 '11 at 14:55

115

Put the DataGrid in a Grid, DockPanel, ContentControl or directly in the Window. A vertically-oriented StackPanel will give its children whatever vertical space they ask for - even if that means it is rendered out of view.

edited Sep 27 '11 at 14:55

answered Mar 23 '09 at 14:28

Kent Boogaart

175,602
35
392
393

1

To add to this, a `HeaderedContentControl` is implemented internally with a `StackPanel` which will cause a `DataGrid` to behave in a manner inconsistent with the `ContentControl`. – user7116 Mar 08 '12 at 19:08
7

I thought this advice was rubbish for hours, until I finally spotted the StackPanel tag lurking unseen at the top of my XAML. Thanks! – Ted Mar 15 '13 at 11:25
2

Also having a vertically-oriented Stackpanel will hinder Virtualization and affect application performance. – kiran Aug 28 '14 at 11:29
4

Also, if the DataGrid is placed in a Grid Row, do not use "Auto", as this will allow the datagrid to expand off the screen--without scrollbars. To show scroll bars, a size must be explicitly given to the DataGrid -- as in * or a number. – Alan Wayne Jul 07 '19 at 18:39

score 61 · Answer 2 · edited Dec 07 '11 at 21:12

61

WPF4

<DataGrid AutoGenerateColumns="True" Grid.Column="0" Grid.Row="0"
      ScrollViewer.CanContentScroll="True" 
      ScrollViewer.VerticalScrollBarVisibility="Auto"
      ScrollViewer.HorizontalScrollBarVisibility="Auto">
</DataGrid>

with : <ColumnDefinition Width="350" /> & <RowDefinition Height="300" /> works fine.

Scrollbars don't show with <ColumnDefinition Width="Auto" /> & <RowDefinition Height="300" />.

Also works fine with: <ColumnDefinition Width="*" /> & <RowDefinition Height="300" /> in the case where this is nested within an outer <Grid>.

edited Dec 07 '11 at 21:12

Matt Hamsmith

3,955
1
27
42

answered Feb 08 '11 at 14:18

Peter Darvas

649
5
4

4

@Konrad Viltersten `ScrollViewer` is an attached property. – xmedeko Feb 16 '16 at 17:09

score 25 · Answer 3 · edited Mar 27 '19 at 12:11

25

If any of the parent containers RowDefinition Height set to "Auto" also stoppers for scrollbars

Alternatively you may set Height "*"

Which happened in my case.

edited Mar 27 '19 at 12:11

adiga

34,372
9
61
83

answered May 25 '15 at 07:06

Jay

1,869
3
25
44

score 21 · Answer 4 · edited Mar 27 '19 at 12:11

21

Adding MaxHeight and VerticalScrollBarVisibility="Auto" on the DataGrid solved my problem.

edited Mar 27 '19 at 12:11

adiga

34,372
9
61
83

answered May 12 '16 at 09:27

Alex Albu

693
1
12
20

2

Yeah, this is effective. Solved my issue perfectly. Thanks~ – Bravo Yeung May 09 '19 at 10:43
3

Best answer in my humble opinion. – Sachin Kainth Jun 04 '19 at 12:39

score 4 · Answer 5 · edited Mar 27 '19 at 12:11

4

Add grid with defined height and width for columns and rows. Then add ScrollViewer and inside it add the dataGrid.

edited Mar 27 '19 at 12:11

adiga

34,372
9
61
83

answered Jun 03 '16 at 14:21

Bianca

41
1

If you prefer to keep the StackPanel, you can. Just define the height of the DataGrid. There is no need to enclose in ScrollViewer because then you would get 2 scroll bars which is probably not what you want. `` – H2ONaCl Feb 15 '22 at 04:44

score 1 · Answer 6 · edited Mar 27 '19 at 12:10

1

In my case I had to set MaxHeight and replace IsEnabled="False" by IsReadOnly="True"

edited Mar 27 '19 at 12:10

adiga

34,372
9
61
83

answered Mar 27 '19 at 12:07

Lucas

57
8

score 0 · Answer 7 · answered Jul 24 '20 at 17:16

0

This worked for me. The key is to use * as Row height.

<Grid x:Name="grid">
        <Grid.RowDefinitions>
            <RowDefinition Height="60"/>
            <RowDefinition Height="*"/>
            <RowDefinition Height="10"/>
        </Grid.RowDefinitions>

        <TabControl  Grid.Row="1" x:Name="tabItem">
                <TabItem x:Name="ta" 
                        Header="List of all Clients">
                        <DataGrid Name="clientsgrid" AutoGenerateColumns="True" Margin="2" 
                         ></DataGrid>
                </TabItem>
        </TabControl>
    
    </Grid>

answered Jul 24 '20 at 17:16

Sivadas Rajan

578
5
9

i don't know why a simple solution like this has been down voted - i can confirm, this simple (without bla bla and complex stuff) works perfectly for me - thanks! – Christian Casutt Feb 21 '21 at 07:24
2

@ChristianCasutt Because just by looking at it, it's more likely that the TabItem is affecting the outcome. When I use * for the height on my row that contains a datagrid, it doesn't work. – Dan Rayson Apr 02 '21 at 20:57

how can I enable scrollbars on the WPF Datagrid?

7 Answers7

Linked