מדריך Windows Phone – פקדים בסיסיים: ListBox
הפקד ListBox מאפשר להציג למשתמש רשימה של ערכים שמתוכם המשתמש יכול לבחור אחד או יותר ערכים.
יצירת ListBox עם מספר ערכים
התכונה החשובה בפקד ListBox היא התכונה Items שאליה ניתן להכניס מספר אלמנטים מטיפוס ListBoxIItem, כאשר כל אלמנט כזה מייצג אלמנט אחד ברשימה.
יצירת רשימה עם מספר ערכים קבועים יכולה להתבצע באמצעות קוד הXAML הבא:
<phone:PhoneApplicationPage
x:Class="PhoneDemo.MainPage"
>="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
>:x="http://schemas.microsoft.com/winfx/2006/xaml"
>:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
>:d="http://schemas.microsoft.com/expression/blend/2008"
>:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
d:DesignWidth="480"
d:DesignHeight="800"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
Orientation="Portrait"
SupportedOrientations="Portrait">
<StackPanel>
<ListBox>
<ListBox.Items>
<ListBoxItem
Content="Item 1" />
<ListBoxItem
Content="Item 2" />
<ListBoxItem
Content="Item 3" />
<ListBoxItem
Content="Item 4" />
</ListBox.Items>
</ListBox>
</StackPanel>
</phone:PhoneApplicationPage>
והתוצאה:
הוספת אלמנטים ל ListBox באמצעות קוד #C
לרוב נרצה לטעון את הערכים בצורה דינמית באמצעות קוד #C, לדוגמא כאשר הרשימה מגיעה מקובץ או ממסד נתונים. כדי לגשת לרשימה מהקוד ראשית יש לתת לה שם באמצעות x:Name כפי שלמדנו בפרק בתחילת המדריך ואז ניתן להוסיף ישירות לתכונה Items אלמנטים מסוג ListBoxItem.
להלן קוד XAML וקוד #C לאפליקציה שמוסיפה לפקד ListBox מספר אלמנטים דרך קוד:
<phone:PhoneApplicationPage
x:Class="PhoneDemo.MainPage"
>="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
>:x="http://schemas.microsoft.com/winfx/2006/xaml"
>:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
>:d="http://schemas.microsoft.com/expression/blend/2008"
>:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
d:DesignWidth="480"
d:DesignHeight="800"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
Orientation="Portrait"
SupportedOrientations="Portrait">
<StackPanel>
<ListBox
x:Name="listBox" />
</StackPanel>
</phone:PhoneApplicationPage>
והקוד בשפת #C:
using System.Windows.Controls;
using Microsoft.Phone.Controls;
namespace PhoneDemo
{
public partial class MainPage : PhoneApplicationPage
{
// Constructor
public MainPage()
{
InitializeComponent();
for (int i = 0; i < 10; ++i)
{
ListBoxItem newItem = new ListBoxItem();
newItem.Content = "Item " + i;
listBox.Items.Add(newItem);
}
}
}
}
תוצאת הרצת הקוד הנ"ל
בחירה יחידה או בחירה מרובה
הפקד ListBox יודע לעבוד בשלוש צורות עבודה שונות שנשלטות ע"י התכונה SelectionMode. לתכונה זו הערכים האפשריים הבאים:
- Single – בצורת עבודה זו המשתמש יכול לבחור לכל היותר איבר אחד מתוך רשימת האיברים.
- Multiple – בצורת עבודה זו המשתמש יכול לבחור מספר איברים מתוך הרשימה.
- Extended – לא בשימוש ב Windows Phone.
דוגמא לעבודה עם בחירה מרובה:
<phone:PhoneApplicationPage
x:Class="PhoneDemo.MainPage"
>="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
>:x="http://schemas.microsoft.com/winfx/2006/xaml"
>:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
>:d="http://schemas.microsoft.com/expression/blend/2008"
>:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
d:DesignWidth="480"
d:DesignHeight="800"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
Orientation="Portrait"
SupportedOrientations="Portrait">
<StackPanel>
<ListBox
x:Name="listBox"
SelectionMode="Multiple" />
</StackPanel>
</phone:PhoneApplicationPage>
האירוע SelectionChanged
האירוע SelectionChanged מופעל כאשר ישנו שינוי באלמנט שנבחר ברשימה. ניתן להשיג את האלמנט הנבחר החדש, אם יש רק אחד, ע"י התכונה SelectedItem. במידה ויש מספר איברים שנבחרו ניתן להשתמש בתכונה SelectedItems.
הקוד הבא מופעל כאשר הבחירה משתנה ומבצע מעבר על האיברים שנבחרו:
קוד הXAML:
<phone:PhoneApplicationPage
x:Class="PhoneDemo.MainPage"
>="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
>:x="http://schemas.microsoft.com/winfx/2006/xaml"
>:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
>:d="http://schemas.microsoft.com/expression/blend/2008"
>:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
d:DesignWidth="480"
d:DesignHeight="800"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
Orientation="Portrait"
SupportedOrientations="Portrait">
<StackPanel>
<ListBox
x:Name="listBox"
SelectionMode="Multiple"
SelectionChanged="listBox_SelectionChanged" />
</StackPanel>
</phone:PhoneApplicationPage>
קוד #C:
private void listBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
foreach (var selectedItem in listBox.SelectedItems)
{
//
}
}
תגובות בפייסבוק