2008-12-17 12 views
5

मैं अपने सिल्वरलाइट एप्लिकेशन के हिस्से के रूप में स्क्रॉलव्यूयर का उपयोग कर रहा हूं। इसमें एक क्षैतिज अभिविन्यास है, और मैं इसे ऐसा दिखाना चाहता हूं कि केवल स्क्रॉल बटन दिखाई दें, लेकिन स्क्रॉल बार स्वयं ही नहीं। इस कच्चे ASCII प्रतिपादन की तरह कुछ:सिल्वरलाइट स्क्रॉलव्यूअर केवल बटन के साथ

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

मैं मैं templating कार्यक्षमता का उपयोग कर सकता है पता है, लेकिन सभी नमूनों मैं केवल देखा है सभी तत्वों के रूप को बदलने, और न उनके कच्चे स्थिति, या वे चाहे भी दिखाई देते हैं। क्या ऐसा करना संभव है, और कोई व्यक्ति टेम्पलेट की तरह दिखने की रूपरेखा प्रदान कर सकता है?

उत्तर

1

मैंने कुछ ऐसा किया है और ऐसा करने का सबसे अच्छा तरीका यह है कि आपकी सामग्री को स्क्रॉल व्यूअर में रखना था और केवल स्क्रॉलबार बंद करना था। फिर scrollviewer स्क्रॉल करने के लिए अपने बटन कोड।

संपादित करें: आकार बदलने से निपटने के किसी भी तरीके के बारे में टिप्पणी करने का उत्तर देना।

सबसे पहले, आप इस नियंत्रण को ContentControl के रूप में बनाएंगे। इसमें जेनेरिक.एक्सएएमएल में परिभाषित टेम्पलेट होना चाहिए जिसमें आपके बटन नियंत्रण और स्क्रॉल व्यूअर हैं। कुछ की तरह: आप के लिए (1) दर्शक स्क्रॉल और (2) नई जाँच की आवश्यकता होगी

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

अपने बटन क्लिक संचालकों में:

<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 ओवरराइड करने के लिए की आवश्यकता होगी क्षैतिज ऑफसेट का मूल्य यह देखने के लिए कि क्या आपको बटन को छिपाने या दिखाने की आवश्यकता है या नहीं।

अस्वीकरण: यह कोड संभवतः काम नहीं करता है क्योंकि यह हाथ से लिखा गया था और एक अलग उदाहरण के आधार पर।

+0

कि विधि के साथ समस्या यह है कि मैं नहीं दिख रहा है एक घटना मैं संलग्न कर सकता है , जो मुझे सूचित करेगा जब व्यूपोर्ट इस तरह से बदल गया है कि बटन को दृश्यमान करने की आवश्यकता है। तो असल में, मुझे बटन हमेशा दिखाना होगा, जो मुझे पसंद नहीं है। – Nick

1

यहां एक और विकल्प है। स्क्रॉलव्यूवर के लिए डिफ़ॉल्ट टेम्पलेट को ओवरराइड करें और बटन को पेजअप/पेजडाउन के रूप में संभाल लें। नीचे मेरा उदाहरण एक स्क्रॉलव्यूवर है जो लंबवत स्क्रॉल करता है। आप आसानी से क्षैतिज स्क्रॉलिंग में बदल सकते हैं और हैंडलर को पेजअप/पेजडाउन से बाएं और दाएं हैंडलर में बदल सकते हैं।

<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

स्टैक ओवरव्लो लंगड़ा जा रहा है। मेरे संपादन नहीं दिख रहे हैं। जाहिर है उपर्युक्त उदाहरण में नियंत्रण टेम्पलेट के शीर्ष पर कुछ जानकारी गुम है लेकिन संपादन दृश्य में यह सब कुछ है। बटन को केवल प्रभाव प्राप्त करने के लिए स्क्रॉलव्यूअर टेम्पलेट को ओवरराइड करना संभव है। – Louis

+0

इसे पेस्टबिन पर पोस्ट करें? –

+0

यह एक डब्ल्यूपीएफ समाधान प्रतीत होता है। सिल्वरलाइट में कैसे करें? कमांड = "स्क्रॉलबार। पेजअप कमांड" सिल्वरलाइट में काम नहीं करता है। –

0

पाया मैं काफी एक बहुत कुछ के लिए समाधान काम करने के लिए खोज रहे होते हैं समय के साथ और लुई के समाधान के आधार पर मैंने इसे काम करने में कामयाब रहा है। (डब्ल्यूपीएफ में)

यह समाधान क्षैतिज स्क्रॉलिंग के लिए है।

सबसे पहले, जोड़ने 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> 
संबंधित मुद्दे