वर्टिकल सेपरेटर कैसे जोड़ें?

Question

मैं एक ग्रिड में एक लंबवत विभाजक जोड़ना चाहता हूं, लेकिन मैं केवल क्षैतिज पा सकता हूं। कोई संपत्ति नहीं है, जहां आप विभाजक की रेखा क्षैतिज या ऊर्ध्वाधर होना चाहिए, तो आप प्रवेश कर सकते हैं?

मैंने बहुत कुछ खोजा, लेकिन इसके लिए एक छोटा और आसान समाधान नहीं मिला।

मैं .Net Framework 4.0 और विजुअल स्टूडियो 2012

अगर मैं 90 डिग्री से क्षैतिज विभाजक बारी बारी से करने की कोशिश है, यह करने के लिए अन्य घटकों के लिए "डॉक" क्षमता खो देता है का उपयोग करें।

घुमाया विभाजक इस तरह दिखता है:

<Separator HorizontalAlignment="Left" Height="100" Margin="264,26,0,0" VerticalAlignment="Top" Width="100" RenderTransformOrigin="0.5,0.5"> 
    <Separator.RenderTransform> 
     <TransformGroup> 
      <ScaleTransform/> 
      <SkewTransform/> 
      <RotateTransform Angle="90"/> 
      <TranslateTransform/> 
     </TransformGroup> 
    </Separator.RenderTransform> 
</Separator> 

Answer 1

अतीत में मैं का उपयोग किया है शैली पाया here

<Style x:Key="VerticalSeparatorStyle" 
     TargetType="{x:Type Separator}" 
     BasedOn="{StaticResource {x:Type Separator}}"> 
    <Setter Property="Margin" Value="6,0,6,0"/> 
    <Setter Property="LayoutTransform"> 
     <Setter.Value> 
      <TransformGroup> 
       <TransformGroup.Children> 
        <TransformCollection> 
         <RotateTransform Angle="90"/> 
        </TransformCollection> 
       </TransformGroup.Children> 
      </TransformGroup> 
     </Setter.Value> 
    </Setter> 
</Style> 

<Separator Style="{DynamicResource VerticalSeparatorStyle}" /> 

आप RenderTransform तो परिवर्तन के बजाय LayoutTransform में परिवर्तन निर्धारित करने की आवश्यकता लेआउट पास के दौरान होता है, न कि रेंडर पास के दौरान। लेआउट पास तब होता है जब डब्ल्यूपीएफ लेआउट नियंत्रणों की कोशिश कर रहा है और पता लगाता है कि प्रत्येक नियंत्रण कितना स्थान लेता है, जबकि डेंडर पास नियंत्रण के बाद डब्लूपीएफ लेआउट पास के बाद होता है।

आप LayoutTransform और RenderTransformhere या here

Answer 2

के बीच अंतर के बारे में अधिक पढ़ सकते हैं यह वास्तव में क्या लेखक के लिए नहीं कहा है, लेकिन अभी भी, यह बहुत आसान है और अपेक्षा के अनुरूप वास्तव में काम करता है।

<StackPanel Grid.Column="2" Orientation="Horizontal"> 
    <Button >Next</Button> 
    <Button >Prev</Button> 
    <Rectangle VerticalAlignment="Stretch" Width="1" Margin="2" Stroke="Black" /> 
    <Button>Filter all</Button> 
</StackPanel> 

Answer 3

यह ठीक करना चाहिए क्या लेखक चाहता था:

<StackPanel Orientation="Horizontal"> 
    <Separator Style="{StaticResource {x:Static ToolBar.SeparatorStyleKey}}" />    
</StackPanel> 

यदि आप एक क्षैतिज विभाजक चाहते हैं, Vertical करने के लिए StackPanel की Orientation बदलने

आयत काम करता है।

Answer 4

http://social.msdn.microsoft.com/Forums/vstudio/en-US/12ead5d4-1d57-4dbb-ba81-bc13084ba370/how-can-i-add-a-line-as-a-visual-separator-to-the-content-control-like-grid?forum=wpf से:

इस उदाहरण की कोशिश करो और अगर यह अपनी आवश्यकताओं फिट बैठता है, वहाँ यह करने के लिए तीन मुख्य पहलू हैं देखते हैं।

1. लाइन। स्ट्रेच भरने के लिए सेट है।

2. क्षैतिज रेखाओं के लिए रेखा का वर्टिकल अलाइनमेंट नीचे सेट किया गया है, और वर्टिकललाइन के लिए क्षैतिज हस्ताक्षर सही पर सेट है।

3. हमें तब पंक्ति को बताने की ज़रूरत है कि कितनी पंक्तियां या कॉलम फैलाने के लिए हैं, यह या तो RowDefinitions या ColumnDefintions गिनती संपत्ति के लिए बाध्यकारी द्वारा किया जाता है।

   
   
   

   <Style x:Key="horizontalLineStyle" TargetType="Line" BasedOn="{StaticResource lineStyle}"> 
        <Setter Property="X2" Value="1" /> 
        <Setter Property="VerticalAlignment" Value="Bottom" /> 
        <Setter Property="Grid.ColumnSpan" 
          Value="{Binding 
             Path=ColumnDefinitions.Count, 
             RelativeSource={RelativeSource AncestorType=Grid}}"/> 
       </Style> 
   
       <Style x:Key="verticalLineStyle" TargetType="Line" BasedOn="{StaticResource lineStyle}"> 
        <Setter Property="Y2" Value="1" /> 
        <Setter Property="HorizontalAlignment" Value="Right" /> 
        <Setter Property="Grid.RowSpan" 
          Value="{Binding 
             Path=RowDefinitions.Count, 
             RelativeSource={RelativeSource AncestorType=Grid}}"/> 
       </Style> 
   </Grid.Resources>   
   
   <Grid.RowDefinitions> 
       <RowDefinition Height="20"/> 
       <RowDefinition Height="20"/> 
       <RowDefinition Height="20"/> 
       <RowDefinition Height="20"/> 
   </Grid.RowDefinitions> 
   
   <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="20"/> 
       <ColumnDefinition Width="20"/> 
       <ColumnDefinition Width="20"/> 
       <ColumnDefinition Width="20"/> 
   </Grid.ColumnDefinitions> 
   
   <Line Grid.Column="0" Style="{StaticResource verticalLineStyle}"/> 
   <Line Grid.Column="1" Style="{StaticResource verticalLineStyle}"/> 
   <Line Grid.Column="2" Style="{StaticResource verticalLineStyle}"/> 
   <Line Grid.Column="3" Style="{StaticResource verticalLineStyle}"/> 
   
   <Line Grid.Row="0" Style="{StaticResource horizontalLineStyle}"/> 
   <Line Grid.Row="1" Style="{StaticResource horizontalLineStyle}"/> 
   <Line Grid.Row="2" Style="{StaticResource horizontalLineStyle}"/> 
   <Line Grid.Row="3" Style="{StaticResource horizontalLineStyle}"/> 
   

Answer 5

यह कोई कार्यक्षमता और सभी दृश्य प्रभाव के साथ यह कर का एक बहुत ही आसान तरीका है,

एक ग्रिड का उपयोग करें और बस इसे अनुकूलित करें।

<Grid Background="DodgerBlue" Height="250" Width="1" VerticalAlignment="Center" Margin="5,0,5,0"/> 

ऐसा करने का एक और तरीका।

Answer 6

मुझे "लाइन" नियंत्रण का उपयोग करना पसंद है। यह आपको सटीक नियंत्रण देता है जहां विभाजक शुरू होता है और समाप्त होता है। यद्यपि यह वास्तव में एक विभाजक नहीं है, यह फ़ंक्शन एक ही तरीका है, खासकर स्टैकपैनल में।

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

<StackPanel Orientation="Horizontal"> 
    <Button Content="Button 1" Height="20" Width="70"/> 
    <Line X1="0" X2="0" Y1="0" Y2="20" Stroke="Black" StrokeThickness="0.5" Margin="5,0,10,0"/> 
    <Button Content="Button 2" Height="20" Width="70"/> 
</StackPanel> 

X1 = एक्स प्रारंभिक स्थिति (एक खड़ी रेखा के लिए 0 होना चाहिए)

X2 = एक्स न खत्म होने वाली स्थिति (एक्स 1 = एक खड़ी रेखा के लिए X2)

Y1 = y प्रारंभिक स्थिति (चाहिए एक खड़ी रेखा)

Y2 = y न खत्म होने वाली स्थिति (Y2 = वांछित लाइन ऊंचाई)

मैं "मार्जिन" का उपयोग खड़ी रेखा के किसी भी पक्ष पर गद्दी जोड़ने के लिए 0 हो। इस उदाहरण में, बाईं ओर 5 पिक्सेल और ऊर्ध्वाधर रेखा के दाईं ओर 10 पिक्सल हैं।

चूंकि लाइन नियंत्रण आपको लाइन के प्रारंभ और अंत के एक्स और वाई निर्देशांक चुनने देता है, तो आप इसे किसी भी कोण पर क्षैतिज रेखाओं और रेखाओं के लिए भी उपयोग कर सकते हैं।