#885 – Wrapping a Grid in a ScrollViewer
August 15, 2013 2 Comments
Because the ScrollViewer control is a ContentControl, it can contain any single element. It most often contains a single Panel, which in turn contains child elements.
Below is an example of a ScrollViewer that contains a Grid, which in turn contains a number of different elements.
<ScrollViewer Margin="5" CanContentScroll="False" HorizontalScrollBarVisibility="Auto"> <Grid> <Grid.RowDefinitions> <RowDefinition Height="Auto"/> <RowDefinition Height="Auto"/> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition Width="Auto"/> <ColumnDefinition Width="Auto"/> <ColumnDefinition Width="Auto"/> <ColumnDefinition/> </Grid.ColumnDefinitions> <Image Source="Augustus.jpg" Height="100" Margin="10"/> <Label Grid.Column="1" Content="Augustus - 63BC - 14AD" /> <Image Grid.Column="2" Source="Tiberius.jpg" Height="100" Margin="10"/> <Label Grid.Column="3" Content="Tiberius - 42BC - 37AD"/> <Button Grid.Row="1" Content="Learn" HorizontalAlignment="Center" VerticalAlignment="Center" Padding="10,5"/> <Button Grid.Row="1" Grid.Column="2" Content="Learn" HorizontalAlignment="Center" VerticalAlignment="Center" Padding="10,5"/> </Grid> </ScrollViewer>