Alex Mullans
Alex Mullans

Reputation: 1739

Grid in ScrollViewer doesn't scroll horizontally

I think I'm missing something simple here... how do I get a Grid inside a ScrollViewer to scroll horizontally? I've enabled HorizontalScrollMode, and the content is definitely long enough that it runs off the screen, but it doesn't scroll. Here's the offending code (this ScrollViewer is the lone content of a row of the LayoutRoot Grid):

<ScrollViewer Grid.Row="1" VerticalScrollMode="Disabled"
              VerticalScrollBarVisibility="Hidden"
              HorizontalScrollMode="Enabled">
    <Grid Margin="120,0,0,100">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="240"/>
            <ColumnDefinition Width="20"/>
            <ColumnDefinition Width="240"/>
            <ColumnDefinition Width="20"/>
            <ColumnDefinition Width="240"/>
            <ColumnDefinition Width="20"/>
            <ColumnDefinition Width="240"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <TextBlock Text="Download" HorizontalAlignment="Center" Margin="0,0,0,10"/>
        <local:BandwidthMeter Grid.Row="1" x:Name="PolicyDown" Grid.Column="0"/>
        <TextBlock Grid.Column="2" Text="Upload" HorizontalAlignment="Center"/>
        <local:BandwidthMeter Grid.Row="1" x:Name="PolicyUp" Grid.Column="2"/>
        <TextBlock Grid.Column="4" Text="Download" HorizontalAlignment="Center"/>
        <local:BandwidthMeter x:Name="ActualDown" Grid.Row="1" Grid.Column="4"/>
        <TextBlock Grid.Column="6" Text="Upload" HorizontalAlignment="Center"/>
        <local:BandwidthMeter x:Name="ActualUp" Grid.Row="1" Grid.Column="6" />
        <TextBlock Grid.Column="7" Text="Campus-wide bandwidth usage" HorizontalAlignment="Center"/>
        <Image Grid.Column="7" Grid.Row="1" Margin="80,0,0,0" Source="[image URL]" Stretch="UniformToFill"/>
    </Grid>
</ScrollViewer>

Upvotes: 2

Views: 1213

Answers (1)

Ryan Byrne
Ryan Byrne

Reputation: 860

Add the property HorizontalScrollBarVisibility="Auto" to your ScrollViewer.

Upvotes: 5

Related Questions