5

我在 Silverlight 应用程序中使用 ScrollViewer。它具有水平方向，我希望它只出现滚动按钮，而不是滚动条本身。类似于这种粗略的 ASCII 渲染：

------------------------------------------------------
|   |                                            |   |
| < |                Content Here                | > |
|   |                                            |   |
------------------------------------------------------

我知道我可以使用模板功能，但我看到的所有示例只改变了所有元素的外观，而不是它们的原始位置，或者它们是否出现。是否有可能做到这一点，有人可以提供模板的外观吗？

4

4 回答 4

2

这是另一种选择。覆盖 SCrollviewer 的默认模板并将按钮作为 PageUp/PageDown 处理。我下面的示例是一个垂直滚动的滚动查看器。您可以轻松更改为水平滚动并将处理程序从 PageUp/PageDown 更改为 Left 和 Right 处理程序。

<ControlTemplate TargetType="{x:Type ScrollViewer}" x:Key="ButtonOnlyScrollViewer">
        <ControlTemplate.Resources>
            <!-- Add style here for repeat button seen below -->
        </ControlTemplate.Resources>
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="*"/>
                <RowDefinition Height="Auto"/>
            </Grid.RowDefinitions>

            <RepeatButton Grid.Row="0"
                          Foreground="White" 
                          Background="Yellow" 
                          HorizontalAlignment="Stretch" 
                          Command="ScrollBar.PageUpCommand"
                          Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}">
            </RepeatButton>

            <ScrollContentPresenter
                CanContentScroll="{TemplateBinding CanContentScroll}"
                Grid.Row="1" 
                Content="{TemplateBinding Content}"  
                Width="{TemplateBinding Width}"
                Height="{TemplateBinding Height}" 
                Margin="{TemplateBinding Margin}"/>

            <RepeatButton Grid.Row="2" Background="Black" Foreground="White" Command="ScrollBar.PageDownCommand">
            </RepeatButton>
        </Grid>
    </ControlTemplate>
于 2008-12-17T23:37:31.230 回答
1

我做过类似的事情，我发现最好的方法是将您的内容放在滚动查看器中，然后关闭滚动条。然后对按钮进行编码以滚动滚动查看器。

编辑：回应关于无法处理尺寸的评论。

首先，您可以将此控件构建为 ContentControl。它应该有一个在 generic.xaml 中定义的模板，其中包含您的按钮控件和滚动查看器。就像是：

<Canvas x:Name="root">
  <Button x:Name="left" Content="<"/>
  <Button x:Name="right" Content=">"/>
  <ScrollViewer x:Name="viewer" BorderThickness="0" VerticalScrollBarVisibility="Hidden">
    <ContentPresenter />
  </ScrollViewer>
</Canvas>

然后在您的控制中，您需要覆盖 OnApplyTemplate：

public override void OnApplyTemplate()
{
  base.OnApplyTemplate();

  left = GetTemplateChild("left") as Button;
  left.Click += new RoutedEvent(YourHandler);
  right = GetTemplateChild("right") as Button;
  right.Click += new RoutedEvent(YourHandler);
  // position your scroll buttons here, not writing that code
  scroll = GetTemplateChild("viewer") as ScrollViewer;
  root = GetTemplateChild("root") as Canvas;

  var fe = this.Content as FrameworkElement;
  if (fe != null)
  {
    fe.SizeChanged += new SizeChangedEventHandler(fe_SizeChanged);
  }
}

void  fe_SizeChanged(object sender, SizeChangedEventArgs e)
{
  this.InvalidateMeasure();
}

protected override Size ArrangeOverride(Size finalSize)
{
  if (!double.IsInfinity(scroll.ViewportHeight))
  {
     left.Visibility = (scroll.HorizontalOffset > 0);
     right.Visibility = (scroll.HorizontalOffset < ScrollableHeight);
  }
  return base.ArrangeOverride(finalSize);
}

protected override Size MeasureOverride(Size availableSize)
{
  scroll.Measure(availableSize);
  return scroll.DesiredSize;
}

在您的按钮单击处理程序中，您需要 (1) 滚动查看器并 (2) 检查 Horizo​​ntalOffset 的新值，以查看是否需要隐藏或显示任一按钮。

免责声明：此代码可能无法按原样工作，因为它是手工编写的，并且基于不同的示例。

于 2008-12-17T19:47:44.500 回答
1

我在这里找到了解决方案:)

http://weblogs.asp.net/fredriknormen/archive/2009/09/18/create-an-automatic-scrollable-image-slider-in-silverlight.aspx

这是使用 DispatcherTimer 制作的，非常好的示例 :)

于 2010-08-20T20:08:53.827 回答
0

我一直在寻找有效的解决方案很长时间了。并且基于路易斯的解决方案，我已经设法使其工作。（在 WPF 中）

此解决方案适用于水平滚动。

首先，添加 ListView：

    <ListView ItemsSource="{Binding Items}">
        <ListView.ItemsPanel>
            <ItemsPanelTemplate>
                <StackPanel Orientation="Horizontal"/>
            </ItemsPanelTemplate>
        </ListView.ItemsPanel>
        <ListView.Template>
            <ControlTemplate>
                <ScrollViewer Template="{StaticResource ButtonOnlyScrollViewer}">
                    <ItemsPresenter />
                </ScrollViewer>
            </ControlTemplate>
        </ListView.Template>
    </ListView>

以及来自路易斯的水平滚动答案的修改模板：

    <ControlTemplate TargetType="{x:Type ScrollViewer}" x:Key="ButtonOnlyScrollViewer">
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="Auto"/>
            </Grid.ColumnDefinitions>

            <RepeatButton Content="&lt;"
                          Grid.Column="0"
                          Command="ScrollBar.LineLeftCommand"
                          Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}"/>

            <ScrollContentPresenter
                CanContentScroll="{TemplateBinding CanContentScroll}"
                Grid.Column="1" 
                Content="{TemplateBinding Content}"  
                Width="{TemplateBinding Width}"
                Height="{TemplateBinding Height}" 
                Margin="{TemplateBinding Margin}"/>

            <RepeatButton Content="&gt;"
                          Grid.Column="2" 
                          Command="ScrollBar.LineRightCommand"
                          Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}"/>
        </Grid>
    </ControlTemplate>
于 2017-08-14T10:36:58.980 回答