WPF XAML ScrollViewer will not scroll

0
votes

I cannot get my scrollviewer to scroll

If I set the VerticalScrollBarVisibility="Auto" it doesn't even show which indicates it doesn't think it is needed

I have tried different things with the Row heights of my grid like changing them from auto to * but still no luck

Here is my XAML

<UserControl mc:Ignorable="d" Height="680" Width="750"
         d:DesignHeight="300" d:DesignWidth="300">

<Border Name="b" Margin="10,0,10,10" Style="{DynamicResource BorderStyle}" Background="{DynamicResource BackgroundBrush}">
    <DockPanel x:Name="MainPanel">

        <!-- header area -->
        <DockPanel Margin="10,0,10,0" DockPanel.Dock="Top" Height="80" x:Name="HeaderPanel">
            <TextBlock Text="Uncertainty in Sample - Volume Final and Volume Initial" Style="{DynamicResource HeaderStyle}" FontWeight="Bold" Margin="5,0,0,0" VerticalAlignment="Center" Foreground="{DynamicResource HeaderFontColor}"/>
            <Image Source="/images/sample.jpg" HorizontalAlignment="Right"></Image>
        </DockPanel>

     <Border Name="b">
        <StackPanel>

            <Separator Height="1" Margin="0" VerticalAlignment="Top" Width="750" HorizontalAlignment="Left"/>

            <ScrollViewer VerticalScrollBarVisibility="Auto" MaxHeight="{Binding Path=ActualHeight, ElementName=b, Mode=OneWay}">                    <Grid HorizontalAlignment="Left" x:Name="Outer" VerticalAlignment="Top" Margin="0,10,0,0">

                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto" />
                        <ColumnDefinition Width="Auto" />
                        <ColumnDefinition Width="Auto" />
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="Auto" />
                    </Grid.RowDefinitions>

                    <GroupBox Grid.Row="0" Grid.Column="0" Header="Volume Final" Style="{DynamicResource GroupBoxStyle}">

                        <Grid HorizontalAlignment="Left" x:Name="GridVolume" VerticalAlignment="Top" Margin="0,0,0,0">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="Auto" />
                                <ColumnDefinition Width="Auto" />
                            </Grid.ColumnDefinitions>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto" />
                                <RowDefinition Height="Auto" />
                                <RowDefinition Height="Auto" />
                            </Grid.RowDefinitions>

                            <Label Grid.Row="0" Grid.Column="0" Content="Select Volumetric size:" Target="{Binding ElementName=VolumetricComboBox, Mode=OneWay}" Foreground="{DynamicResource InputFontColor}" />
                            <ComboBox x:Name="VolumetricComboBox" Grid.Row="0" Grid.Column="1" Width="180" HorizontalAlignment="Left" Margin="5,0,0,0" DisplayMemberPath="Label" ItemsSource="{Binding Path=Volumetrics}" SelectedItem="{Binding Path=SelectedVolumeFinalVolumetric, Mode=TwoWay}" Height="22" />


                            <Label Grid.Row="1" Grid.Column="0" Content="Select Solvent:" Target="{Binding ElementName=SolventComboBox, Mode=OneWay}" Foreground="{DynamicResource InputFontColor}" />
                        <ComboBox x:Name="SolventComboBox" Grid.Row="1" Grid.Column="1" Width="180" HorizontalAlignment="Left" Margin="5,0,0,0" DisplayMemberPath="Solvent" ItemsSource="{Binding Path=ThermalExpansions}" SelectedItem="{Binding Path=SelectedVolumeFinalThermalExpansion, Mode=TwoWay}" Height="22" />

                            <Label Grid.Row="2" Grid.Column="0" Content="Select Temperature (° c):" Target="{Binding ElementName=SolventComboBox, Mode=OneWay}" Foreground="{DynamicResource InputFontColor}" />
                        <ComboBox x:Name="TemperatureComboBox" Grid.Row="2" Grid.Column="1" Width="180" HorizontalAlignment="Left" Margin="5,0,0,0" DisplayMemberPath="TemperatureValue" ItemsSource="{Binding Path=Temperatures}" SelectedItem="{Binding Path=SelectedVolumeFinalTemperature, Mode=TwoWay}" Height="22" />

                        </Grid>
                    </GroupBox>


                    <GroupBox Grid.Row="0" Grid.Column="1" Header="Area" Style="{DynamicResource GroupBoxStyle}">
                        <StackPanel>
                            <StackPanel Orientation="Horizontal" VerticalAlignment="Top">
                                <Label Content="System Inj. Reproducibility (% RSD):" Foreground="{DynamicResource InputFontColor}" />
                                <TextBox TextWrapping="Wrap" Style="{StaticResource TextStyle}" x:Name="SystemInjectionTextBox" Width="135" Text="{Binding Path=Sample.Precision.SystemInjectionReproducibility}" Margin="5,0,0,0" IsEnabled="True"/>
                            </StackPanel>
                            <StackPanel Orientation="Horizontal" VerticalAlignment="Top">
                                <Label Content="Enter % RSD of Sample results (zero if unknown):" Target="{Binding ElementName=AreaTextBox, Mode=OneWay}" Foreground="{DynamicResource InputFontColor}"/>
                                <TextBox TextWrapping="Wrap" Style="{StaticResource TextStyle}" x:Name="AreaTextBox" Width="70" Text="{Binding Path=Sample.Precision.RSDKnownAmount}" HorizontalAlignment="Left" Margin="5,0,0,0" />
                            </StackPanel>
                        </StackPanel>
                    </GroupBox>

                    <GroupBox Grid.Row="1" Grid.Column="0" Header="Volume Initial" Style="{DynamicResource GroupBoxStyle}">
                        <Grid HorizontalAlignment="Left" x:Name="GridMass" VerticalAlignment="Top" Margin="0,10,0,0">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="Auto" />
                                <ColumnDefinition Width="Auto" />
                            </Grid.ColumnDefinitions>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto" />
                                <RowDefinition Height="Auto" />
                            </Grid.RowDefinitions>

                            <Label Grid.Row="0" Grid.Column="0" Content="Select Balance:" Target="{Binding ElementName=BalanceComboBox, Mode=OneWay}" Foreground="{DynamicResource InputFontColor}" />
                            <ComboBox x:Name="BalanceComboBox" Grid.Row="0" Grid.Column="1" Width="180" HorizontalAlignment="Left" Margin="5,0,0,0" DisplayMemberPath="Description" ItemsSource="{Binding Path=Balances}" SelectedItem="{Binding Path=SelectedVolumeIntitialBalance, Mode=TwoWay}" Height="22" />

                            <Label Grid.Row="1" Grid.Column="0" Content="Mass Weighed (g):" Target="{Binding ElementName=MassWeighedTextBox, Mode=OneWay}" Foreground="{DynamicResource InputFontColor}" />
                            <TextBox Grid.Row="1" Grid.Column="1" TextWrapping="Wrap" Style="{StaticResource TextStyle}" x:Name="MassWeighedTextBox" Width="135" Text="{Binding Path=Sample.VolumeInitial.Mass.MassWeighed}" HorizontalAlignment="Left" Margin="5,0,0,0"/>
                        </Grid>

                    </GroupBox>

                    <GroupBox Grid.Row="2" Grid.Column="0" Header="Reported Units" Style="{DynamicResource GroupBoxStyle}">
                        <Grid HorizontalAlignment="Left" x:Name="GridReportedUnits" VerticalAlignment="Top" Margin="0,10,0,0">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="Auto" />
                                <ColumnDefinition Width="Auto" />
                            </Grid.ColumnDefinitions>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto" />
                            </Grid.RowDefinitions>

                            <Label Grid.Row="0" Grid.Column="0" Content="Select Reported Units:" Target="{Binding ElementName=BalanceComboBox, Mode=OneWay}" Foreground="{DynamicResource InputFontColor}" />
                            <StackPanel Grid.Row="0" Grid.Column="1" Orientation="Horizontal" VerticalAlignment="Center">
                                <StackPanel.Resources>
                                    <views:EnumBooleanConverter x:Key="enumBooleanConverter" />
                                </StackPanel.Resources>
                                <RadioButton GroupName="ReportedUnits" Content="W/V" IsChecked="{Binding Path=SelectedRadioButton, Converter={StaticResource enumBooleanConverter}, ConverterParameter=WeightVolume}" Command="{Binding RadioClicked}" Margin="0, 0, 10, 0" />
                                <RadioButton GroupName="ReportedUnits" Content="W/W" IsChecked="{Binding Path=SelectedRadioButton, Converter={StaticResource enumBooleanConverter}, ConverterParameter=WeightWeight}" Command="{Binding RadioClicked}" Margin="0, 0, 10, 0"/>
                            </StackPanel>
                        </Grid>
                    </GroupBox>

                    <GroupBox Grid.ColumnSpan="3" Grid.Row="3" Header="Density" Style="{DynamicResource GroupBoxStyle}" Visibility="{Binding Path=DensityVisible}">

                        <StackPanel>
                            <Grid HorizontalAlignment="Left" x:Name="GridDensity" VerticalAlignment="Top" Margin="5,5,0,0">
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="Auto" />
                                    <ColumnDefinition Width="Auto" />
                                </Grid.ColumnDefinitions>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="Auto" />
                                </Grid.RowDefinitions>

                                <Label Grid.Row="0" Grid.Column="0" Content="Enter Method of Density Determination:" Target="{Binding ElementName=DensityDeterminationComboBox, Mode=OneWay}" Foreground="{DynamicResource InputFontColor}" />
                                <StackPanel Orientation="Horizontal" Grid.Row="0" Grid.Column="1">
                                    <ComboBox x:Name="DensityDeterminationComboBox" Width="200" HorizontalAlignment="Left" Margin="5,0,0,0" DisplayMemberPath="Method" ItemsSource="{Binding Path=DensityDeterminations}" SelectedItem="{Binding Path=SelectedDensityDetermination, Mode=TwoWay}" Height="22" />
                                    <Label Grid.Row="0" Grid.Column="0" Content=" u(d) = 1" Foreground="{DynamicResource InputFontColor}" Visibility="{Binding Path=DensityClientSuppliedVisible}"/>
                                </StackPanel>
                            </Grid>


                            <Grid HorizontalAlignment="Left" Grid.Row="4" Grid.ColumnSpan="3" x:Name="OuterDensityGridMass" VerticalAlignment="Top" Margin="0,20,0,0">
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="Auto" />
                                    <ColumnDefinition Width="Auto" />
                                    <ColumnDefinition Width="Auto" />
                                </Grid.ColumnDefinitions>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="Auto" />
                                </Grid.RowDefinitions>

                                <GroupBox Grid.Row="0" Grid.Column="0" Margin="5,5,5,5" Header="" Style="{DynamicResource GroupBoxStyle}" Visibility="{Binding Path=DensityDensitoVisible}">

                                    <Grid HorizontalAlignment="Left" x:Name="DensityGridUserEntered" VerticalAlignment="Top" Margin="0,10,0,0">
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition Width="Auto" />
                                            <ColumnDefinition Width="Auto" />
                                        </Grid.ColumnDefinitions>
                                        <Grid.RowDefinitions>
                                            <RowDefinition Height="Auto" />
                                        </Grid.RowDefinitions>

                                        <Label Grid.Row="1" Grid.Column="0" Content="Enter Density (g/ml):" Target="{Binding ElementName=DensityUserEnteredTextBox, Mode=OneWay}" Foreground="{DynamicResource InputFontColor}" />
                                        <TextBox Grid.Row="1" Grid.Column="1" TextWrapping="Wrap" Style="{StaticResource TextStyle}" x:Name="DensityUserEnteredTextBox" Width="135" Text="{Binding Path=UserEnteredDensity, Mode=TwoWay}" HorizontalAlignment="Left" Margin="5,0,0,0"/>
                                    </Grid>

                                </GroupBox>

                                <GroupBox Grid.Row="0" Grid.Column="0" Margin="5,5,5,5" Header="Mass" Style="{DynamicResource GroupBoxStyle}" Visibility="{Binding Path=DensityMassVolumeVisible}">

                                    <Grid HorizontalAlignment="Left" x:Name="DensityGridMass" VerticalAlignment="Top" Margin="0,10,0,0">
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition Width="Auto" />
                                            <ColumnDefinition Width="Auto" />
                                        </Grid.ColumnDefinitions>
                                        <Grid.RowDefinitions>
                                            <RowDefinition Height="Auto" />
                                            <RowDefinition Height="Auto" />
                                        </Grid.RowDefinitions>

                                        <Label Grid.Row="0" Grid.Column="0" Content="Select Balance:" Target="{Binding ElementName=DensityBalanceComboBox, Mode=OneWay}" Foreground="{DynamicResource InputFontColor}" />
                                        <ComboBox x:Name="DensityBalanceComboBox" Grid.Row="0" Grid.Column="1" Width="200" HorizontalAlignment="Left" Margin="5,0,0,0" DisplayMemberPath="Description" ItemsSource="{Binding Path=Balances}" SelectedItem="{Binding Path=SelectedDensityBalance, Mode=TwoWay}" Height="22" />

                                        <Label Grid.Row="1" Grid.Column="0" Content="Mass Weighed (g):" Target="{Binding ElementName=DensityMassWeighedTextBox, Mode=OneWay}" Foreground="{DynamicResource InputFontColor}" />
                                        <TextBox Grid.Row="1" Grid.Column="1" TextWrapping="Wrap" Style="{StaticResource TextStyle}" x:Name="DensityMassWeighedTextBox" Width="135" Text="{Binding Path=Sample.Density.Mass.MassWeighed}" HorizontalAlignment="Left" Margin="5,0,0,0"/>
                                    </Grid>

                                </GroupBox>

                                <GroupBox Grid.Row="0" Grid.Column="1" Header="Volume" Style="{DynamicResource GroupBoxStyle}" Visibility="{Binding Path=DensityMassVolumeVisible}" Margin="5,5,5,5">

                                    <Grid HorizontalAlignment="Left" x:Name="DensityGridVolume" VerticalAlignment="Top" Margin="0,10,0,0">
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition Width="Auto" />
                                            <ColumnDefinition Width="Auto" />
                                        </Grid.ColumnDefinitions>
                                        <Grid.RowDefinitions>
                                            <RowDefinition Height="Auto" />
                                            <RowDefinition Height="Auto" />
                                            <RowDefinition Height="Auto" />
                                        </Grid.RowDefinitions>

                                        <Label Grid.Row="0" Grid.Column="0" Content="Select Volumetric size:" Target="{Binding ElementName=DensityVolumetricComboBox, Mode=OneWay}" Foreground="{DynamicResource InputFontColor}" />
                                        <ComboBox x:Name="DensityVolumetricComboBox" Grid.Row="0" Grid.Column="1" Width="180" HorizontalAlignment="Left" Margin="5,0,0,0" DisplayMemberPath="Label" ItemsSource="{Binding Path=Volumetrics}" SelectedItem="{Binding Path=SelectedDensityVolumetric, Mode=TwoWay}" Height="22" />

                                        <Label Grid.Row="1" Grid.Column="0" Content="Select Solvent:" Target="{Binding ElementName=DensitySolventComboBox, Mode=OneWay}" Foreground="{DynamicResource InputFontColor}" />
                                        <ComboBox x:Name="DensitySolventComboBox" Grid.Row="1" Grid.Column="1" Width="180" HorizontalAlignment="Left" Margin="5,0,0,0" DisplayMemberPath="Solvent" ItemsSource="{Binding Path=ThermalExpansions}" SelectedItem="{Binding Path=SelectedDensityThermalExpansion, Mode=TwoWay}" Height="22" />

                                        <Label Grid.Row="2" Grid.Column="0" Content="Select Temperature:" Target="{Binding ElementName=DensityTemperatureComboBox, Mode=OneWay}" Foreground="{DynamicResource InputFontColor}" />
                                        <ComboBox x:Name="DensityTemperatureComboBox" Grid.Row="2" Grid.Column="1" Width="180" HorizontalAlignment="Left" Margin="5,0,0,0" DisplayMemberPath="TemperatureValue" ItemsSource="{Binding Path=Temperatures}" SelectedItem="{Binding Path=SelectedDensityTemperature, Mode=TwoWay}" Height="22" />
                                    </Grid>

                                </GroupBox>

                            </Grid>
                        </StackPanel>
                    </GroupBox>

                </Grid>

            </ScrollViewer>
          </StackPanel>
         </Border>

    </DockPanel>
</Border>
</UserControl>
2
wpfxaml
I guess the first StackPanel is the problem. Try to replace it with a Grid. – Mighty Badaboom
I tried changing it to a Grid (without any column or row definitions) and still same problem – David
@David, is StackPanel nested into another StackPanel or Grid Row with Auto height? when I tried a simple test in an empty Window - <StackPanel><ScrollViewer/></StackPanel> vs <Grid><ScrollViewer/></Grid> - Grid made the difference – ASh
My StackPanel is inside a Border and DockPanel. I have updated the XAML – David
And also inside a UserControl with set heights, I assume this could be the issue? – David

2 Answers

4
votes

for some reason StackPanel inside DockPanel decides that it can use unlimited height for content. ScrollViewer doesn't show scroll because its height is equal to content height.

setting MaxHeight for ScrollViewer should solve the issue. The trick is to find correct value for MaxHeight - bind it to the height of some other element if the window. 

<DockPanel x:Name="MainPanel">

    <!-- header area -->
    <DockPanel Margin="10,0,10,0" DockPanel.Dock="Top" Height="80" x:Name="HeaderPanel">
        <TextBlock Text="Uncertainty in Sample - Volume Final and Volume Initial" Style="{DynamicResource HeaderStyle}" FontWeight="Bold" Margin="5,0,0,0" VerticalAlignment="Center" Foreground="{DynamicResource HeaderFontColor}"/>
        <Image Source="/images/sample.jpg" HorizontalAlignment="Right"></Image>
    </DockPanel>

    <Border Name="b">
    <StackPanel>

        <Separator Height="1" Margin="0" VerticalAlignment="Top" Width="750" HorizontalAlignment="Left"/>

        <ScrollViewer VerticalScrollBarVisibility="Auto"
                      MaxHeight="{Binding Path=ActualHeight, ElementName=b, Mode=OneWay}">
            <Grid>

            </Grid>
        </ScrollViewer>
    </StackPanel>
    </Border>
</DockPanel>
1
votes

Putting a ScrollViewer inside a StackPanel is always a bad idea as a StackPanel measures its children with an infinite space:

Horizontal scroll for stackpanel doesn't work

Replace the StackPanel with a Grid with two RowDefinitions:

<Border Name="b" Margin="10,0,10,10" Style="{DynamicResource BorderStyle}" Background="{DynamicResource BackgroundBrush}">
    <DockPanel x:Name="MainPanel">

        <!-- header area -->
        <DockPanel Margin="10,0,10,0" DockPanel.Dock="Top" Height="80" x:Name="HeaderPanel">
            <TextBlock Text="Uncertainty in Sample - Volume Final and Volume Initial" Style="{DynamicResource HeaderStyle}" FontWeight="Bold" Margin="5,0,0,0" VerticalAlignment="Center" Foreground="{DynamicResource HeaderFontColor}"/>
            <Image Source="/images/sample.jpg" HorizontalAlignment="Right"></Image>
        </DockPanel>

        <Border Name="b">
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto" />
                    <RowDefinition Height="*" />
                </Grid.RowDefinitions>

                <Separator Height="1" Margin="0" VerticalAlignment="Top" Width="750" HorizontalAlignment="Left"/>

                <ScrollViewer VerticalScrollBarVisibility="Auto" MaxHeight="{Binding Path=ActualHeight, ElementName=b, Mode=OneWay}" Grid.Row="1">
                    <Grid HorizontalAlignment="Left" x:Name="Outer" VerticalAlignment="Top" Margin="0,10,0,0">
                        ...
                    </Grid>
                </ScrollViewer>
            </Grid>
        </Border>

    </DockPanel>
</Border>

You may have to replace some of the inner StackPanels as well but using a Grid as the child element of the ScrollViewer should make the scroll bars appear when they are needed.