CODEWITHSUNDEEP
c#wpf
user3077913
user3077913

Reputation: 21

ScrollViewer does not work with grid in wpf

I want to have a vertical scrollbar on my grid, which seems straightforward enough but for some reason it just won't work. When I set VerticalScrollBarVisibility to visible it shows up but does nothing. When it is set to auto it does not show up at all.

I have read the advice on this website but it doesn't seem to work for me. I know that rows should be set to fixed height or * and I have a combination of both. I also tried setting the max height of the grid and the height of the scroll bar, as was suggested, but neither of those worked either.

This is how I have it set up (the grid is within a tab):

</TabItem.Header>
<ScrollViewer VerticalScrollBarVisibility="Auto">
<Grid Name="CSGrid">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="400"/>
        <ColumnDefinition Width="200"/>
        <ColumnDefinition Width="200"/>
        <ColumnDefinition Width="200"/>
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="20"/>
        <RowDefinition Height="5"/>
        <RowDefinition Height="1"/>
        <RowDefinition Height="20"/>
        <RowDefinition Height="20"/>
        <RowDefinition Height="20"/>
        ...

I then have a large number of rows whose contents I set through C# code, if that makes a difference. All of the heights are set to 20. After that I also have a number of rectangles and textblocks in the grid, nothing that I would imagine would be problematic - unless they would make a difference somehow?

In the code I add text to the rows like this:

TextBlock hist1 = new TextBlock();
TextBlock hist2 = new TextBlock();
TextBlock hist3 = new TextBlock();
TextBlock hist4 = new TextBlock();
TextBlock hist5 = new TextBlock();

string[] allHist = File.ReadAllLines("MedicalHistory.txt");

hist1.Text = allHist[0];
hist2.Text = allHist[1];
hist3.Text = allHist[2];
hist4.Text = allHist[3];
hist5.Text = allHist[4];

CSGrid.Children.Add(hist1);
CSGrid.Children.Add(hist2);
CSGrid.Children.Add(hist3);
CSGrid.Children.Add(hist4);
CSGrid.Children.Add(hist5);

Grid.SetColumn(hist1, 0);
Grid.SetColumn(hist2, 0);
Grid.SetColumn(hist3, 0);
Grid.SetColumn(hist4, 0);
Grid.SetColumn(hist5, 0);

Grid.SetRow(hist1, 5);
Grid.SetRow(hist2, 6);
Grid.SetRow(hist3, 7);
Grid.SetRow(hist4, 8);
Grid.SetRow(hist5, 9);

Any help would be greatly appreciated

Upvotes: 2

Views: 28663

Answers (3)

SangDong
SangDong

Reputation: 11

<Window x:Class="TestApp13.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:src="clr-namespace:TestApp13"
    Title ="Title" Height="600" Width="800">
<TabControl>
    <TabItem Header="Tab 1">
        <ScrollViewer Hight="500">
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="200"/>
                    <RowDefinition Height="200"/>
                    <RowDefinition Height="200"/>
                    <RowDefinition Height="200"/>
                    <RowDefinition Height="200"/>
                    <RowDefinition Height="2000"/>
                </Grid.RowDefinitions>
                <Button Width="100" Height="30" Grid.Row="0"/>
                <Button Width="100" Height="30" Grid.Row="1"/>
                <Button Width="100" Height="30" Grid.Row="2"/>
                <Button Width="100" Height="30" Grid.Row="3"/>
                <Button Width="100" Height="30" Grid.Row="4"/>
                <Button Width="100" Height="30" Grid.Row="5"/>
            </Grid>
        </ScrollViewer>
    </TabItem>
</TabControl>

Upvotes: 0

Ali Yousefi
Ali Yousefi

Reputation: 2745

Use ScrollViewer.CanContentScroll="True" in your Grid:

<ScrollViewer VerticalScrollBarVisibility="Auto">
<Grid Name="CSGrid" ScrollViewer.CanContentScroll="True">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="400"/>
        <ColumnDefinition Width="200"/>
        <ColumnDefinition Width="200"/>
        <ColumnDefinition Width="200"/>
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="20"/>
        <RowDefinition Height="5"/>
        <RowDefinition Height="1"/>
        <RowDefinition Height="20"/>
        <RowDefinition Height="20"/>
        <RowDefinition Height="20"/>
        ...

Upvotes: 6

Zafer Ayan
Zafer Ayan

Reputation: 801

You should set RowDefinition Height property more than TabControlHeight.

I coded this for you and works fine:

<Window x:Class="TestApp13.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:src="clr-namespace:TestApp13"
    Title ="Title" Height="600" Width="800">
<TabControl>
    <TabItem Header="Tab 1">
        <ScrollViewer VerticalScrollBarVisibility="Auto">
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="200"/>
                    <RowDefinition Height="200"/>
                    <RowDefinition Height="200"/>
                    <RowDefinition Height="200"/>
                    <RowDefinition Height="200"/>
                    <RowDefinition Height="2000"/>
                </Grid.RowDefinitions>
                <Button Width="100" Height="30" Grid.Row="0"/>
                <Button Width="100" Height="30" Grid.Row="1"/>
                <Button Width="100" Height="30" Grid.Row="2"/>
                <Button Width="100" Height="30" Grid.Row="3"/>
                <Button Width="100" Height="30" Grid.Row="4"/>
                <Button Width="100" Height="30" Grid.Row="5"/>
            </Grid>
        </ScrollViewer>
    </TabItem>
</TabControl>

Upvotes: 2

Related Questions