स्टैक पैनल में आइटम संरेखित करें?


148

मैं सोच रहा था कि क्या मैं क्षैतिज-उन्मुख स्टैकपैनल में 2 नियंत्रण रख सकता हूं ताकि सही आइटम को स्टैकपैनल के दाईं ओर डॉक किया जाए।

मैंने निम्नलिखित कोशिश की लेकिन यह काम नहीं किया:

<StackPanel Orientation="Horizontal">
    <TextBlock>Left</TextBlock>
    <Button Width="30" HorizontalAlignment="Right">Right<Button>
</StackPanel>

ऊपर स्निपेट में मैं चाहता हूं कि बटन स्टैकपैनल के दाईं ओर डॉक किया जाए।

नोट: मुझे इसकी आवश्यकता है स्टैकपैनल के साथ, ग्रिड आदि नहीं।


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

हाँ, मैं किसी को बस मुझे इस तरह से स्टैक पैनल से भरा एक प्रोजेक्ट दिया, यही वह चाहता है कि वह इसे ठीक कर दे।
शिमी वेइटहैंडलर

3
मुझे पता है कि यह (अत्यंत) देर से है, लेकिन क्या आप स्टैकपैन के भीतर डॉकपेल नहीं डाल सकते हैं?
किआन

1
@ कियान, आप अपनी टिप्पणी के साथ बिल्कुल सही हैं, मैंने खुद ही इसके बारे में सोचा, कोशिश की, और इसने पूरी तरह से काम किया।
गेब्रियलियस

जवाबों:


221

आप इसे एक से प्राप्त कर सकते हैं DockPanel:

<DockPanel Width="300">
    <TextBlock>Left</TextBlock>
    <Button HorizontalAlignment="Right">Right</Button>
</DockPanel>

अंतर यह है कि StackPanelबाल तत्वों को एकल लाइन (या तो ऊर्ध्वाधर या क्षैतिज रूप से) में व्यवस्थित करेगा जबकि एक DockPanelऐसा क्षेत्र परिभाषित करता है जहां आप एक या दूसरे के सापेक्ष बाल तत्वों को क्षैतिज या लंबवत रूप से व्यवस्थित कर सकते हैं ( Dockसंपत्ति एक तत्व की स्थिति को अन्य के सापेक्ष बदल देती है) एक ही कंटेनर के भीतर तत्व। संरेखण गुण, जैसे कि HorizontalAlignment, अपने मूल तत्व के सापेक्ष एक तत्व की स्थिति को बदलते हैं)।

अपडेट करें

जैसा कि टिप्पणियों में बताया गया है कि आप FlowDirectionएक की संपत्ति का उपयोग भी कर सकते हैं StackPanel। @ D_Bester का उत्तर देखें ।


1
यही मेरा मतलब है 'आदि' के साथ मुझे लगता है कि इसका उत्तर नहीं है, और इसे कठिन तरीके से करना होगा, ऊपर जेएमडी के लिए मेरी टिप्पणी पढ़ें
शम्मी वेइटहैंडलर

ठीक है, StackPanel केवल उस लेआउट को नहीं कर सकता जो आप चाहते हैं। एक ग्रिड आपको सबसे अधिक लचीलापन देगा, लेकिन StackPanel से DockPanel में परिवर्तन बहुत मुश्किल नहीं लगता है।
डर्क वोल्मार

2
विंडोज 8 में कोई डॉकपैनल नहीं है, कोई अन्य समाधान?
क्रिस्टोफ

@DirkVollmar वास्तव में StackPanel काफी अच्छा काम करता है, मेरा जवाब देखें।
D_Bester 15

1
यदि आप आइटम संरेखित सही सबसे जाने के लिए, सेट चाहते LastChildFill="False"है कि <DockPanel LastChildFill="False">, देख stackoverflow.com/a/9599290/4573839
यू यांग जियान

68

यो FlowDirectionके Stack panelलिए सेट कर सकते हैं RightToLeft, और फिर सभी आइटम दाईं ओर गठबंधन किया जाएगा।


3
हालांकि ध्यान दें कि यह स्टैकपैनल में नियंत्रण के क्रम को बदल (उलट) देता है।
रूमबलएक्स ०

1
@ स्क्रिप्‍ट यदि फ़्लोडायरेक्‍शन एक और स्‍टैकपैनल में डाली गई समस्‍या है और फ़्लोडायरेक्‍शन निर्दिष्ट करें। मेरा जवाब देखिए।
D_Bester

1
@ rumblefx0: ध्यान दें, DockPanel नियंत्रण के क्रम को उलट देता है, यदि वे दाईं ओर या नीचे डॉक किए जाते हैं। ऐसा इसलिए है क्योंकि पहला नियंत्रण, पहले डॉक किया गया है।
ओलिवियर जैकोट-डेसकोम्बर्स

29

जो लोग इस सवाल पर आते हैं के लिए, यहाँ कैसे इस लेआउट को प्राप्त करने के लिए के साथ एक Grid:

<Grid>
    <TextBlock Text="Server:"/>
    <TextBlock Text="http://127.0.0.1" HorizontalAlignment="Right"/>
</Grid>

बनाता है

Server:                                                                   http://127.0.0.1

18

एक डॉकपैनल का उपयोग करके यह काम नहीं कर सका, जिस तरह से मैं चाहता था और एक स्टैकपैनल के प्रवाह की दिशा को उलट देना परेशानी भरा है। ग्रिड का उपयोग करना एक विकल्प नहीं है क्योंकि इसके अंदर की वस्तुओं को रनटाइम पर छिपाया जा सकता है और इस प्रकार मुझे डिज़ाइन समय पर कुल कॉलमों की जानकारी नहीं है। सबसे अच्छा और सरल उपाय जो मैं आ सकता है, वह है:

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="Auto" />
    </Grid.ColumnDefinitions>
    <StackPanel Grid.Column="1" Orientation="Horizontal">
        <!-- Right aligned controls go here -->
    </StackPanel>
</Grid>

यह स्टैकपैनल के अंदर नियंत्रणों के परिणामस्वरूप उपलब्ध स्थान के दाईं ओर संरेखित किया जाएगा, भले ही नियंत्रण की संख्या - डिजाइन और रनटाइम दोनों पर। वाह! :)


अगर FlowDirection एक समस्या है जो किसी अन्य StackPanel में डाली जाती है और FlowDirection को निर्दिष्ट करती है। मेरा जवाब देखिए।
D_Bester

मुझे लगता है कि नेस्टेड फ्लो दिशाओं के साथ खिलवाड़ करने की तुलना में यह एक बहुत ही साफ-सुथरा समाधान है
रॉस

5

यह मेरे लिए पूरी तरह से काम करता है। जब से आप दाईं ओर शुरू कर रहे हों, बस बटन पहले लगाएं। यदि FlowDirection एक समस्या बन जाता है, तो इसके चारों ओर एक StackPanel जोड़ें और उस भाग के लिए FlowDirection = "LeftToRight" निर्दिष्ट करें। या बस प्रासंगिक नियंत्रण के लिए FlowDirection = "LeftToRight" निर्दिष्ट करें।

<StackPanel Orientation="Horizontal" HorizontalAlignment="Right" FlowDirection="RightToLeft">
    <Button Width="40" HorizontalAlignment="Right" Margin="3">Right</Button>
    <TextBlock Margin="5">Left</TextBlock>
    <StackPanel FlowDirection="LeftToRight">
        <my:DatePicker Height="24" Name="DatePicker1" Width="113" xmlns:my="http://schemas.microsoft.com/wpf/2008/toolkit" />    
    </StackPanel>
    <my:DatePicker FlowDirection="LeftToRight" Height="24" Name="DatePicker1" Width="113" xmlns:my="http://schemas.microsoft.com/wpf/2008/toolkit" />    
</StackPanel>

4
<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <TextBlock Text="Left"  />
    <Button Width="30" Grid.Column="1" >Right</Button>
</Grid>

0

विंडोज़ के लिए 10 स्टैक पैनल के बजाय रिश्तेदारपैनल का उपयोग करें, और उपयोग करें

relativepanel.alignrightwithpanel = "true"

निहित तत्वों के लिए।


0

यदि आपको एक समस्या हो रही है जैसे मेरे पास जहां लेबल मेरे ऊर्ध्वाधर स्टैक पैनल में केंद्रित थे, तो सुनिश्चित करें कि आप पूर्ण चौड़ाई नियंत्रण का उपयोग करते हैं। चौड़ाई गुण हटाएं, या अपने बटन को पूर्ण-चौड़ाई वाले कंटेनर में डालें जो आंतरिक संरेखण की अनुमति देता है। WPF लेआउट को नियंत्रित करने के लिए कंटेनरों का उपयोग करने के बारे में है।

<StackPanel Orientation="Vertical">
    <TextBlock>Left</TextBlock>
    <DockPanel>
        <Button HorizontalAlignment="Right">Right</Button>
    </DockPanel>
</StackPanel>

लेफ्ट बटन के साथ लेफ्ट लेबल वाला वर्टिकल स्टैकपैनल

आशा है कि ये आपकी मदद करेगा।


-8

हो सकता है कि आप क्या चाहते हैं यदि आपको हार्ड-कोडिंग आकार के मूल्यों से बचने की आवश्यकता नहीं है, लेकिन कभी-कभी मैं इसके लिए "शिम" (सेपरेटर) का उपयोग करता हूं:

<Separator Width="42"></Separator>
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.