Geek Answers Handbook

How to enable controls inside ScrollViewer

In general, can you avoid moving some controls while scrolling?

In particular, you can insert the first line (with lightblue backgrounds) in the following code example:

<Grid> <ScrollViewer> <Grid> <Grid.RowDefinitions> <RowDefinition Height="20" /> <RowDefinition /> </Grid.RowDefinitions> <Canvas Background="LightBlue" Grid.Row="0" /> <Grid Grid.Row="1" > <Canvas Background="Beige" Width="100" Height="800" /> </Grid> </Grid> </ScrollViewer> </Grid>
-one
c # wpf silverlight
source share
2 answers

Maybe try something like this?

 <Grid> <ScrollViewer> <Grid Height="800" Width="480" > <Canvas Background="Beige" Width="100" Height="800" /> </Grid> </ScrollViewer> <Canvas Background="LightBlue" Grid.Row="0" Height="20" VerticalAlignment="Top" /> </Grid>

UPDATE:

 <Style TargetType="ScrollViewer"> <Setter Property="HorizontalContentAlignment" Value="Left"/> <Setter Property="VerticalContentAlignment" Value="Top"/> <Setter Property="VerticalScrollBarVisibility" Value="Visible"/> <Setter Property="Padding" Value="4"/> <Setter Property="BorderThickness" Value="1"/> <Setter Property="BorderBrush"> <Setter.Value> <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> <GradientStop Color="#FFA3AEB9" Offset="0"/> <GradientStop Color="#FF8399A9" Offset="0.375"/> <GradientStop Color="#FF718597" Offset="0.375"/> <GradientStop Color="#FF617584" Offset="1"/> </LinearGradientBrush> </Setter.Value> </Setter> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="ScrollViewer"> <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="2"> <Grid Background="{TemplateBinding Background}"> <Grid.ColumnDefinitions> <ColumnDefinition Width="*"/> <ColumnDefinition Width="Auto"/> </Grid.ColumnDefinitions> <Grid.RowDefinitions> <RowDefinition Height="20"/> <RowDefinition/> <RowDefinition Height="Auto"/> </Grid.RowDefinitions> <ScrollContentPresenter x:Name="ScrollContentPresenter" Cursor="{TemplateBinding Cursor}" ContentTemplate= "{TemplateBinding ContentTemplate}" Margin="{TemplateBinding Padding}" Grid.Row="1"/> <Rectangle Grid.Column="1" Fill="#FFE9EEF4" Grid.Row="2"/> <ScrollBar x:Name="VerticalScrollBar" Grid.Column="1" IsTabStop="False" Maximum="{TemplateBinding ScrollableHeight}" Margin="0,-1,-1,-1" Minimum="0" Orientation="Vertical" Grid.Row="0" Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}" Value="{TemplateBinding VerticalOffset}" ViewportSize="{TemplateBinding ViewportHeight}" Width="18" Grid.RowSpan="3"/> <ScrollBar x:Name="HorizontalScrollBar" Grid.Column="0" Height="18" IsTabStop="False" Maximum="{TemplateBinding ScrollableWidth}" Margin="-1,0,-1,-18" Minimum="0" Orientation="Horizontal" Grid.Row="2" Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}" Value="{TemplateBinding HorizontalOffset}" ViewportSize="{TemplateBinding ViewportWidth}"/> <Rectangle Fill="#FF89B1E2"/> </Grid> </Border> </ControlTemplate> </Setter.Value> </Setter> </Style>

So, if you want the Vertical ScrollBar to go all the way to the top, you can create a style for the ScrollViewer, gently click on the Grid container (20px) and select the top with the Rectangle.

Hope this is what you want to achieve ...

+1
source share

If the control is in a ScrollViewer , it will scroll. If you do not want it to scroll, it should not be in ScrollViewer. Xin's suggestion of making ScrollViewer behave like a “layer” or “overlay” on top or below the Canvas is the only way to keep the Canvas in place and let it go to the full window.

At least from your description, it seems you cannot easily or practically do what you want.

0
source share

More articles:


All Articles