2008-12-17 10 views
5

Silverlight uygulamamın bir parçası olarak ScrollViewer kullanıyorum. Yatay bir yönelimi var ve sadece kaydırma düğmelerinin görünmesini, ancak kaydırma çubuğunun kendisinin görünmemesini istiyorum. Bu ham ASCII render gibi bir şey:Yalnızca Düğmelerle Silverlight Scrollviewer

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

Ben şablon işlevi kullanabilirsiniz biliyorum ama sadece gördüğüm bütün numuneler tüm unsurların görünümünü değiştirmek ve onların çiğ konumlandırma, hatta onlar olsun görünür. Bunu yapmak mümkün mü ve birisi şablonun neye benzeyebileceğine dair bir taslak sunabilir mi?

cevap

1

Benzer bir şey yaptım ve bunu yapmanın en iyi yolu, içeriğinizi kaydırma görüntüleyicisine koymak ve kaydırma çubuklarını kapatmaktı. Ardından, scrollviewer'ı kaydırmak için düğmelerinizi kodlayın.

Düzenleme: Boyutlandırmayla başa çıkmanın hiçbir yolu hakkında yorum yapmak.

İlk olarak, bu denetimi ContentControl olarak kurarsınız. Düğme denetimlerinizin yanı sıra kaydırma görüntüleyicisine sahip olan generic.xaml'de tanımlanan bir şablon olmalıdır. Bir şey gibi:

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

Sonra kontrolünde size OnApplyTemplate geçersiz kılmak gerekir: Düğme tıklama işleyicilerinde

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

sen (1) görüntüleyici kaydırmak ve (2) yeni kontrol etmek gerekir düğmesinden birini saklamanız veya göstermeniz gerekip gerekmediğini görmek için HorizontalOffset'in değeri.

Yasal Uyarı: Bu kod, el ile yazıldığından ve farklı bir örneğe göre olduğu için muhtemelen çalışmaz.

+0

o yöntemdeki sorun ben bir olay ben eklemek olabilir görmüyorum olmasıdır Bu, görünümün, düğmelerin görünür hale getirilmesi gerektiği şekilde değiştiğinde beni bilgilendirir. Sonuç olarak, düğmelerini her zaman görülebilir yapmak zorundayım, ki beğenmedim. – Nick

1

İşte başka bir seçenek. SCrollviewer için varsayılan şablonu geçersiz kılın ve düğmeleri PageUp/PageDown olarak kullanın. Aşağıdaki örneğim, dikey olarak kaydırılan bir kaydırma görüntüleyicisidir. Yatay kaydırmaya kolayca geçiş yapabilir ve işleyicileri PageUp/PageDown'dan Sol ve Sağ işleyicilere değiştirebilirsiniz.

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

StackOverflow topal çalışıyor. Düzenlemelerim gösterilmiyor. Açıkçası yukarıdaki örnek, Kontrol Şablonunun en üstünde bazı bilgiler eksiktir, ancak düzenleme görünümünde, hepsi oradadır. Sadece düğme efekti elde etmek için ScrollViewer şablonunu geçersiz kılmak mümkündür. – Louis

+0

Pastayı yapıştırın mı? –

+0

Bu bir WPF çözümü gibi görünüyor. Silverlight'ta nasıl yapılır? Command = "ScrollBar.PageUpCommand", Silverlight'ta çalışmıyor. –

0

bulundu şimdi zamanın Ve Louis’in çözümüne dayanarak çalışmayı başardım. (WPF'de)

Bu çözüm, yatay yatay kaydırma içindir.

Öncelikle eklemek 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> 

Ve yatay kaydırma için Louis'nin cevaptan değiştirilmiş şablonu:

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