2009-02-19 5 views
26

मैं जानना चाहता हूं कि डब्ल्यूपीएफ लेआउट ग्रिड की कोशिकाओं, पंक्तियों और स्तंभों को स्टाइल करने का कोई तरीका है या नहीं। मैं किसी भी जानकारी को खोजने की कोशिश कर रहा हूं और कुछ उल्लेख जो मैंने पाया है वह जानकारीपूर्ण नहीं है।एक डब्ल्यूपीएफ लेआउट ग्रिड पृष्ठभूमि (प्रत्येक सेल, पंक्ति, कॉलम) की स्टाइलिंग

मैं लिंक किए गए स्क्रीनशॉट में से एक की तरह दिखने के लिए ग्रिड शैली बनाना चाहता हूं।

यदि वास्तविक नियंत्रण इसका समर्थन नहीं करता है, तो क्या मैं इसे किसी भी तरह से प्राप्त कर सकता हूं और फिर कर सकता हूं? मैं डब्ल्यूपीएफ के लिए काफी नया हूं इसलिए किसी भी मदद की सराहना की जाएगी।

एक और बात, मुझे पता है कि मैं ग्रिड के भीतर प्रत्येक नियंत्रण को स्टाइल कर सकता हूं, लेकिन यह ओवरकिल जैसा लगता है। मैं एक ग्रिड रखना चाहता हूं जो इसे स्वयं करता है।

screenshot http://img21.imageshack.us/img21/2842/capturehz8.png

उत्तर

19

यहां एक त्वरित (बहुत मोटा नमूना) है जो आप चाहते हैं कि प्रारूप प्राप्त करने के लिए आसपास हैक कर सकते हैं (यदि आप WPF के साथ काम करने के बारे में गंभीर हैं, तो आप अपने लेआउट को अच्छे लगने में एक बड़ी मदद मिलेंगे):

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"                         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> 
     <Page.Resources> 
      <Style x:Key="CustomerDefinition" TargetType="TextBlock"> 
       <Setter Property="Control.FontFamily" Value="Tahoma"/> 
       <Setter Property="Control.FontSize" Value="12"/> 
       <Setter Property="Control.Foreground" Value="Red"/> 
      </Style> 
      <Style TargetType="{x:Type Label}"> 
       <Setter Property="Width" Value="100"/> 
      </Style> 
      <Style x:Key="{x:Type TextBox}" TargetType="{x:Type TextBox}"> 
       <Setter Property="SnapsToDevicePixels" Value="True"/> 
       <Setter Property="OverridesDefaultStyle" Value="True"/> 
       <Setter Property="KeyboardNavigation.TabNavigation" Value="None"/> 
       <Setter Property="FocusVisualStyle" Value="{x:Null}"/> 
       <Setter Property="MinWidth" Value="120"/> 
       <Setter Property="MinHeight" Value="20"/> 
       <Setter Property="AllowDrop" Value="true"/> 
       <Setter Property="Width" Value="200"/> 
       <Setter Property="Template"> 
        <Setter.Value> 
         <ControlTemplate TargetType="{x:Type TextBoxBase}"> 
          <Border 
           Name="Border" 
           Background="#FFEBE9E9" 
           BorderBrush="#FF8B8787" 
           BorderThickness="1" 
           CornerRadius="2" 
           Padding="3"> 
           <ScrollViewer x:Name="PART_ContentHost" Margin="0"/> 
          </Border> 
          <ControlTemplate.Triggers> 
           <Trigger Property="IsEnabled" Value="False"> 
            <Setter TargetName="Border" Property="Background" 
                 Value="#EEEEEE"/> 
            <Setter TargetName="Border" Property="BorderBrush" 
                 Value="#EEEEEE"/> 
            <Setter Property="Foreground" Value="#888888"/> 
           </Trigger> 
          </ControlTemplate.Triggers> 
         </ControlTemplate> 
        </Setter.Value> 
       </Setter> 
      </Style> 
      <LinearGradientBrush x:Key="NormalBrush" StartPoint="0,0" EndPoint="0,1"> 
       <GradientBrush.GradientStops> 
        <GradientStopCollection> 
         <GradientStop Offset="0.0" Color="#FFF0EDED"/> 
         <GradientStop Offset="1.0" Color="#FFE1E0E0"/> 
        </GradientStopCollection> 
       </GradientBrush.GradientStops> 
      </LinearGradientBrush> 
     </Page.Resources> 
     <Grid> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="*"/> 
       <ColumnDefinition Width="*"/> 
      </Grid.ColumnDefinitions> 
      <Grid.RowDefinitions> 
       <RowDefinition Height="26"/> 
       <RowDefinition Height="23"/> 
       <RowDefinition Height="24"/> 
       <RowDefinition Height="24"/> 
       <RowDefinition Height="24"/> 
      </Grid.RowDefinitions> 
      <TextBlock 
       Grid.ColumnSpan="2" 
       Grid.Row="0" 
       Style="{StaticResource CustomerDefinition}" 
       Text="Customer Definition"/> 
      <Border 
       Grid.Column="0" 
       Grid.Row="1" 
       Background="#FFEBE9E9" 
       BorderBrush="#FF8B8787" 
       BorderThickness="1"> 
       <StackPanel Background="{StaticResource NormalBrush}" Orientation="Horizontal"> 
        <Label Content="Customer Code"/> 
        <TextBox Text="SMITHA 098 (normally I'd bind here)"/> 
       </StackPanel> 
      </Border> 
      <Border 
       Grid.Column="1" 
       Grid.Row="1" 
       Background="#FFEBE9E9" 
       BorderBrush="#FF8B8787" 
       BorderThickness="1"> 
       <StackPanel Background="{StaticResource NormalBrush}" Orientation="Horizontal"> 
        <Label Content="Customer Type"/> 
        <TextBox Text="PRIVATE INDIVIDUAL"/> 
       </StackPanel> 
      </Border> 
     </Grid> </Page> 
5

WPF Grid इस तरह के रूप में दिखाई दे कोशिकाओं जरूरत नहीं है। उनके बारे में अदृश्य ग्रिड लाइनों के बारे में सोचें जिनके खिलाफ आप बाल तत्वों को गठबंधन कर सकते हैं।

तो, ग्रिड की कोशिकाओं को स्टाइल करने के लिए, आपको ग्रिड के अंदर गठित वस्तुओं को स्टाइल करना होगा।

Grid को WinForms DataGrid जैसे कुछ भी होने के बारे में सोचने में भ्रमित है। मुझे लगता है कि इसके निकटतम WinForms समकक्ष TableLayout नियंत्रण है।

कुछ तृतीय पक्ष ग्रिड नियंत्रण देखें। मैंने देवएक्सप्रेस का इस्तेमाल किया जबकि यह बीटा में था और इसे बहुत सरल पाया।

+0

वास्तविक घटक मैं नकल करने की कोशिश कर रहा हूँ DevExpress लेआउट नियंत्रण (WinForms) है। मैं वास्तव में कोशिकाओं में पृष्ठभूमि और मार्जिन जोड़ना चाहता था लेकिन ऐसा लगता है कि यह WPF लेआउट ग्रिड से परे है। –

+0

मैं समझता हूं कि आप क्या चाहते हैं। मैं बस इतना कह रहा हूं कि डब्ल्यूपीएफ ग्रिड नियंत्रण टैब्यूलर डेटा प्रदर्शित करने के लिए नहीं है, यह लेआउट के लिए है। हो सकता है कि एमएस को ग्रिडलाउट को स्पष्ट होने के लिए बुलाया जाना चाहिए था। –

3

मैं आपके स्टाइल के लिए सीमाओं का उपयोग करने की सलाह दूंगा।

आप प्रत्येक पंक्ति और प्रत्येक कॉलम के लिए सीमाएं बनाकर उस पंक्ति को बहुत आसानी से फिर से बना सकते हैं और तदनुसार पंक्तियों और कोल्पन सेट कर सकते हैं।

आपके पास कॉलस्पेन 2 के साथ 5 सीमाएं होंगी, ये सीमाएं प्रत्येक पंक्ति के लिए आपकी ढाल पृष्ठभूमि और प्रत्येक पंक्ति के ऊपर और नीचे सीमाओं की देखभाल करेंगे। फिर आपके पास पंक्ति 5 के साथ 2 सीमाएं होंगी, ये कॉलम सीमाओं को संभालेगी। कल्पना करें कि आप दृश्य ग्रिड प्रभाव बनाने के लिए सीमाओं को ओवरले कर रहे हैं।

शीर्षक और बाहरी सीमा के लिए, बस के रूप में की जरूरत है एक सीमा और शैली के साथ पूरे ग्रिड लपेट दें।

मैं तो आप एक ही स्थान पर अपने सभी स्टाइल की जानकारी रख सकते हैं संसाधनों के रूप में अपनी शैली के भंडारण की सिफारिश करेंगे।

जानने के लिए कैसे काम करता है स्टाइल, क्योंकि यह बहुत शक्तिशाली है ध्यान रखना है, लेकिन वहाँ एक सीखने की अवस्था है, क्योंकि यह रास्ता सीएसएस कार्यों के लिए काफी अलग है। यदि आप कर सकते हैं तो मैं WPF Unleashed पढ़ने की अनुशंसा करता हूं।

+0

धन्यवाद दान, लेकिन अगर यह एकमात्र तरीका है, तो क्या मैं किसी भी तरह ग्रिड का वारिस नहीं कर सकता और सीमाओं को स्वचालित रूप से जोड़ सकता हूं? मुझे सीमा पर प्रत्येक नियंत्रण जोड़ने के लिए नफरत होगी। –

+0

हाय मालाडन, आपको प्रत्येक नियंत्रण को सीमा के बच्चे को नियंत्रित करने की आवश्यकता नहीं है। आपके नियंत्रण ग्रिड के बच्चे होंगे। आप बस ग्रिड के "अतिरिक्त" ग्रिड के लिए ग्रिड के अतिरिक्त बच्चों के रूप में सीमाएं जोड़ने जा रहे हैं। कल्पना करें कि आप सब कुछ (या पीछे) के शीर्ष पर सीमाओं को ओवरले कर रहे हैं। – Dan

25

@Dan WPF अनलीज्ड है, जो मैं वर्तमान में पढ़ रहा हूँ सिफारिश की। बस आज सुबह, मैं एक खंड में अपने प्रश्न को संबोधित कर के पार चलो।

अध्याय 6, पृष्ठ 161:

पूछे जाने वाले प्रश्न: मैं ग्रिड कोशिकाओं पृष्ठभूमि रंग, गद्दी, और जैसे मैं एक HTML तालिका की कोशिकाओं के साथ कर सकते हैं सीमाओं कैसे दे सकते हैं?

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

बस किसी भी अन्य बच्चों (या स्पष्ट रूप से उन्हें ZIndex संलग्न संपत्ति के साथ चिह्नित करें) से पहले इस तरह के आयतों या सीमाओं को ग्रिड में जोड़ना सुनिश्चित करें, इसलिए उनका Z आदेश उन्हें मुख्य सामग्री के पीछे रखता है।

बीटीडब्ल्यू, डब्ल्यूपीएफ अनलेश चट्टानों। यह बहुत अच्छी तरह से लिखा गया है, और पूर्ण रंग में प्रिंट इसे पढ़ने के लिए और भी आसान बनाता है।

+2

यह अध्याय 5 है, WPF 4 के 2010 संस्करण के संस्करण 128 का खुलासा किया गया है। – DefenestrationDay

1

मैं जब डेटा ग्रिड कोशिकाओं के लिए मार्जिन (या गद्दी) स्थापित करने के लिए विधि की तलाश में इस पोस्ट पाया। मेरी समस्या हल हो गई थी उदाहरण के लिए xaml कोड (अंत के पास) पर पोस्ट किया गया - बहुत सरल।

http://forums.silverlight.net/forums/p/16842/55997.aspx

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