The StackPanel control

استک پنلبسیار شبیه به رپ پنل است، اما با حداقل یک تفاوت مهم: استک پنل محتوی خود را احاطه نمی کند. به جای آن محتوای خود را در یک جهت گسترش می دهد، و اجازه می دهد شما آیتم ها را یکی پس از دیگری روی سر هم سوار کنید. اجازه دهید یک مثال خیلی ساده را تجربه کنیم، کارهای بیشتری ما با رپ پنل می توانیم انجام دهیم:

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

به اولین چیزی که شما باید دقت کنید این است که چطور استک پنل واقعاً اهمیتی نمی دهد که آیا فضای کافی برای محتوا وجود دارد یا خیر. به هیچ وجه محتوا را احاطه نمی کند و به طور خودکار امکان پیمایش را در اختیار شما قرار نمی دهد (هر چند می توانید از یک کنترل اسکرول ویوور برای آن استفاده کنید - در فصل بعدی در مورد آن بیشتر توضیح خواهیم داد).

شما همچنین باید متوجه باشید که جهت پیش فرض استک پنل افقی است. اما درست مانند رپ پنل، با استفاده از ویژگی جهت، می توان به سادگی آن را تغییر داد:

<StackPanel Orientation="Horizontal">

نکته دیگری که احتمالا متوجه آن خواهید شد این است که استک پنل کنترل فرزند خود را به طور پیش فرض گسترش می دهد. در یک استک پنل عمود تراز شده، مانند مثال اول، همه کنترل‌های فرزند به صورت افقی کشیده می‌شوند. در استک پنل افقی تراز شده، تمام کنترل های فرزند به صورت عمودی کشیده می شوند، همانطور که در بالا مشاهده می شود.استک پنل این کار را با تنظیم ویژگی HorizontalAlignment یا VerticalAlignment در کنترل های فرزند خود روی Stretch انجام می دهد، اما اگر بخواهید می توانید به راحتی آن را لغو کنید. به مثال بعدی نگاهی بیندازید، جایی که ما از همان نشانه گذاری در مثال قبلی استفاده می کنیم، اما این بار مقادیری را به ویژگی VerticalAlignment برای همه کنترل های فرزند اختصاص می دهیم.

<Window x:Class="WpfTutorialSamples.Panels.StackPanel"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="StackPanel" Height="160" Width="300">
	<StackPanel Orientation="Horizontal">
		<Button VerticalAlignment="Top">Button 1</Button>
		<Button VerticalAlignment="Center">Button 2</Button>
		<Button VerticalAlignment="Bottom">Button 3</Button>
		<Button VerticalAlignment="Bottom">Button 4</Button>
		<Button VerticalAlignment="Center">Button 5</Button>
		<Button VerticalAlignment="Top">Button 6</Button>
	</StackPanel>
</Window>

ما از مقادیر بالا، مرکز و پایین برای قرار دادن دکمه ها در یک الگوی زیبا، فقط برای کلیک کردن استفاده می کنیم. البته همین کار را می‌توان برای استک پنل با تراز عمودی انجام داد، جایی که می‌توانید از HorizontalAlignment روی کنترل‌های فرزند استفاده کنید:

<Window x:Class="WpfTutorialSamples.Panels.StackPanel"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="StackPanel" Height="160" Width="300">
	<StackPanel Orientation="Vertical">
		<Button HorizontalAlignment="Left">Button 1</Button>
		<Button HorizontalAlignment="Center">Button 2</Button>
		<Button HorizontalAlignment="Right">Button 3</Button>
		<Button HorizontalAlignment="Right">Button 4</Button>
		<Button HorizontalAlignment="Center">Button 5</Button>
		<Button HorizontalAlignment="Left">Button 6</Button>
	</StackPanel>
</Window>

همانطور که می توانید ببینید، کنترل ها هنوز از بالا به پایین می روند، اما به جای داشتن همان عرض، هر کنترل در چپ، راست یا مرکز تراز شده است.