2010-01-22 14 views
16

मेरे पास एक साधारण WrapPanel है जिसमें कई विस्तृत नियंत्रण शामिल हैं। जब मैं Window के Width का आकार बदलता हूं तो सब कुछ अपेक्षित काम करता है। नियंत्रण होने पर अगली पंक्ति में पर्याप्त जगह या लपेटने पर नियंत्रण एक ही पंक्ति पर चले जाएंगे।डब्ल्यूपीएफ रैप पैनल और स्क्रॉलिंग

हालांकि, मैं क्या होने की जरूरत है नियंत्रण के सभी मूल रूप से खड़ी खड़ी दिखती हैं (वहाँ कोई और अधिक क्षैतिज स्थान है के बाद से) और Window की Width और भी अधिक कम हो जाती है, एक क्षैतिज स्क्रॉल पट्टी प्रतीत होता है कि इतना है कि मैं है अगर मैं चाहता हूं तो पूरे नियंत्रण को स्क्रॉल और देख सकते हैं। नीचे मेरा एक्सएमएल है। मैंने को ScrollViewer में लपेटने की कोशिश की लेकिन मैं अपना लक्ष्य प्राप्त नहीं कर सका।

<Window x:Class="WpfQuotes.Window1" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     Title="Window1" Height="Auto" Width="600" Foreground="White"> 
    <WrapPanel> 
     <Button Width="250">1</Button> 
     <Button Width="250">2</Button> 
     <Button Width="250">3</Button> 
    </WrapPanel> 
</Window> 

तो अगर आप ऊपर Window अपने न्यूनतम के Width को कम करने, आप बटन के पाठ को देखने के लिए सक्षम नहीं होगा। मैं एक क्षैतिज स्क्रॉल बार प्रकट करना चाहता हूं ताकि मैं पाठ देखने के लिए स्क्रॉल कर सकूं लेकिन सामान्य रैपिंग कार्यक्षमता में हस्तक्षेप नहीं कर सकता।

धन्यवाद।

अद्यतन: मैंने नीचे पॉल के सुझाव का पालन किया है और क्षैतिज स्क्रॉलबार अब अपेक्षित प्रतीत होता है। हालांकि, मैं वर्टिकल स्क्रॉलिंग भी उपलब्ध करना चाहता था इसलिए मैंने VerticalScrollBarVisibility="Auto" सेट किया। बात यह है कि, यदि मैं खिड़की का आकार बदलता हूं ताकि एक लंबवत स्क्रॉल बार दिखाई दे, क्षैतिज भी हमेशा प्रकट होता है, भले ही इसकी आवश्यकता न हो (पूरे नियंत्रण को देखने के लिए पर्याप्त क्षैतिज स्थान है)। ऐसा लगता है कि स्क्रॉलव्यूअर की चौड़ाई के साथ गड़बड़ कर लंबवत स्क्रॉलबार दिखाई दे रहा है। क्या इसे सही करने का कोई तरीका है ताकि क्षैतिज स्क्रॉलबार तब तक प्रकट न हो जब तक इसकी वास्तव में आवश्यकता न हो?

नीचे मेरी XAML और केवल कोड मैं CustomWrapPanel में जोड़ा है:

<Window x:Class="Window1" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:cwp="clr-namespace:CustomWrapPanelExample" 
     Title="Window1" Height="Auto" Width="300" Foreground="White" Name="mainPanel"> 
    <ScrollViewer x:Name="MyScrollViewer" HorizontalScrollBarVisibility="Auto" 
       VerticalScrollBarVisibility="Auto"> 
    <cwp:CustomWrapPanel Width="{Binding ElementName=MyScrollViewer, Path=ActualWidth}"> 
     <Button Width="250">1</Button> 
     <Button Width="250">2</Button> 
     <Button Width="250">3</Button> 
     <Button Width="250">4</Button> 
     <Button Width="250">5</Button> 
     <Button Width="250">6</Button> 
     <Button Width="250">7</Button> 
     <Button Width="250">8</Button> 
     <Button Width="250">9</Button> 
    </cwp:CustomWrapPanel> 
    </ScrollViewer> 
</Window> 

केवल एक चीज CustomWrapPanel में अधिरोहित:

protected override Size MeasureOverride(Size availableSize) 
{ 
    double maxChildWidth = 0; 
    if (Children.Count > 0) 
    { 
    foreach (UIElement el in Children) 
    { 
     if (el.DesiredSize.Width > maxChildWidth) 
     { 
     maxChildWidth = el.DesiredSize.Width; 
     } 
    } 
    }  
    MinWidth = maxChildWidth; 
    return base.MeasureOverride(availableSize); 
} 
+0

क्या आप XAML को स्क्रॉलव्यूयर के साथ पोस्ट कर सकते हैं? – hackerhasid

उत्तर

43

यहाँ, बात है अगर आपके एक चादर का उपयोग करने जा पैनल, यह दो चीजें करता है, यह एक दिशा में जितनी अधिक उपलब्ध जगह लेगा, और दूसरे में आवश्यकतानुसार विस्तार करेगा। उदाहरण के लिए, यदि आप इसे खिड़की के अंदर रखते हैं जैसे आपके पास है, तो यह जितना क्षैतिज स्थान ले सकता है, उतना ही नीचे की तरफ बढ़ता है, यही कारण है कि एक लंबवत स्क्रॉल बार काम करेगा, पैरेंट कंटेनर कहता है "यह है मैं कितना चौड़ा हूं, लेकिन आप खुद को लंबवत रूप से बड़ा कर सकते हैं ", यदि आप इसे क्षैतिज स्क्रॉल बार में बदलते हैं, तो स्क्रॉल व्यूअर अनिवार्य रूप से कह रहा है" यह कितना लंबा हो सकता है, लेकिन आप जितना लंबा हो सकते हैं आप चाहते हैं "इस मामले में रैप पैनल लपेटता नहीं है क्योंकि कोई क्षैतिज बाधा नहीं है।

एक संभावित समाधान दिशा रैप पैनल इस तरह खड़ी क्षैतिज से लपेटता (जो शायद आदर्श या अपेक्षित व्यवहार नहीं है) को बदलने के लिए है:

<ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Disabled"> 
     <WrapPanel Orientation="Vertical"> 
      <Button Width="250">1</Button> 
      <Button Width="250">2</Button> 
      <Button Width="250">3</Button> 
     </WrapPanel> 
    </ScrollViewer> 

क्रम व्यवहार आपके उम्मीद कर पाने के लिए, आप इस के करीब कुछ करना होगा:

<ScrollViewer x:Name="MyScrollViewer" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Disabled"> 
     <WrapPanel MinWidth="250" Width="{Binding ElementName=MyScrollViewer, Path=ViewportWidth}"> 
      <Button Width="250">1</Button> 
      <Button Width="250">2</Button> 
      <Button Width="250">3</Button> 
     </WrapPanel> 
    </ScrollViewer> 

बहरहाल, यह दूसरा समाधान तभी काम करता है आप पहले से ही अपने बच्चे तत्वों की चौड़ाई पता है, आदर्श रूप से आप अपनी अधिकतम चौड़ाई की वास्तविक चौड़ाई के लिए सेट करना चाहते हैं सबसे बड़ा बच्चा आइटम, लेकिन ओ में ऐसा करने के लिए rder कि आपको एक कस्टम नियंत्रण बनाना होगा जो रैप पैनल से निकलता है और इसके लिए कोड को स्वयं लिखने के लिए लिखता है।

+0

धन्यवाद पॉल। मैंने आपके द्वारा वर्णित परिवर्तन किए हैं और यह अब बहुत बेहतर काम कर रहा है। हालांकि, मैं एक छोटी सी समस्या देख रहा हूँ w.r.t. वर्टिकल स्क्रॉलिंग। जब भी रैप पैनल के आइटम लंबवत रूप से दिखाई नहीं दे रहे थे तब भी मैं एक वर्टिकल स्क्रॉल बार दिखाना चाहता था। मैंने अपनी मूल पोस्ट को मेरे द्वारा किए गए परिवर्तन और जिस समस्या का सामना कर रहा हूं, उसे दिखाने के लिए संपादित किया। – Flack

+0

अहह ... इसके साथ खेला गया है, आपको बस इतना करना चाहिए कि रैप पैनल पर बाध्यकारी पथ को वास्तविक वर्ड से व्यूपोर्टविड्थ में बदलें, जब लंबवत स्क्रॉलबार जोड़ा जाता है तो यह व्यूपोर्ट चौड़ाई को छोटा बनाता है, हालांकि वास्तविक नियंत्रण रहता है एक माप। इससे अजीब क्षैतिज स्क्रॉल बार आपके बग को हल कर लेना चाहिए, और मैं अपनी पोस्ट अपडेट करूंगा। –

+0

बढ़िया! ऐसा लगता है कि यह पूरी तरह से काम कर रहा है। आपकी मदद के लिए बहुत बहुत धन्यवाद :) – Flack

संबंधित मुद्दे