מדריך WPF – סידור פקדים: StackPanel & WrapPanel

פאנל (Panel) הוא פקד אשר יכול להכיל מספר פקדים. ישנם מספר פאנלים בXAML, כאשר ההבדל בין הפאנלים הוא בצורה שבה כל פאנל מסדר את הפקדים שהוא מכיל.

בפרק זה נלמד על הפאנלים StackPanel ו WrapPanel.

הפקד StackPanel

הפקד StackPanel הוא פאנל שמסדר את הפקדים שבתוכו בערימה, כלומר אחד אחרי השני.

בקוד הבא אנו מגדירים StackPanel שמכיל שלושה כפתורים:

<Window x:Class="StackPanelDemo.MainWindow"
        >="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        >:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow"
        Height="350"
        Width="525">
  <StackPanel>
    <Button Content="button 1" />
    <Button Content="button 2" />
    <Button Content="button 3" />
  </StackPanel>
</Window>

והתוצאה שנקבל:

נעיר כי הפקדים שנמצאים בתוך ה StackPanel (וכל פאנל אחר) יכולים להיות מסוגים שונים ולא בהכרח כולם מאותו סוג.

התכונה Orientation

לפקד StackPanel יש תכונה בשם Orientation שמאפשרת לקבוע האם סידור הפקדים יהיה מאונך (Vertical) או מאוזן (Horizontal). ברירת המחדל היא מאונך.

נראה כיצד לשנות תכונה זו למצב מאוזן:

<Window x:Class="StackPanelDemo.MainWindow"
        >="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        >:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow"
        Height="350"
        Width="525">
  <StackPanel Orientation="Horizontal">
    <Button Content="button 1" />
    <Button Content="button 2" />
    <Button Content="button 3" />
  </StackPanel>
</Window>

והתוצאה

הפקד WrapPanel

הפקד WrapPanel עובד בצורה דומה לפקד StackPanel בכך שהוא מסדר את הפקדים המוכלים בו אחד אחרי השני, אבל יש לו תכונה חשובה נוספת והיא גלישה של הפקדים במידה ונגמר המקום.

בקטע הקוד הבא אנחנו מגדירים 5 כפתורים בתוך WrapPanel:

<Window x:Class="WrapPanelDemo.MainWindow"
        >="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        >:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow"
        Height="350"
        Width="525">
  <WrapPanel>
    <Button Content="button 1" />
    <Button Content="button 2" />
    <Button Content="button 3" />
    <Button Content="button 4" />
    <Button Content="button 5" />
  </WrapPanel>
</Window>

ומקבלים את התוצאה

במידה ונקטין את החלון הכפתורים יסתדרו מחדש באופן הבא

כלומר שני הכפתורים האחרונים גלשו לשורה הבאה מאחר ולא היה להם מקום בשורה הראשונה.

התכונה Orientation

גם ל WrapPanel יש את התכונה Orientation והיא עובדת באותה צורה. נעיר רק כי אם משתמשים בסידור פקדים מאונך (Vertical), אזי הגלישה תיצור עמודה חדשה. בנוסף, כדאי לדעת שברירת המחדל של התכונה Orientation של WrapPanel היא דווקא Horizontal.

בקטע הקוד הבא אנו יכולים לראות דוגמא לשימוש בWrapPanel מאונך עם גלישה לעמודות:

<Window x:Class="WrapPanelDemo.MainWindow"
        >="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        >:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow"
        Height="350"
        Width="525">
  <WrapPanel Orientation="Vertical">
    <Button Content="button 1" />
    <Button Content="button 2" />
    <Button Content="button 3" />
    <Button Content="button 4" />
    <Button Content="button 5" />
  </WrapPanel>
</Window>

והתוצאה