Question

滚动时通常是否可以避免移动某些控件？

特别是可以在下面的代码示例中粘贴第一行（带浅蓝色背景）：

<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>

Answer 1

也许尝试这样的事情？

<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>

<强>更新

<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>

因此，如果您希望Vertical ScrollBar一直到顶部，您可以为ScrollViewer创建一个样式，将容器Grid向下推一点（20px），并用矩形突出显示顶部。

希望这是你想要达到的目标......

如何在ScrollViewer中粘贴控件

2 个答案: