Silverlight Scrollviewer только с кнопками

Question

Я использую ScrollViewer как часть моего приложения Silverlight. Он имеет горизонтальную ориентацию, и я хотел бы, чтобы он отображался так, чтобы отображались только кнопки прокрутки, но не сама полоса прокрутки. Что-то вроде этого грубого рендеринга ASCII:

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

Я знаю, что могу использовать функциональность шаблонов, но все примеры, которые я видел, меняют только внешний вид всех элементов, а не их исходное расположение или даже если они появляются. Возможно ли это сделать, и кто-нибудь может дать представление о том, как может выглядеть шаблон?

Answer 1

Вот еще один вариант. Переопределите шаблон по умолчанию для SCrollviewer и обработайте кнопки как PageUp / PageDown. Мой пример ниже - прокрутка, которая прокручивается по вертикали. Вы можете легко перейти к горизонтальной прокрутке и изменить обработчики с PageUp / PageDown на Левый и Правый обработчики.

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

Answer 2

Я нашел решение здесь:)

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

Это сделано с использованием DispatcherTimer, действительно хороший пример:)

Answer 3

Я сделал что-то похожее, и лучший способ найти это - поместить свой контент в средство просмотра прокрутки и просто отключить полосы прокрутки. Затем используйте ваши кнопки для прокрутки прокрутки.

Редактировать: Ответ на комментарий о том, как не справиться с калибровкой.

Во-первых, вы должны создать этот элемент управления как 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) проверить новое значение HorizontalOffset, чтобы увидеть, нужно ли вам скрыть или показать любую из кнопок.

Отказ от ответственности: этот код, вероятно, не работает как есть, поскольку он был написан от руки и основан на другом примере.

Answer 4

Я довольно долго искал рабочее решение. И на основе решения Луи мне удалось заставить его работать. (в 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>