ग्रिड नियंत्रण

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

अपने सबसे बुनियादी रूप में, ग्रिड बस आपके द्वारा रखे गए सभी नियंत्रणों को ले जाएगा, उन्हें अधिकतम उपलब्ध स्थान का उपयोग करने और इसे एक दूसरे के शीर्ष पर रखने के लिए खींचें:

<Window x:Class="WpfTutorialSamples.Panels.Grid"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Grid" Height="300" Width="300">
    <Grid>
		<Button>Button 1</Button>
		<Button>Button 2</Button>
	</Grid>
</Window>

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

<Window x:Class="WpfTutorialSamples.Panels.Grid"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Grid" Height="300" Width="300">
    <Grid>
		<Grid.ColumnDefinitions>
			<ColumnDefinition Width="*" />
			<ColumnDefinition Width="*" />
		</Grid.ColumnDefinitions>
		<Button>Button 1</Button>
		<Button Grid.Column="1">Button 2</Button>
	</Grid>
</Window>

इस उदाहरण में, हमने आसानी से उपलब्ध स्थान को दो कॉलम में विभाजित किया है, जो "स्टार चौड़ाई" (इसे बाद में समझाया जाएगा) का उपयोग करके समान रूप से स्थान साझा करेगा । दूसरे बटन पर, मैं दूसरे कॉलम में बटन रखने के लिए तथाकथित संलग्न संपत्ति का उपयोग करता हूं (0 पहला कॉलम है, 1 दूसरा है और इसी तरह आगे भी)। मैं इस संपत्ति को पहले बटन पर भी इस्तेमाल कर सकता था, लेकिन यह स्वचालित रूप से पहले कॉलम और पहली पंक्ति को सौपा जाता है, जो वास्तव में हम यहां चाहते हैं।

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

ग्रिड में उन्हें कैसे रखा जाता है ये और/या नियन्त्रण के माध्यम से कुछ परिस्थितियों में आप चाहते हैं कि वे केवल उस स्थान को ले जिसके उन्हें जरूरत हो। ऐसा करने का सबसे आसान तरीका है क्षैतिज एलाइनमेंट और वर्टिकल एलाइनमेंट सीधे उन नियंत्रणों पर सेट करना है जिन्हें आप कुशल बनाना चाहते हैं। उपर्युक्त उदाहरण का एक संशोधित संस्करण यहां दिया गया है:

<Window x:Class="WpfTutorialSamples.Panels.Grid"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Grid" Height="300" Width="300">
    <Grid>
		<Grid.ColumnDefinitions>
			<ColumnDefinition Width="*" />
			<ColumnDefinition Width="*" />
		</Grid.ColumnDefinitions>		
		<Button VerticalAlignment="Top" HorizontalAlignment="Center">Button 1</Button>
		<Button Grid.Column="1" VerticalAlignment="Center" HorizontalAlignment="Right">Button 2</Button>
	</Grid>
</Window>

जैसा कि आप परिणामी स्क्रीनशॉट से देख सकते हैं, पहला बटन अब शीर्ष और केंद्र में रखा गया है। दूसरा बटन मध्य में रखा गया है, दाईं ओर किया गया है।

Summary

The Grid is a very versatile panel, with many more possibilities than we saw in this article. We'll dig into the rest of them in the next several articles.