WPF 控件专题 ListBox 控件详解

1、ListBox 介绍

ListBox 列表控件。

ListBox 是一个 ItemsControl，这意味着它可以包含任何类型的对象的集合 (，例如字符串、图像或面板) 。

一个 ListBox 中的多个项是可见的，与仅 ComboBox具有所选项可见的项不同，除非 IsDropDownOpen 属性为 true。该 SelectionMode 属性确定一次是否可以选择多个项 ListBox 。

**************************************************************************************************************

2、常用属性介绍

FontFamily：字体系列；   FontSize：字体大小；   FontStretch：字体在屏幕上紧缩或加宽的程度；FontWeight：字体粗细；

   Background：背景；   BorderBrush：边框颜色；   BorderThickness：边框宽度；   Foreground：前景色；

   Width/Height：宽度/高度；   Name：元素标识名称；   IsEnabled：使能，是否可用；   Margin：外边距；

   Opacity：透明度；   Visibility：可见性；   IsVisible：是否可见；   FlowDirection：其子元素的流动方向；

   LayoutTransform：在执行布局时应该应用于此元素的图形转换方式。   RenderTransform：元素的呈现位置的转换信息；

   RenderTransformOrigin：由RenderTransform声明的任何可能呈现转换的中心点，相对于元素的边界。

   HorizontalAlignment/VerticalAlignment：在父元素中组合此元素时所应用的水平对齐特征/垂直对齐特征。

    HorizontalContentAlignment/VerticalContentAlignment：控件内容的水平对齐方式/垂直对齐方式。

Items：获取用于生成 ItemsControl 的内容的集合。

ItemsSource：获取或设置用于生成 ItemsControl 的内容的集合。

SelectedIndex：获取或设置当前选择中第一项的索引，如果选择为空，则返回负一(-1)。

SelectedItem：获取或设置当前选择中的第一项，或者，如果选择为空，则返回 null。

SelectedItems：获取当前选定的项。

SelectedValue：获取或设置通过使用 SelectedItem 而获取的 SelectedValuePath 的值。

SelectedValuePath：获取或设置用于从 SelectedValue 获取 SelectedItem 的路径。

SelectionMode：获取或设置 ListBox 的选择行为。

SnapsToDevicePixels：获取或设置一个值，该值确定在呈现过程中，此元素的呈现是否应使用特定于设备的像素设置。

**************************************************************************************************************

3、具体示例代码

XAML代码

<StackPanel><TextBox Name="tb" Width="180" Height="30"></TextBox><ListBox Name="lb" Width="140" SelectionChanged="PrintText" SelectionMode="Single" Margin="10"><ListBoxItem>Item 1</ListBoxItem><ListBoxItem>Item 2</ListBoxItem><ListBoxItem>Item 3</ListBoxItem><ListBoxItem>Item 4</ListBoxItem><ListBoxItem>Item 5</ListBoxItem><ListBoxItem>Item 6</ListBoxItem><ListBoxItem>Item 7</ListBoxItem><ListBoxItem>Item 8</ListBoxItem><ListBoxItem>Item 9</ListBoxItem><ListBoxItem>Item 10</ListBoxItem></ListBox>
</StackPanel>

后端代码

private void PrintText(object sender, SelectionChangedEventArgs e)
{ListBoxItem lbi = ((sender as ListBox).SelectedItem as ListBoxItem);tb.Text = "   You selected " + lbi.Content.ToString() + ".";
}

**************************************************************************************************************

4、效果图

**************************************************************************************************************

5、自定义样式

<Style x:Key="listBoxItemStyle" TargetType="{x:Type ListBoxItem}"><Setter Property="Template"><Setter.Value><ControlTemplate TargetType="{x:Type ListBoxItem}"><Border  x:Name="IconBorder" Background="#555a64" CornerRadius="4" BorderThickness="0" Margin="5 5"><ContentPresenter /></Border><ControlTemplate.Triggers><Trigger Property="IsSelected" Value="true"><Setter TargetName="IconBorder" Property="BitmapEffect"><Setter.Value><OuterGlowBitmapEffect GlowColor="Transparent" GlowSize="5" /></Setter.Value></Setter></Trigger></ControlTemplate.Triggers></ControlTemplate></Setter.Value></Setter>
</Style>

<ListBox x:Name="MyListBox" Background="#2d323c" Width="200" Margin="20" ItemContainerStyle="{StaticResource listBoxItemStyle}" FocusVisualStyle="{x:Null}" ItemsSource="{Binding ListBoxDatas}"><ListBox.Template><ControlTemplate><StackPanel Background="White" IsItemsHost="True"></StackPanel></ControlTemplate></ListBox.Template><ListBox.ItemTemplate><DataTemplate><StackPanel Orientation="Horizontal" HorizontalAlignment="Left"><CheckBox IsChecked="{Binding IsChecked}" Height="20" Width="20"  VerticalAlignment="Center" Margin="10,5"/><Ellipse Height="14" Width="14" Fill="{Binding Color}"  VerticalAlignment="Center" Margin="5"/><TextBlock Text="{Binding NameText}" VerticalAlignment="Center" Margin="5" FontSize="16"/></StackPanel></DataTemplate></ListBox.ItemTemplate>
</ListBox>

public partial class MainWindow : Window, System.ComponentModel.INotifyPropertyChanged
{public MainWindow(){InitializeComponent();this.DataContext = this;ListBoxDatas.Add(new ListBoxData() { Color = Brushes.Red, IsChecked = false, NameText = "张涛涛1" });ListBoxDatas.Add(new ListBoxData() { Color = Brushes.Green, IsChecked = true, NameText = "张涛涛2" });ListBoxDatas.Add(new ListBoxData() { Color = Brushes.Blue, IsChecked = false, NameText = "张涛涛3" });ListBoxDatas.Add(new ListBoxData() { Color = Brushes.Orange, IsChecked = true, NameText = "张涛涛4" });ListBoxDatas.Add(new ListBoxData() { Color = Brushes.Yellow, IsChecked = false, NameText = "张涛涛5" });ListBoxDatas.Add(new ListBoxData() { Color = Brushes.YellowGreen, IsChecked = true, NameText = "张涛涛6" });}private List<ListBoxData>listBoxDatas = new List<ListBoxData>();public List<ListBoxData> ListBoxDatas{get { return listBoxDatas; }set { listBoxDatas = value; OnPropertyChanged("ListBoxDatas"); }}public event System.ComponentModel.PropertyChangedEventHandler PropertyChanged;protected void OnPropertyChanged(string propertyName){if (PropertyChanged != null){PropertyChanged(this, new System.ComponentModel.PropertyChangedEventArgs(propertyName));}}
}public class ListBoxData
{public bool IsChecked { get; set; }public Brush Color { get; set; }public string NameText { get; set; }
}

**************************************************************************************************************

效果图

通过Template改变列表的布局，如使用WrapPanel进行布局；或者ItemsPanel也可

<ListBox.Template><ControlTemplate><WrapPanel  Background="#2d323c" IsItemsHost="True"/></ControlTemplate>
</ListBox.Template>

效果图

**************************************************************************************************************

6、总结和扩展

IsItemsHost=true表示子元素将显示在此容器中。

第5点，演示了自定义的样式和Data绑定功能。

该 SelectionMode 属性确定用户可以一次选择的项数。可以将属性设置为 Single (默认) ， Multiple或 Extended。下表描述了这些枚举值的行为。
       Single：用户一次只能选择一项。
       Multiple：用户可以选择多个项而无需按下修改键。
       Extended：用户可以通过按住 Ctrl 键并单击项来选择多个连续项，同时按住 SHIFT 键或非连续项。

**************************************************************************************************************

WPF 控件专题 ListBox 控件详解相关推荐

2021-08-08 WPF控件专题 ListBox控件详解
1.ListBox控件介绍其中包含可选择的项的列表手动添加项绑定数据源两个ListBox中的项相互移动,不太适合指定ItemsSource,Items.Add方式添加项,可以灵活的添加或移除 ...
2021-08-14 WPF控件专题 ListBox控件详解
1.ListBox控件介绍其中包含可选择的项的列表手动添加项绑定数据源两个ListBox中的项相互移动,不太适合指定ItemsSource,Items.Add方式添加项,可以灵活的添加或移除 ...
C# 在DataGridView中，点击单元格调出 TreeView控件或 ListBox控件
1.调出 TreeView控件或 ListBox控件 private void deductGrid1_CellClick(object sender, DataGridViewCellEvent ...
DevExpress控件GridControl中的布局详解【转】
DevExpress控件GridControl中的布局详解 [转] 2012-10-24 13:27:28| 分类: devexpress | 标签:devexpress |举报|字号订阅 h ...
扩展DropDownList控件和ListBox控件(1) - 支持分组功能(optgroup标签)
介绍扩展DropDownList控件和ListBox控件: 通过DropDownList控件和ListBox控件的.Items.Add(ListItem item)方法,来为其添加optgroup标 ...
利用Animation控件制作帧动画过程详解
利用Animation控件制作帧动画过程详解前言通过Animation控件来达到序列图的播放(素材和示例视频在文章末尾) 一.序列图 (此素材为已经分割好的序列图) 如若序列图在一张图片上,请参考 ...
wpf 客户端【JDAgent桌面助手】详解（二）桌面宠物制作详解
目录区域: 业余开发的wpf 客户端终于完工了..晒晒截图(此文由于当时没有开通csdn博客所以在博客园发了,后续文章都是csdn 首发奥) [晒视频了]业余开发wpf 客户端[JDAgent桌面助 ...
【卷积神经网络结构专题】一文详解AlexNet(附代码实现)
关注上方"深度学习技术前沿",选择"星标公众号", 资源干货,第一时间送达! [导读]本文是卷积神经网络结构系列专题第二篇文章,前面我们已经介绍了第一个真正意义 ...
WPF 控件专题 Image控件详解
1.Image 介绍 Image:表示用于显示图像的控件. Image可以加载以下图像类型:.bmp..gif..ico..jpg..png..wdp 和 .tiff.但是在显示多帧图像时,仅显示第一 ...

WPF 控件专题 ListBox 控件详解

WPF 控件专题 ListBox 控件详解相关推荐

最新文章

热门文章