ListBox列表控件
ListBox是一个列表控件，用于显示条目类的数据，默认每行只能显示一个内容项，当然，我们可以通过修改它的数据模板，来自定义每一行（元素）的数据外观，达到显示更多数据的目的。
1. 属性分析
ListBox自身的属性比较少，SelectionMode 属性比较重要，它可以决定当前的ListBox控件是单选还是多选，它的值为Extended时，表示用户需要按下shift键才能多选。如果SelectionMode为多选状态，那么多选的结果保存在SelectedItems 属性。
另外，ListBox还自带了滚动条，如果内容超出显示区域，这时滚动条便起作用。
2. ListBox示例
前端代码
<StackPanel>
<ListBox x:Name="listbox" MinHeight="100"
DisplayMemberPath="Name"
SelectedValuePath="Age"/>
<Button Content="查看结果" Click="Button_Click"/>
<TextBlock x:Name="_TextBlock"/>
</StackPanel>
后端代码
public partial class MainWindow : Window
{
public class Person
{
public string Name { get; set; }
public int Age { get; set; }
public string Address { get; set; }
}
public MainWindow()
{
InitializeComponent();
listbox.Items.Add(new Person { Name = "张三", Age = 22, Address = "广东省廉江市车板镇大坝村" });
listbox.Items.Add(new Person { Name = "李四", Age = 23, Address = "江西省景德镇市市辖区" });
listbox.Items.Add(new Person { Name = "王五", Age = 24, Address = "上海市虹口区" });
}
private void Button_Click(object sender, RoutedEventArgs e)
{
var selectedItem = listbox.SelectedItem;
var selectedValue = listbox.SelectedValue;
_TextBlock.Text = $"{selectedItem},{selectedValue}";
}
}
我们选中ListBox中的李四，然后单点查看结果按钮，SelectedItem属性得到了一个Person类，所以输出的值为Person，而SelectedValue属性得到了李四的年龄，所以输出的结果是23。
注意：
Items属性是一个只读属性，所以我们只能能过Items的Add方法向集合增加元素。
3. ListBoxItem子项
ListBox还有它专门配合业务开发的子项控件——ListBoxItem。ListBoxItem继承于ContentControl内容控件，里面的Content属性可以容纳任意引用类型，也就是说，ListBoxItem也可以容纳任意引用类型，也就是说，ListBox的子项也可以容纳任意的引用类型。
所以，ListBoxItem可以这样使用：
前端
<StackPanel>
<ListBox x:Name="listbox">
<ListBoxItem>
<Button Content="这是一个按钮"/>
</ListBoxItem>
<ListBoxItem>
<Border Height="30" Background="Red"/>
</ListBoxItem>
<ListBoxItem Content="这是一个字符串"/>
<ListBoxItem>
<ProgressBar Maximum="100" Value="50" Height="25" Width="450"/>
</ListBoxItem>
这里直接写字符串
<ListBoxItem>
<StackPanel Orientation="Horizontal">
<CheckBox Content="复选框"/>
<RadioButton Content="单选框 "/>
</StackPanel>
</ListBoxItem>
</ListBox>
<Button Content="查看结果" Click="Button_Click"/>
<TextBlock x:Name="textblock" TextWrapping="Wrap"/>
</StackPanel>
后端
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
}
private void Button_Click(object sender, RoutedEventArgs e)
{
try
{
var selectedItem = listbox.SelectedItem;
var content = ((ContentControl)selectedItem).Content;
textblock.Text = $"selectedItem={selectedItem}\r\ncontent={content}";
}
catch (Exception ex)
{
MessageBox.Show(ex.Message);
}
}
}
如上所示，我们在ListBoxj控件里面实例化了好几个ListBoxItem，但是每个ListBoxItem的Content属性都不一样，有Button，Border ，ProgressBar ，字符串，最后，我们来获取这些选中项的内容。
除了直接写的字符串不能转换之外，其它项的结果，SelectedItem属性总是ListBoxItem，而Content可以是我们设置的其它控制。
ListBoxItem的源码定义：
public class ListBoxItem : ContentControl
{
public static readonly DependencyProperty IsSelectedProperty;
public static readonly RoutedEvent SelectedEvent;
public static readonly RoutedEvent UnselectedEvent;
public ListBoxItem();
public bool IsSelected { get; set; }
public event RoutedEventHandler Selected;
public event RoutedEventHandler Unselected;
protected override AutomationPeer OnCreateAutomationPeer();
protected override void OnMouseEnter(MouseEventArgs e);
protected override void OnMouseLeave(MouseEventArgs e);
protected override void OnMouseLeftButtonDown(MouseButtonEventArgs e);
protected override void OnMouseRightButtonDown(MouseButtonEventArgs e);
protected virtual void OnSelected(RoutedEventArgs e);
protected virtual void OnUnselected(RoutedEventArgs e);
protected internal override void OnVisualParentChanged(DependencyObject oldParent);
}
如上所示，可以看到ListBoxItem有一个叫IsSelected属性，表示该项是否被选中，同时，它还有两个事件，分别是Selected选中和Unselected未选中，我们可以去订阅这两个事件，以此来做一些业务。
ListView数据列表控件
ListView继承于ListBox，在ListBox控件的基础上增加了数据视图。从而让我们可以很轻松的设置每一列的标题，以显示某个数据表结构及内容。
1. ListView示例
前端代码：
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition Width="200"/>
</Grid.ColumnDefinitions>
<ListView Grid.Column="0" x:Name="listview" SelectionChanged="listview_SelectionChanged">
<ListView.View>
<GridView>
<GridViewColumn Header="姓名" DisplayMemberBinding="{Binding Name}"/>
<GridViewColumn Header="年龄" DisplayMemberBinding="{Binding Age}"/>
<GridViewColumn Header="地址" DisplayMemberBinding="{Binding Address}"/>
</GridView>
</ListView.View>
</ListView>
<StackPanel Grid.Column="1">
<StackPanel Orientation="Horizontal" Margin="5">
<TextBlock Text="姓名:"/>
<TextBlock x:Name="_TextBlockName"/>
</StackPanel>
<StackPanel Orientation="Horizontal" Margin="5">
<TextBlock Text="年龄:"/>
<TextBlock x:Name="_TextBlockAge"/>
</StackPanel>
<StackPanel Orientation="Horizontal" Margin="5">
<TextBlock Text="地址:"/>
<TextBlock x:Name="_TextBlockAddress"/>
</StackPanel>
</StackPanel>
</Grid>
后端代码
public class Person
{
public string Name { get; set; }
public int Age { get; set; }
public string Address { get; set; }
}
/// <summary>
/// MainWindow.xaml 的交互逻辑
/// </summary>
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
listview.Items.Add(new Person { Name = "张三", Age = 22, Address = "广东省廉江市车板镇大坝村" });
listview.Items.Add(new Person { Name = "李四", Age = 23, Address = "江西省景德镇市市辖区" });
listview.Items.Add(new Person { Name = "王五", Age = 24, Address = "上海市虹口区" });
}
private void listview_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
ListView listView = sender as ListView;
if (listView == null) return;
var person = listView.SelectedItem as Person;
if (person == null) return;
_TextBlockName.Text = person.Name;
_TextBlockAge.Text = person.Age + "岁";
_TextBlockAddress.Text = person.Address;
}
}
2. 分析
首先，我们在前端实例化了一个ListView控件，并为View属性实例化了一个GridView对象,最后为GridView对象实例化了3列GridViewColumn ，分别设置为姓名年龄和地址，特别需要注意的是DisplayMemberBinding属性的写法，这里采用了数据绑定的写法，意思是将ListView控件的数据源的Name属性显示在姓名那一列，Age属性显示在年龄那一列，Address属性显示在地址那一列（我们明确知道ListView数据源的类型就是Person的实例集合）。
事件处理
在ListView控件的SelectionChanged事件中，我们先将sender转成ListView ，再从中获取当前选中项（即person），最后显示详细信息在界面上即可。这样就演示了数据怎么加载显示到ListView，又怎么样从ListView上获取的过程。
扫一扫
892
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
