عنصر StackPanel

يشبه StackPanel إلى حد كبير الـ WrapPanel ، و لكن مع وجود اخلاف مهم واحد على الأقل: الـ StackPanel لا يلف المحتوى. بدلًا من ذلك, بتمدد المحتوى في اتجاه واحد و الذي يسمح لك بتكديس عنصر بعد عنصر فوق بعضها ال بعض, لنجرب مثالًا بسيطًا جدا, كما فعلنا مع WarpPanel:

<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>

أول شيئ عليك ملاحظته هو ان كيف لوحة التكديس لا تهتم ما إذا كان هناك متسع للمحتوى. فإنها لا تقوم بلف المحتوى الى اي اتجاه, وأيضاً لا تقوم بتزويدك بقدرة التمرير( بالطبع بإمكانك استخدام عنصر "عارض التمرر" "ScrollViewer" المزيد عن هذا العنصر في فصل لاحق)

أيضاً بإمكانك ملاحظة الإتجاه الإفتراضي للوحة التكديس هو الإتجاه العامودي بعكس لوحة الإلتفاف بحيث ان الإتجاه الإفتراضي لها هو الإتجاه الأفقي. ولكن مثل لوحة الإلتفاف يمكنك تغيير إتجهاها ببساطة بواسطة خصية الإتجاه "Orientation":

<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>

لقد استخدمنا "أعلى Top", "المركز Center", و "الأسفل Bottom" كقيم لترتيب ووضع الأزرار في نمط جميل. نفس الشيئ بالإمكان الحصول علية للوحات التكديس بالإتجاه العامودي, بحث ستستخدم الخاصية "الإرتصاف الأفقي 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>

كما ترى, العناصر ما تزال تأتي من الأعلى للأسفل و لكن بدلاً من امتلاكهم لنفس العرض, كل عنصر ارتصف لليسار أو لليمين أو المركز.