WPF 控件

            <div id="content_views" class="htmledit_views"><p id="main-toc"><strong>目录</strong></p> 

WPF基础控件

按钮控件：

Button:按钮

RepeatButton:长按按钮

RadioButton:单选按钮

数据显示控件

TextBox:输入框

RichTextBox:富文本

CheckBox:复选框

ComboBox:下拉框

DataPicker:日期选择器

PasswordBox:密码框

Slider:滑块

ProgressBar:进度条

TextBlock：只读文本控件

Lable：标签 显示文本控件

ListBox：显示可选择项的列表

DataGrid：数据表格控件

ListView：显示列表数据

Image：图片

ToggleButton：切换状态按钮控件

菜单导航控件

MenuItem:菜单

ContextMenu:上下文菜单

ToolBar:创建工具栏

TreeView:树状视图

TabControl:选项卡

Expander:折叠控件

信息提示控件

Popup:弹出式窗口

Window:窗口

PrintDialog:打印窗口

ToolTip:悬停时提示按钮

布局控件

Grid：网格

StackPanel：堆栈面板

DockPanel：停靠面板

WrapPanel：自动换行面板

Canvas：画布

UniformGrid：均匀网格

GridSplitter：网格分割器

TabPanel：选项卡面板

图形控件

Line:线

Rectangle:矩形

Ellipse:圆

Polyline:点的集合

Polygon:点的集合 封闭

Path:path图形

其他控件

ScrollViewer:滚动容器

GroupBox:分组容器

ViewBox:显示盒子

扩展：WPF继承树

---

WPF基础控件

控件类型	主要控件
按钮控件	Button、RepeatButton、RadioButton
数据显示控件	TextBlock、Lable、Image、ItemsControl、ListView、ListBox、DataGrid、DocumentViwer
输入控件	TextBox、RichTextBox、CheckBox、comboBox、DataPicker、PasswordBox、Slider、ProgressBar
菜单导航控件	MenuItem、ContextMenu、ToolBar、TreeView、TabControl、Expander
信息提示控件	Popup、Window、PrintDialog、ToolTip
布局控件	Grid、StackPanel、WrapPanel、DockPanel、UniformGrid、Canvas、InkCanvas、Border
图形控件	Line、Rectangle、Ellipse、Polyline、Polygon、Path
其他控件	ScrollViewer、GroupBox、ViewBox

按钮控件：

Button:按钮

<Button Content="按钮" Width="100" Height="50" Click="Button_Click"/>

常用属性：

• Content: 按钮显示的内容。
• Width: 按钮的宽度。
• Height: 按钮的高度。

常用事件：

• Click: 当用户单击按钮时触发的事件。

RepeatButton:长按按钮

<RepeatButton Content="RepeatButton" Width="100" Height="50" 
Click="RepeatButton_Click" Interval="500"/>

常用属性：

• Content: RepeatButton 显示的内容。
• Width: RepeatButton 的宽度。
• Height: RepeatButton 的高度。
• Interval: 重复触发事件之间的时间间隔（以毫秒为单位）。

常用事件：

• Click: 当用户单击按钮时触发的事件。

在这个示例中，当用户点击按钮时，会触发名为 RepeatButton_Click 的事件处理程序。Interval 属性设置了事件重复触发之间的间隔时间（500 毫秒）。

注意：RepeatButton 是一个特殊的按钮，当用户按住它时，会不断触发 Click 事件，直到按钮被释放。

RadioButton:单选按钮

<StackPanel>
    <RadioButton Content="RadioButton1" GroupName="Options" Checked="RadioButton_Checked"/>
    <RadioButton Content="RadioButton2" GroupName="Options" Checked="RadioButton_Checked"/>
    <RadioButton Content="RadioButton3" GroupName="Options" Checked="RadioButton_Checked"/>
</StackPanel>

private void RadioButton_Checked(object sender, RoutedEventArgs e)
{
RadioButton radioButton = (RadioButton)sender;
MessageBox.Show(radioButton.Content.ToString());
}

常用属性：

• Content: RadioButton 显示的内容。
• GroupName: 组名，确保同一组内的 RadioButton 互斥。
• IsChecked: 是否选中。
• IsEnabled: 是否启用。
• HorizontalAlignment: 水平对齐方式。
• VerticalAlignment: 垂直对齐方式。

常用事件：

• Checked: 当 RadioButton 被选中时触发的事件。
• Unchecked: 当 RadioButton 被取消选中时触发的事件。

数据显示控件

TextBox:输入框

<TextBox  Name="textBox" Width="200" Height="30" 
TextChanged="TextBox_TextChanged" KeyDown="TextBox_KeyDown" 
LostFocus="TextBox_LostFocus"/>

常用属性：

• Text: 获取或设置 TextBox 中的文本内容。
• MaxLength: 指定 TextBox 中允许输入的最大字符数。
• IsReadOnly: 指示 TextBox 是否为只读。
• AcceptsReturn: 指示 TextBox 是否接受回车键输入（多行文本输入）。
• AcceptsTab: 指示 TextBox 是否接受 Tab 键输入。
• HorizontalScrollBarVisibility: 设置水平滚动条的可见性（Disabled, Auto, Hidden, Visible）。
• VerticalScrollBarVisibility: 设置垂直滚动条的可见性（Disabled, Auto, Hidden, Visible）。
• TextWrapping: 指示是否自动换行（NoWrap, Wrap, WrapWithOverflow）。
• PlaceholderText: 获取或设置在 TextBox 中未输入文本时显示的占位符文本（如果使用 WPF 早期版本可能需要自定义）。
• CaretIndex: 获取或设置插入符号的位置。

常用事件：

• TextChanged: 当 TextBox 中的文本内容发生变化时触发的事件。
• KeyDown: 当按键按下时触发的事件。
• KeyUp: 当按键释放时触发的事件。
• LostFocus: 当 TextBox 失去焦点时触发的事件。
• GotFocus: 当 TextBox 获得焦点时触发的事件。

TextChanged 事件处理程序

private void TextBox_TextChanged(object sender, TextChangedEventArgs e)
{
TextBox textBox = sender as TextBox;
    // 处理文本变化事件的代码
MessageBox.Show("Text changed: " + textBox.Text);
}

KeyDown 事件处理程序

private void TextBox_KeyDown(object sender, KeyEventArgs e)
{
    if (e.Key == Key.Enter)
{
        // 处理回车键按下的事件
MessageBox.Show("Enter key pressed");
}
}

LostFocus 事件处理程序

private void TextBox_LostFocus(object sender, RoutedEventArgs e)
{
TextBox textBox = sender as TextBox;
    // 处理失去焦点事件的代码
MessageBox.Show("TextBox lost focus");
}

RichTextBox:富文本

<RichTextBox Name="richTextBox" Width="300" Height="200" 
TextChanged="RichTextBox_TextChanged" 
SelectionChanged="RichTextBox_SelectionChanged" />

常用属性：

• Document: 获取或设置 RichTextBox 显示的 FlowDocument。
• IsReadOnly: 指示 RichTextBox 是否为只读。
• CaretPosition: 获取或设置插入符号的位置。
• Selection: 获取当前选定的内容。
• HorizontalScrollBarVisibility: 设置水平滚动条的可见性（Disabled, Auto, Hidden, Visible）。
• VerticalScrollBarVisibility: 设置垂直滚动条的可见性（Disabled, Auto, Hidden, Visible）。
• AcceptsReturn: 指示是否接受回车键输入。
• AcceptsTab: 指示是否接受 Tab 键输入。

常用事件：

• TextChanged: 当 RichTextBox 中的文本内容发生变化时触发的事件。
• SelectionChanged: 当 RichTextBox 中的文本选择发生变化时触发的事件。
• GotFocus: 当 RichTextBox 获得焦点时触发的事件。
• LostFocus: 当 RichTextBox 失去焦点时触发的事件.

TextChanged 事件处理程序

private void RichTextBox_TextChanged(object sender, TextChangedEventArgs e)
{
RichTextBox richTextBox = sender as RichTextBox;
    // 处理文本变化事件的代码
MessageBox.Show("Text changed in RichTextBox");
}

SelectionChanged 事件处理程序

private void RichTextBox_SelectionChanged(object sender, RoutedEventArgs e)
{
RichTextBox richTextBox = sender as RichTextBox;
    // 处理选择变化事件的代码
MessageBox.Show("Selection changed in RichTextBox");
}

使用 XAML 设置初始内容

<RichTextBox Name="richTextBox" Width="300" Height="200" 
TextChanged="RichTextBox_TextChanged" 
SelectionChanged="RichTextBox_SelectionChanged" >
  <RichTextBox.Document>
    <FlowDocument>
      <Paragraph>
        <Run Text="测试" Foreground="Red"></Run>
        <Run Text="开发" Foreground="Blue"></Run>
      </Paragraph>
    </FlowDocument>
  </RichTextBox.Document>
</RichTextBox>

使用C#代码设置初始内容

private void initRichTextBox()
{
Paragraph paragraph = new Paragraph();
    Run run = new Run();
    run.Text = "Hello World";
    run.Foreground = new SolidColorBrush(Colors.Orange);
paragraph.Inlines.Add(run);
FlowDocument flowDocument = new FlowDocument(paragraph);
richTextBox.Document = flowDocument;
}

CheckBox:复选框

<CheckBox Name="checkBox" Content="Check me" IsChecked="False" 
HorizontalAlignment="Center" VerticalAlignment="Center"
Checked="CheckBox_Checked" Unchecked="CheckBox_Unchecked"/>

常用属性：

• Content: CheckBox 显示的内容。
• IsChecked: 获取或设置 CheckBox 是否选中（可以是 True, False, 或 null 表示未确定状态）。
• IsThreeState: 指示 CheckBox 是否支持三态（选中、未选中、未确定）。
• IsEnabled: 指示 CheckBox 是否启用。
• HorizontalAlignment: 水平对齐方式。
• VerticalAlignment: 垂直对齐方式。

常用事件：

• Checked: 当 CheckBox 被选中时触发的事件。
• Unchecked: 当 CheckBox 被取消选中时触发的事件。
• Indeterminate: 当 CheckBox 进入未确定状态时触发的事件。

Checked 事件处理程序

private void CheckBox_Checked(object sender, RoutedEventArgs e)
{
    // 处理 CheckBox 选中事件的代码
MessageBox.Show("CheckBox is checked.");
}

Unchecked 事件处理程序

private void CheckBox_Unchecked(object sender, RoutedEventArgs e)
{
    // 处理 CheckBox 取消选中事件的代码
MessageBox.Show("CheckBox is unchecked.");
}

Indeterminate 事件处理程序（如果 IsThreeState 为 true）

private void CheckBox_Indeterminate(object sender, RoutedEventArgs e)
{
    // 处理 CheckBox 未确定状态事件的代码 半选中状态
MessageBox.Show("CheckBox is indeterminate.");
}

ComboBox:下拉框

<ComboBox Name="comboBox" Width="200" Height="30" 
SelectionChanged="ComboBox_SelectionChanged">
    <ComboBoxItem Content="Item 1"/>
    <ComboBoxItem Content="Item 2"/>
    <ComboBoxItem Content="Item 3"/>
</ComboBox>

常用属性：

• ItemsSource: 获取或设置用于填充 ComboBox 的数据源。
• SelectedItem: 获取或设置 ComboBox 中当前选定的项。
• SelectedIndex: 获取或设置 ComboBox 中当前选定项的索引。
• IsEditable: 指示 ComboBox 是否可编辑。
• Text: 获取或设置 ComboBox 中当前选定项的文本。
• DisplayMemberPath: 获取或设置显示项的属性路径。如果是ItemsSource传值，就显示的字段名
• SelectedValuePath: 获取或设置选定项的值路径。
• IsDropDownOpen: 获取或设置下拉部分是否已打开。
• MaxDropDownHeight: 获取或设置下拉部分的最大高度。

常用事件：

• SelectionChanged: 当 ComboBox 中选定项发生变化时触发的事件。
• DropDownOpened: 当下拉部分打开时触发的事件。
• DropDownClosed: 当下拉部分关闭时触发的事件.

SelectionChanged 事件处理程序

private void ComboBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
MessageBox.Show(comboBox.SelectedIndex+"");
}

数据绑定示例

....
List<ComboxItem> itemList = new List<ComboxItem>
{
new ComboxItem { Name = "张三", Id = "1" },
new ComboxItem { Name = "李四", Id = "2" },
new ComboxItem { Name = "王二", Id = "3" }
};
comboBox.ItemsSource = itemList;
.....
 class ComboxItem
{
public string Name { get; set; }
public string Id { get; set; }
}

 <ComboBox Name="comboBox" Width="200" Height="30" 
SelectionChanged="ComboBox_SelectionChanged"
DisplayMemberPath="Name"/>

DataPicker:日期选择器

<DatePicker Name="datePicker" Width="200" 
SelectedDateChanged="DatePicker_SelectedDateChanged" />

常用属性：

• SelectedDate: 获取或设置 DatePicker 中当前选定的日期。
• DisplayDate: 获取或设置在日历中显示的日期。
• FirstDayOfWeek: 获取或设置 DatePicker 中每周的第一天。
• IsDropDownOpen: 获取或设置下拉部分是否已打开。
• DisplayDateStart: 获取或设置日历中可选日期范围的开始日期。
• DisplayDateEnd: 获取或设置日历中可选日期范围的结束日期。
• IsTodayHighlighted: 获取或设置是否高亮显示今天的日期。
• SelectedDateFormat: 获取或设置 DatePicker 显示日期的格式（Short 或 Long）。

常用事件：

• SelectedDateChanged: 当 DatePicker 中选定日期发生变化时触发的事件。
• CalendarOpened: 当日历部分打开时触发的事件。
• CalendarClosed: 当日历部分关闭时触发的事件。

SelectedDateChanged 事件处理程序

 private void DatePicker_SelectedDateChanged(object sender, SelectionChangedEventArgs e)
{
MessageBox.Show(datePicker.Text);
}

PasswordBox:密码框

<PasswordBox Name="passwordBox" Width="200" PasswordChanged="PasswordBox_PasswordChanged"/>

常用属性：

• Password: 获取或设置密码框中的密码字符串。
• MaxLength: 获取或设置密码框中可以输入的最大字符数。
• IsEnabled: 指示 PasswordBox 是否启用。
• IsReadOnly: 指示 PasswordBox 是否为只读（通常不常用在 PasswordBox 上）。
• HorizontalAlignment: 水平对齐方式。
• VerticalAlignment: 垂直对齐方式。
• PasswordChar:密码不可见样式

常用事件：

• PasswordChanged: 当密码框中的内容发生变化时触发的事件。

PasswordChanged 事件处理程序

private void PasswordBox_PasswordChanged(object sender, RoutedEventArgs e)
{
MessageBox.Show(passwordBox.Password);
}

Slider:滑块

<Slider Name="slider" Width="200" Height="30" 
Minimum="0" Maximum="100" Value="50" 
TickFrequency="10" IsSnapToTickEnabled="True" 
ValueChanged="Slider_ValueChanged"/>

常用属性：

• Minimum 和 Maximum：定义了滑块的最小值和最大值，用户只能在这个范围内滑动。
• Value：滑块当前的值，用户移动滑块时这个值会更新。
• TickFrequency：设置滑块刻度之间的间隔，例如每隔多少单位显示一个刻度。
• IsSnapToTickEnabled：如果设置为 True，滑块的值会自动捕捉到最近的刻度。
• Orientation：可以设置为 Horizontal 或 Vertical，决定滑块是水平还是垂直。
• IsMoveToPointEnabled：如果设置为 True，用户点击滑块轨道的某个位置时滑块会移动到该位置。
• TickPlacement：决定刻度线的位置，可以设置为 None、TopLeft、BottomRight 或 Both。
• LargeChange 和 SmallChange：定义了滑块在按下 Page Up/Page Down 或方向键时的移动步长。

常用事件：

• ValueChanged: 当 Slider 的值发生变化时触发的事件。

ValueChanged 事件处理程序

private void Slider_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
{
MessageBox.Show(slider.Value+"");
}

ProgressBar:进度条

<ProgressBar Name="progressBar" Width="200" Height="30" Minimum="0" 
Maximum="100" Value="50" 
ValueChanged="progressBar_ValueChanged"/>

常用属性：

• Minimum 和 Maximum：定义了进度条的最小值和最大值，用户只能在这个范围内设置值。
• Value：进度条当前的值，可以程序matically 更新以显示进度。
• IsIndeterminate：如果设置为 True，进度条进入不确定模式，表示正在进行无法预估时间的操作。来回流动
• Orientation：可以设置为 Horizontal 或 Vertical，决定进度条的方向。
• Foreground：设置进度条的前景色，即表示进度的颜色。
• ValueChanged：当进度条的值发生变化时触发，可以用于实时更新 UI 或进行其他操作。

常用事件：

• ValueChanged: 当 ProgressBar 的值发生变化时触发的事件。

ValueChanged 事件处理程序

 private void progressBar_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
{
MessageBox.Show(progressBar.Value+"");
}

TextBlock：只读文本控件

<TextBox Width="200" Height="30" Text="Enter text here"/>

常用属性

• Text: 设置或获取 TextBlock 中显示的文本内容。
• Foreground: 设置或获取 TextBlock 文本的前景色。
• Background: 设置或获取 TextBlock 文本的背景色。
• FontSize: 设置或获取 TextBlock 文本的字体大小。
• FontFamily: 设置或获取 TextBlock 文本的字体族。
• FontWeight: 设置或获取 TextBlock 文本的字体粗细（例如，Normal、Bold）。
• FontStyle: 设置或获取 TextBlock 文本的字体样式（例如，Normal、Italic）。
• TextWrapping: 设置或获取 TextBlock 文本的换行方式（例如，NoWrap、Wrap、WrapWithOverflow）。
• TextAlignment: 设置或获取 TextBlock 文本的对齐方式（例如，Left、Center、Right、Justify）。
• TextDecorations: 设置或获取 TextBlock 文本的装饰（例如，下划线、删除线）。
• Padding: 设置或获取 TextBlock 的内部间距。

常用事件

TextBlock 本身是一个显示控件，因此它没有输入事件。但是，它继承自 FrameworkElement，因此可以处理一些基本的事件，例如：

• MouseLeftButtonDown: 处理鼠标左键按下事件。
• MouseLeftButtonUp: 处理鼠标左键抬起事件。
• MouseEnter: 处理鼠标进入控件事件。
• MouseLeave: 处理鼠标离开控件事件。

Lable：标签 显示文本控件

<Label Content="Username:"/>
<TextBox Width="200" Height="30" Margin="0,5"/>
<Label Content="Password:"/>
<PasswordBox Width="200" Height="30" Margin="0,5"/>
<Button Content="Login" Width="100" Height="30" Margin="0,10"/>

常用属性

• Content: 设置或获取 Label 中显示的文本内容。
• Target: 设置或获取 Label 关联的目标控件，用于指示 Label 的用途。

Target用法

<Grid Margin="10">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>
 
    <Label Content="_Username:" Target="{Binding ElementName=usernameTextBox}" 
VerticalAlignment="Center"/>
    <TextBox x:Name="usernameTextBox" Grid.Column="1" Width="200" 
Height="30" Margin="5"/>
 
    <Label Content="_Password:" Target="{Binding ElementName=passwordBox}" 
Grid.Row="1" VerticalAlignment="Center"/>
    <PasswordBox x:Name="passwordBox" Grid.Column="1" Grid.Row="1" Width="200"
Height="30" Margin="5"/>
</Grid>

• Label 的 Content 属性包含一个下划线字符 (_) ，表示下一个字符是加速键。例如，_Username: 表示 U 是加速键。
• Target 属性绑定到目标控件的名称（使用 {Binding ElementName=...}），当用户按下 Alt 键并激活加速键时，焦点会自动移动到目标控件。
• x:Name 属性用于给控件命名，以便在 Binding 表达式中引用它们。
• 按 Alt+U 会将焦点移动到用户名输入框（TextBox）。
• 按 Alt+P 会将焦点移动到密码输入框（PasswordBox）。

ListBox：显示可选择项的列表

 <ListBox Width="200" Height="100">
      <ListBoxItem>Item 1</ListBoxItem>
      <ListBoxItem>Item 2</ListBoxItem>
      <ListBoxItem>Item 3</ListBoxItem>
</ListBox>

常用属性

• ItemsSource: 设置或获取 ListBox 的数据源。
• SelectedItem: 获取或设置当前选定的项目。
• SelectedIndex: 获取或设置当前选定项目的索引。
• SelectionMode: 设置 ListBox 的选择模式。可以是 Single（单选），Multiple（多选），或 Extended（扩展选择）。
• ItemTemplate: 定义如何显示 ListBox 中的每个项目。

常用事件

• SelectionChanged: 当选择的项目发生更改时触发。

 <ListBox x:Name="myListBox" Width="200" Height="100" 
SelectionChanged="ListBox_SelectionChanged">
    <ListBoxItem Content="Item 1"/>
    <ListBoxItem Content="Item 2"/>
    <ListBoxItem Content="Item 3"/>
</ListBox>

private void ListBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
ListBox listBox = sender as ListBox;
ListBoxItem selectedItem = listBox.SelectedItem as ListBoxItem;
    if (selectedItem != null)
{
MessageBox.Show("Selected item: " + selectedItem.Content.ToString());
}
}

<ListBox x:Name="myListBox" Width="200" Height="100" 
SelectionChanged="ListBox_SelectionChanged">
    <ListBox.ItemTemplate>
        <DataTemplate>
            <StackPanel Orientation="Horizontal">
                <TextBlock Text="{Binding Name}" Width="100"/>
                <TextBlock Text="{Binding Age}" Width="50"/>
            </StackPanel>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
 
List<Person> people = new List<Person>
{
new Person { Name = "Alice", Age = 30 },
new Person { Name = "Bob", Age = 25 },
new Person { Name = "Charlie", Age = 35 }
};
 
myListBox.ItemsSource = people;
}
 
private void ListBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
ListBox listBox = sender as ListBox;
Person selectedPerson = listBox.SelectedItem as Person;
        if (selectedPerson != null)
{
MessageBox.Show("Selected person: " + selectedPerson.Name + ", Age: " 
                            + selectedPerson.Age);
}
}
}
 
public class Person
{
public string Name { get; set; }
public int Age { get; set; }
}

• ItemsSource: 通过绑定数据源（例如，List<Person>）来填充 ListBox。
• ItemTemplate: 使用 DataTemplate 定义每个项目的显示方式。
• SelectionChanged 事件: 当用户选择项目时，显示所选项目的信息。

DataGrid：数据表格控件

 <DataGrid x:Name="dataGrid" AutoGenerateColumns="True" Margin="10"/>

……
List<Person> people = new List<Person>
{
new Person { Name = "Alice", Age = 30, Email = "[e-mail]" },
new Person { Name = "Bob", Age = 25, Email = "[e-mail]" },
new Person { Name = "Charlie", Age = 35, Email = "[e-mail]" }
};
 
dataGrid.ItemsSource = people;
……
public class Person
{
public string Name { get; set; }
public int Age { get; set; }
public string Email { get; set; }
}

常用属性

• ItemsSource: 设置或获取 DataGrid 的数据源。
• AutoGenerateColumns: 设置为 True 时，自动生成列；设置为 False 时，需要手动定义列。
• Columns: 定义 DataGrid 中的列集合。
• SelectionMode: 设置选择模式，单选或多选。
• CanUserAddRows: 设置用户是否可以添加新行。
• CanUserDeleteRows: 设置用户是否可以删除行。
• CanUserSortColumns: 设置用户是否可以排序列。

常用事件

• SelectionChanged: 当选择的项目发生更改时触发。
• CellEditEnding: 当单元格编辑即将结束时触发。
• RowEditEnding: 当行编辑即将结束时触发。
• LoadingRow: 当行加载时触发。

自定义列

 <Grid>
    <DataGrid x:Name="dataGrid" AutoGenerateColumns="False" Margin="10" 
SelectionChanged="DataGrid_SelectionChanged">
        <DataGrid.Columns>
            <DataGridTextColumn Header="Name" Binding="{Binding Name}" Width="*"/>
            <DataGridTextColumn Header="Age" Binding="{Binding Age}" Width="*"/>
            <DataGridTextColumn Header="Email" Binding="{Binding Email}" Width="*"/>
        </DataGrid.Columns>
    </DataGrid>
</Grid>

……
List<Person> people = new List<Person>
{
new Person { Name = "Alice", Age = 30, Email = "[e-mail]" },
new Person { Name = "Bob", Age = 25, Email = "[e-mail]" },
new Person { Name = "Charlie", Age = 35, Email = "[e-mail]" }
};
 
dataGrid.ItemsSource = people;
……
private void DataGrid_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
DataGrid dataGrid = sender as DataGrid;
Person selectedPerson = dataGrid.SelectedItem as Person;
    if (selectedPerson != null)
{
MessageBox.Show("Selected person: " + selectedPerson.Name);
}
}
……
public class Person
{
public string Name { get; set; }
public int Age { get; set; }
public string Email { get; set; }
}

• AutoGenerateColumns: 设置为 False，这样可以自定义列。
• DataGridTextColumn: 用于显示文本数据的列，Header 属性设置列标题，Binding 属性绑定到数据源中的相应属性。
• SelectionChanged 事件: 当选择的项目发生更改时，显示所选项目的信息。

编辑功能

<DataGrid x:Name="dataGrid" AutoGenerateColumns="False" Margin="10" 
CanUserAddRows="True" CanUserDeleteRows="True" 
CanUserSortColumns="True">
    <DataGrid.Columns>
        <DataGridTextColumn Header="Name" Binding="{Binding Name}" Width="*"/>
        <DataGridTextColumn Header="Age" Binding="{Binding Age}" Width="*"/>
        <DataGridTextColumn Header="Email" Binding="{Binding Email}" Width="*"/>
    </DataGrid.Columns>
</DataGrid>

……
List<Person> people = new List<Person>
{
new Person { Name = "Alice", Age = 30, Email = "[e-mail]" },
new Person { Name = "Bob", Age = 25, Email = "[e-mail]" },
new Person { Name = "Charlie", Age = 35, Email = "[e-mail]" }
};
 
dataGrid.ItemsSource = people;
……
public class Person
{
public string Name { get; set; }
public int Age { get; set; }
public string Email { get; set; }
}

ListView：显示列表数据

 <ListView x:Name="listView" Width="350" Height="250">
    <ListView.View>
        <GridView>
            <GridViewColumn Header="Name" DisplayMemberBinding="{Binding Name}" 
Width="120"/>
            <GridViewColumn Header="Age" DisplayMemberBinding="{Binding Age}" 
Width="50"/>
            <GridViewColumn Header="Email" DisplayMemberBinding="{Binding Email}"
Width="150"/>
        </GridView>
    </ListView.View>
</ListView>

List<Person> people = new List<Person>
{
new Person { Name = "Alice", Age = 30, Email = "[e-mail]" },
new Person { Name = "Bob", Age = 25, Email = "[e-mail]" },
new Person { Name = "Charlie", Age = 35, Email = "[e-mail]" 
}
};
 
listView.ItemsSource = people;

常用属性

• ItemsSource: 设置或获取 ListView 的数据源。
• View: 定义 ListView 的显示模式，可以是 GridView、TileView 等。
• SelectedItem: 获取或设置当前选定的项目。
• SelectedIndex: 获取或设置当前选定项目的索引。
• SelectionMode: 设置选择模式，单选或多选。

常用事件

• SelectionChanged: 当选择的项目发生更改时触发。

详细视图

<ListView x:Name="listView" Width="350" Height="250" SelectionChanged="ListView_SelectionChanged">
    <ListView.View>
        <GridView>
            <GridViewColumn Header="Name" DisplayMemberBinding="{Binding Name}"
Width="120"/>
            <GridViewColumn Header="Age" DisplayMemberBinding="{Binding Age}" 
Width="50"/>
            <GridViewColumn Header="Email" DisplayMemberBinding="{Binding Email}"
Width="150"/>
        </GridView>
    </ListView.View>
</ListView>

public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
 
List<Person> people = new List<Person>
{
new Person { Name = "Alice", Age = 30, Email = "[e-mail]" },
new Person { Name = "Bob", Age = 25, Email = "[e-mail]" },
new Person { Name = "Charlie", Age = 35, Email = "[e-mail]" }
};
 
listView.ItemsSource = people;
}
 
private void ListView_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
ListView listView = sender as ListView;
Person selectedPerson = listView.SelectedItem as Person;
        if (selectedPerson != null)
{
MessageBox.Show("Selected person: " + selectedPerson.Name);
}
}
}
 
public class Person
{
public string Name { get; set; }
public int Age { get; set; }
public string Email { get; set; }
}

自定义项模板

 <ListView x:Name="listView" Width="350" Height="250">
    <ListView.ItemTemplate>
        <DataTemplate>
            <StackPanel Orientation="Horizontal">
                <TextBlock Text="{Binding Name}" Width="120"/>
                <TextBlock Text="{Binding Age}" Width="50"/>
                <TextBlock Text="{Binding Email}" Width="150"/>
            </StackPanel>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
 
List<Person> people = new List<Person>
{
new Person { Name = "Alice", Age = 30, Email = "[e-mail]" },
new Person { Name = "Bob", Age = 25, Email = "[e-mail]" },
new Person { Name = "Charlie", Age = 35, Email = "[e-mail]" }
};
 
listView.ItemsSource = people;
}
}
 
public class Person
{
public string Name { get; set; }
public int Age { get; set; }
public string Email { get; set; }
}

• View: 使用 GridView 来定义详细视图，每个 GridViewColumn 定义一列。
• ItemTemplate: 使用 DataTemplate 定义自定义的项布局。
• SelectionChanged 事件: 当用户选择项目时，显示所选项目的信息。

Image：图片

<Image x:Name="myImage" Source="example.jpg" Width="200" Height="150"
ImageFailed="Image_ImageFailed" ImageOpened="Image_ImageOpened"/>

常用属性

• Source: 设置或获取图像的源路径，可以是相对路径或绝对路径。
• Stretch: 指定如何拉伸图像以适应控件的大小。常用值包括 None、Fill、Uniform、UniformToFill。
• StretchDirection: 指定图像可以拉伸的方向。值可以是 UpOnly、DownOnly 或 Both。
• Width: 设置图像的宽度。
• Height: 设置图像的高度。

private void Image_ImageFailed(object sender, ExceptionRoutedEventArgs e)
{
MessageBox.Show("Image loading failed: " + e.ErrorException.Message);
}
 
private void Image_ImageOpened(object sender, RoutedEventArgs e)
{
MessageBox.Show("Image successfully loaded.");
}

• Source: 通过 BitmapImage 设置图片源，可以指定图片的路径。
• Stretch: 设置图像的拉伸模式，使其在控件中适当显示。
• ImageFailed 事件: 当图像加载失败时，显示错误消息。
• ImageOpened 事件: 当图像成功加载时，显示成功消息。

ToggleButton：切换状态按钮控件

 <ToggleButton x:Name="toggleButton" Content="Toggle Me" Width="100" Height="50" 
IsThreeState="True" Checked="ToggleButton_Checked" 
Unchecked="ToggleButton_Unchecked" 
Indeterminate="ToggleButton_Indeterminate"/>

private void ToggleButton_Checked(object sender, RoutedEventArgs e)
{
MessageBox.Show("ToggleButton is Checked");
}
 
private void ToggleButton_Unchecked(object sender, RoutedEventArgs e)
{
MessageBox.Show("ToggleButton is Unchecked");
}
 
private void ToggleButton_Indeterminate(object sender, RoutedEventArgs e)
{
MessageBox.Show("ToggleButton is Indeterminate");
}

• IsChecked: 使用该属性来确定 ToggleButton 的当前状态。
• IsThreeState: 设置为 True 时，ToggleButton 支持三态（选中、未选中、不确定）。
• Checked、Unchecked、Indeterminate 事件: 处理 ToggleButton 在不同状态下的事件。

常用属性

• IsChecked: 获取或设置 ToggleButton 的状态，true 表示选中，false 表示未选中，null 表示不确定状态。
• Content: 设置或获取 ToggleButton 的内容，可以是文本、图像或其他控件。
• IsThreeState: 设置或获取 ToggleButton 是否支持三态（true 表示支持三态，false 表示只支持两态）。

常用事件

• Checked: 当 ToggleButton 被选中时触发。
• Unchecked: 当 ToggleButton 被取消选中时触发。
• Indeterminate: 当 ToggleButton 处于不确定状态时触发。

菜单导航控件

MenuItem:菜单

<Menu>
    <MenuItem Header="_File">
        <MenuItem Header="_New" Click="NewMenuItem_Click"/>
        <MenuItem Header="_Open" Click="OpenMenuItem_Click"/>
        <MenuItem Header="_Save" Click="SaveMenuItem_Click"/>
        <Separator/>
        <MenuItem Header="_Exit" Click="ExitMenuItem_Click"/>
    </MenuItem>
    <MenuItem Header="_Edit">
        <MenuItem Header="_Cut" Click="CutMenuItem_Click"/>
        <MenuItem Header="_Copy" Click="CopyMenuItem_Click"/>
        <MenuItem Header="_Paste" Click="PasteMenuItem_Click"/>
    </MenuItem>
</Menu>

常用属性：

• Header: 获取或设置显示在 MenuItem 上的文本。第一个加入下划线"_"，表示alt + 快捷方式打开
• Icon: 获取或设置显示在 MenuItem 左侧的图标。
• IsCheckable: 获取或设置 MenuItem 是否可以被选中或取消选中。
• IsChecked: 获取或设置 MenuItem 是否被选中。
• InputGestureText: 获取或设置显示在 MenuItem 右侧的快捷键文本。仅显示提示作用
• Items: 获取此 MenuItem 的子菜单项集合。
• StaysOpenOnClick: 指示点击 MenuItem 后是否保持菜单打开。
• Separator:在菜单中增加一个隔行线

常用事件：

• Click: 当 MenuItem 被点击时触发的事件。
• Checked: 当 MenuItem 被选中时触发的事件（仅当 IsCheckable 为 True 时适用）。
• Unchecked: 当 MenuItem 被取消选中时触发的事件（仅当 IsCheckable 为 True 时适用）。

事件处理程序

private void NewMenuItem_Click(object sender, RoutedEventArgs e)
{
MessageBox.Show("New");
}
 
private void OpenMenuItem_Click(object sender, RoutedEventArgs e)
{
MessageBox.Show("Open");
}
 
private void SaveMenuItem_Click(object sender, RoutedEventArgs e)
{
MessageBox.Show("New");
}
 
private void ExitMenuItem_Click(object sender, RoutedEventArgs e)
{
MessageBox.Show("Exit");
}
 
private void CutMenuItem_Click(object sender, RoutedEventArgs e)
{
MessageBox.Show("Cut");
}
 
private void CopyMenuItem_Click(object sender, RoutedEventArgs e)
{
MessageBox.Show("Copy");
}
 
private void PasteMenuItem_Click(object sender, RoutedEventArgs e)
{
MessageBox.Show("Paste");
}

ContextMenu:上下文菜单

<TextBox x:Name="textBox" Width="200" Height="30" VerticalAlignment="Top" HorizontalAlignment="Center">
    <TextBox.ContextMenu>
        <ContextMenu Opened="ContextMenu_Opened">
            <MenuItem Header="Cut" Click="CutMenuItem_Click"/>
            <MenuItem Header="Copy" Click="CopyMenuItem_Click"/>
            <MenuItem Header="Paste" Click="PasteMenuItem_Click"/>
        </ContextMenu>
    </TextBox.ContextMenu>
</TextBox>
 
<Button x:Name="button" Content="按钮" Width="200" Height="30" 
VerticalAlignment="Top" HorizontalAlignment="Center">
    <Button.ContextMenu>
        <ContextMenu Closed="ContextMenu_Closed">
            <MenuItem Header="Cut" Click="CutMenuItem_Click"/>
            <MenuItem Header="Copy" Click="CopyMenuItem_Click"/>
            <MenuItem Header="Paste" Click="PasteMenuItem_Click"/>
        </ContextMenu>
    </Button.ContextMenu>
</Button>

事件处理程序

private void CutMenuItem_Click(object sender, RoutedEventArgs e)
{
MessageBox.Show("Cut");
}
 
private void CopyMenuItem_Click(object sender, RoutedEventArgs e)
{
MessageBox.Show("Copy");
}
 
private void PasteMenuItem_Click(object sender, RoutedEventArgs e)
{
MessageBox.Show("Paste");
}
private void ContextMenu_Opened(object sender, RoutedEventArgs e)
{
MessageBox.Show("Open");
}
 
private void ContextMenu_Closed(object sender, RoutedEventArgs e)
{
MessageBox.Show("Close");
}

常用属性

• Items: 获取此 ContextMenu 的子菜单项集合。
• IsOpen: 获取或设置 ContextMenu 是否可见。
• PlacementTarget: 获取或设置 ContextMenu 的放置目标对象。
• Placement: 获取或设置 ContextMenu 的放置位置。
• HorizontalOffset: 获取或设置 ContextMenu 相对于 PlacementTarget 水平方向的偏移量。
• VerticalOffset: 获取或设置 ContextMenu 相对于 PlacementTarget 垂直方向的偏移量.

常用事件

• Opened 和 Closed 事件处理程序在 ContextMenu 打开和关闭时显示消息框。

ToolBar:创建工具栏

<DockPanel>
    <!-- ToolBarTray 用于容纳多个 ToolBar -->
    <ToolBarTray DockPanel.Dock="Top">
        <!-- 定义一个 ToolBar -->
        <ToolBar>
            <Button Content="New" Click="NewButton_Click">
                <Button.ToolTip>
                    <ToolTip Content="Create a new file"/>
                </Button.ToolTip>
            </Button>
            <Button Content="Open" Click="OpenButton_Click">
                <Button.ToolTip>
                    <ToolTip Content="Open an existing file"/>
                </Button.ToolTip>
            </Button>
            <Button Content="Save" Click="SaveButton_Click">
                <Button.ToolTip>
                    <ToolTip Content="Save the current file"/>
                </Button.ToolTip>
            </Button>
            <Separator/>
            <ToggleButton Content="Bold" Click="BoldButton_Click">
                <ToggleButton.ToolTip>
                    <ToolTip Content="Toggle bold text"/>
                </ToggleButton.ToolTip>
            </ToggleButton>
            <Separator/>
            <ComboBox Width="100" SelectionChanged="FontComboBox_SelectionChanged">
                <ComboBoxItem Content="Arial"/>
                <ComboBoxItem Content="Calibri"/>
                <ComboBoxItem Content="Times New Roman"/>
            </ComboBox>
        </ToolBar>
    </ToolBarTray>
 
    <!-- 主内容区域 -->
    <TextBox Name="textBox" Margin="10" VerticalScrollBarVisibility="Auto"
AcceptsReturn="True"/>
</DockPanel>

常用属性

• Band: 获取或设置工具栏所在的带的索引（仅用于 ToolBarTray）。
• BandIndex: 获取或设置工具栏在带中的位置索引。
• Orientation: 获取或设置工具栏的布局方向（水平或垂直）。
• ToolBarOverflowPanel: 获取溢出面板，用于在工具栏空间不足时存放多余的控件。
• 使用 Band 和 BandIndex 属性来控制 ToolBar 在 ToolBarTray 中的位置。

常用事件

• Loaded 和 Unloaded 事件处理程序在 ToolBar 加载和卸载时显示消息框。

private void NewButton_Click(object sender, RoutedEventArgs e)
{
textBox.Clear();
}
 
private void OpenButton_Click(object sender, RoutedEventArgs e)
{
MessageBox.Show("Open");
}
 
private void SaveButton_Click(object sender, RoutedEventArgs e)
{
MessageBox.Show("Save");
}
 
private void BoldButton_Click(object sender, RoutedEventArgs e)
{
textBox.FontWeight = FontWeights.Bold;
}
 
private void FontComboBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
ComboBox? comboBox = sender as ComboBox;
    this.textBox.Text += $"\r\n{comboBox.SelectedItem}";
}

TreeView:树状视图

<TreeView x:Name="treeView" SelectedItemChanged="treeView_SelectedItemChanged">
    <TreeViewItem Header="Root">
        <TreeViewItem Header="C-01">
            <TreeViewItem Header="C-01-01" />
            <TreeViewItem Header="C-01-02" />
        </TreeViewItem>
        <TreeViewItem Header="C-02" />
        <TreeViewItem Header="C-03" />
    </TreeViewItem>
</TreeView>

常用属性

• Items: 获取此 TreeViewItem 的子节点集合。
• IsExpanded: 获取或设置是否展开该 TreeViewItem。
• Header: 获取或设置显示在 TreeViewItem 上的文本或内容。
• IsSelected: 获取或设置是否选择该 TreeViewItem。
• Tag: 获取或设置与该 TreeViewItem 关联的对象。

常用事件

• SelectedItemChanged 事件处理程序在选择的项发生变化时显示消息框，显示当前选择的节点的标题。
• Collapsed: 当 TreeViewItem 折叠时触发的事件。
• Expanded: 当 TreeViewItem 展开时触发的事件。

SelectedItemChanged 事件处理程序

private void treeView_SelectedItemChanged(object sender, RoutedPropertyChangedEventArgs<object> e)
{
    MessageBox.Show(((TreeViewItem)treeView.SelectedItem).Header as string);
}

TabControl:选项卡

<TabControl x:Name="tabControl" SelectionChanged="TabControl_SelectionChanged">
    <TabItem Header="Tab01">
        <TextBlock Text="01"/>
    </TabItem>
    <TabItem Header="Tab02">
        <TextBlock Text="02"/>
    </TabItem>
</TabControl>
<TextBlock x:Name="tb" Height="30" Width="100" />

常用属性

• Items: 获取此 TabControl 的选项卡集合。
• SelectedIndex: 获取或设置当前选中的选项卡的索引。
• SelectedItem: 获取或设置当前选中的选项卡。
• TabStripPlacement: 获取或设置选项卡的位置（顶部、底部、左侧或右侧）。
• TabStripPlacement: 获取或设置选项卡标题的对齐方式。

常用事件

• SelectionChanged 事件处理程序在选择的选项卡发生变化时显示消息框，显示当前选择的选项卡的标题。
• PreviewMouseDown: 当用户点击选项卡标题时触发的事件。
• PreviewMouseMove: 当用户移动鼠标到选项卡标题上时触发的事件。

SelectionChanged事件处理程序

private void TabControl_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
TabItem tabItem = (tabControl.SelectedItem) as TabItem;
tb.Text = tabItem.Header.ToString();
}

Expander:折叠控件

<Expander Header="Details" IsExpanded="True" Expanded="Expander_Expanded" 
Collapsed="Expander_Collapsed">
    <TextBlock Text="Expander" />
</Expander>

常用属性

• Header: 获取或设置 Expander 控件的标题。
• IsExpanded: 获取或设置一个值，指示 Expander 控件当前是否处于展开状态。
• Content: 获取或设置 Expander 控件的内容。

常用事件

• Expanded 事件处理程序在 Expander 控件展开时显示消息框。
• Collapsed 事件处理程序在 Expander 控件折叠时显示消息框。

 
private void Expander_Expanded(object sender, RoutedEventArgs e)
{
MessageBox.Show("展开");
}
 
private void Expander_Collapsed(object sender, RoutedEventArgs e)
{
MessageBox.Show("关闭");
}

信息提示控件

Popup:弹出式窗口

<Button Content="按钮" Name="btn" Click="Button_Click_2"/>
<Popup x:Name="popup" PlacementTarget="{Binding ElementName=btn}" Placement="Bottom">
    <TextBlock Text="textBlock" Background="AliceBlue" />
</Popup>

常用属性

• IsOpen: 获取或设置一个值，指示 Popup 是否处于打开状态。
• Placement: 获取或设置 Popup 的位置相对于其放置目标的方式，可以是相对于左上角、右上角、底部等。
• PlacementTarget: 获取或设置 Popup 的放置目标，即触发 Popup 显示的控件。
• Child: 获取或设置 Popup 内容的根元素。

常用事件

• Opened: 当 Popup 打