当前位置: 首页 > news >正文

WPF 控件速查 PDF 笔记(可直接落地版)

目录索引(按首字母排序)

控件名称所属章节页码指引(PDF 锚点)
AccessText高频交互控件第 5 页
Button高频交互控件第 4 页
Calendar高频交互控件第 6 页
Canvas布局控件第 2 页
ComboBox高频交互控件第 5 页
ContextMenu高频交互控件第 6 页
DataGrid数据展示控件第 7 页
DatePicker高频交互控件第 6 页
DockPanel布局控件第 2 页
Ellipse图形控件(附)第 12 页
Expander布局控件第 3 页
FlowDocumentReader文档控件(附)第 12 页
Frame导航控件(附)第 12 页
Grid布局控件第 1 页
GridSplitter布局控件第 3 页
GroupBox布局控件第 3 页
Image媒体控件第 10 页
InkCanvas数字墨迹控件第 11 页
Label高频交互控件第 5 页
ListBox数据展示控件第 8 页
ListView数据展示控件第 9 页
MediaElement媒体控件第 10 页
Menu高频交互控件第 6 页
OpenFileDialog系统对话框第 9 页
PasswordBox高频交互控件第 4 页
PrintDialog系统对话框第 10 页
ProgressBar高频交互控件第 5 页
RepeatButton高频交互控件第 4 页
ResizeGrip布局控件(附)第 12 页
RichTextBox高频交互控件第 4 页
SaveFileDialog系统对话框第 10 页
ScrollBar布局控件(附)第 12 页
ScrollViewer布局控件第 2 页
Separator布局控件(附)第 12 页
Slider高频交互控件第 5 页
SoundPlayerAction媒体控件(附)第 12 页
StackPanel布局控件第 1 页
StatusBar高频交互控件(附)第 12 页
TabControl导航控件(附)第 12 页
TextBox高频交互控件第 4 页
TextBlock高频交互控件第 5 页
Thumb布局控件(附)第 12 页
ToolBar高频交互控件第 6 页
ToolTip高频交互控件第 5 页
TreeView数据展示控件第 9 页
Viewbox布局控件第 3 页
VirtualizingStackPanel布局控件第 3 页
WrapPanel布局控件第 2 页

第一章 布局控件(界面骨架核心)

1.1 Grid(最常用:复杂布局)

  • 核心场景:表单、多区域划分(如 “顶部标题 + 中间内容 + 底部按钮”)

  • 必记属性:

    • RowDefinitions/ColumnDefinitions:行 / 列定义(*表示占剩余空间,Auto自适应)

    • Grid.Row/Grid.Column:子元素指定行 / 列

  • 避坑点:不设置Width/Height时,默认撑满父容器;行 / 列未设置Height/Width时,默认Auto

  • 极简示例(直接复制):

    <Grid Width="400" Height="300"><!-- 2行2列:第1行高50,第2行占剩余;第1列宽100,第2列占剩余 --><Grid.RowDefinitions><RowDefinition Height="50"/><RowDefinition Height="*"/></Grid.RowDefinitions><Grid.ColumnDefinitions><ColumnDefinition Width="100"/><ColumnDefinition Width="*"/></Grid.ColumnDefinitions><!-- 子元素:标题(跨2列)、标签、输入框 --><TextBlock Text="用户表单" Grid.Row="0" Grid.ColumnSpan="2" HorizontalAlignment="Center"/><Label Content="姓名:" Grid.Row="1" Grid.Column="0"/><TextBox Grid.Row="1" Grid.Column="1" Width="200"/>
    </Grid>
  • 实战备注:用Grid.ColumnSpan/Grid.RowSpan实现跨列 / 跨行,适合复杂表单布局

1.2 StackPanel(线性排列)

  • 核心场景:按钮组、简单列表(如 “确定 + 取消” 按钮横向排列)

  • 必记属性:

    • Orientation:排列方向(Horizontal横向 /Vertical纵向,默认纵向)

    • Spacing(.NET 5+):子元素间距(避免用Margin逐个设置)

  • 避坑点:纵向排列时,子元素默认撑满宽度;横向排列时,默认撑满高度

  • 极简示例:

    <!-- 横向按钮组,间距10 -->
    <StackPanel Orientation="Horizontal" Spacing="10" Margin="20"><Button Content="确定" Width="80"/><Button Content="取消" Width="80"/><Button Content="重置" Width="80"/>
    </StackPanel>

1.3 ScrollViewer(滚动容器)

  • 核心场景:内容超出容器(如长文本、多选项列表)

  • 必记属性:

    • VerticalScrollBarVisibility:垂直滚动条(Auto自动显示 /Visible始终显示 /Hidden隐藏)

    • HorizontalScrollBarVisibility:水平滚动条

  • 避坑点:必须设置Width/Height,否则会撑满父容器,滚动条不生效

  • 极简示例:

    <ScrollViewer Width="300" Height="200" VerticalScrollBarVisibility="Auto"><StackPanel><TextBlock Text="第1行内容" Margin="5"/><TextBlock Text="第2行内容" Margin="5"/><TextBlock Text="第3行内容" Margin="5"/><!-- 省略N行... --><TextBlock Text="第20行内容" Margin="5"/></StackPanel>
    </ScrollViewer>

1.4 WrapPanel(自动换行)

  • 核心场景:动态数量元素(如标签云、图片墙)

  • 必记属性:

    • Orientation:排列方向(默认横向,排满换行)

    • ItemWidth/ItemHeight:子元素统一尺寸(避免大小不一)

  • 避坑点:父容器需有固定宽度(横向排列)或高度(纵向排列),否则不会换行

  • 极简示例:

    <!-- 横向排列,子元素宽80,排满换行 -->
    <WrapPanel Width="300" Orientation="Horizontal" ItemWidth="80" Margin="10"><Button Content="标签1"/><Button Content="标签2"/><Button Content="标签3"/><Button Content="标签4"/><Button Content="标签5"/>
    </WrapPanel>

1.5 Canvas(绝对定位)

  • 核心场景:自定义图形、固定位置元素(如仪表盘、流程图)

  • 必记属性:子元素用Canvas.Left/Canvas.Top/Canvas.Right/Canvas.Bottom定位

  • 避坑点:不自动适配父容器大小,分辨率变化时元素位置会偏移,慎用在响应式界面

  • 极简示例:

    <Canvas Width="300" Height="200" Background="LightGray"><!-- 圆(左上角定位) --><Ellipse Width="50" Height="50" Fill="Red" Canvas.Left="20" Canvas.Top="20"/><!-- 文本(右下角定位) --><TextBlock Text="绝对定位" Canvas.Right="20" Canvas.Bottom="20"/>
    </Canvas>

1.6 DockPanel(边缘停靠)

  • 核心场景:工具栏 + 内容区(如 “顶部工具栏 + 中间内容 + 底部状态栏”)

  • 必记属性:

    • LastChildFill:最后一个子元素是否占满剩余空间(默认True

    • DockPanel.Dock:子元素停靠方向(Top/Bottom/Left/Right

  • 避坑点:子元素停靠顺序影响布局,建议先停靠Top/Bottom,再停靠Left/Right

  • 极简示例:

    <DockPanel LastChildFill="True" Width="400" Height="300"><!-- 顶部工具栏 --><ToolBar DockPanel.Dock="Top"><Button Content="剪切"/><Button Content="复制"/></ToolBar><!-- 左侧列表 --><ListBox Width="100" DockPanel.Dock="Left"/><!-- 中间内容(占剩余空间) --><TextBlock Text="主内容区" HorizontalAlignment="Center" VerticalAlignment="Center"/>
    </DockPanel>

1.7 其他高频布局控件(简表)

控件核心场景必记属性极简示例
GridSplitter调整 Grid 行 / 列大小ResizeDirectionColumns/Rows<GridSplitter Width="5" Background="Gray" ResizeDirection="Columns"/>
GroupBox控件分组(带标题)Header(分组标题)<GroupBox Header="登录信息"><TextBox/></GroupBox>
Viewbox自动缩放子元素(保持比例)StretchUniform自适应比例)<Viewbox Width="200"><Button Content="缩放按钮"/></Viewbox>
VirtualizingStackPanel大量数据列表(优化性能)VirtualizingPanel.IsVirtualizing="True"<ListBox.ItemsPanel><ItemsPanelTemplate><VirtualizingStackPanel/></ItemsPanelTemplate></ListBox.ItemsPanel>
Expander折叠 / 展开内容(省空间)Header(标题)、IsExpanded<Expander Header="高级设置"><CheckBox/></Expander>

第二章 高频交互控件(用户操作核心)

2.1 Button(基础按钮)

  • 核心场景:触发操作(提交、重置、跳转)

  • 必记属性 / 事件:

    • Content:按钮文本 / 控件(可放 Image+Text)

    • Click:单击事件;Command(MVVM):绑定命令

  • 避坑点:按钮内容默认居中,如需自定义布局,可在Content中嵌套 StackPanel

  • 极简示例:

    <!-- 普通按钮(事件绑定) -->
    <Button Content="提交" Width="80" Height="30" Click="SubmitBtn_Click"/>
    ​
    <!-- 带图标的按钮 -->
    <Button Width="100" Height="30"><StackPanel Orientation="Horizontal" Spacing="5"><Image Source="Images/submit.png" Width="16" Height="16"/><TextBlock Text="提交"/></StackPanel>
    </Button>
    ​
    <!-- C#事件处理(复制可用) -->
    private void SubmitBtn_Click(object sender, RoutedEventArgs e)
    {MessageBox.Show("提交成功!");
    }

2.2 TextBox(文本输入)

  • 核心场景:单行 / 多行文本输入(用户名、备注)

  • 必记属性:

    • Text:输入内容(支持双向绑定)

    • MaxLength:最大输入长度;TextWrapping:换行(Wrap自动换行)

    • AcceptsReturn:允许回车换行(多行输入需设为True

  • 避坑点:多行输入时,需同时设置TextWrapping="Wrap"AcceptsReturn="True"

  • 极简示例:

    <!-- 单行输入(用户名) -->
    <TextBox Width="200" Height="30" Text="{Binding UserName}" MaxLength="20"/>
    ​
    <!-- 多行输入(备注) -->
    <TextBox Width="200" Height="100" TextWrapping="Wrap" AcceptsReturn="True" MaxLength="200"/>

2.3 PasswordBox(密码输入)

  • 核心场景:密码输入(隐藏输入内容)

  • 必记属性 / 事件:

    • Password:密码内容(不支持绑定,需通过事件获取)

    • PasswordChar:隐藏字符(默认*,可设为

    • PasswordChanged:密码变化事件

  • 避坑点:切勿用TextBlock绑定Password属性,存在安全风险

  • 极简示例:

    <PasswordBox x:Name="PwdBox" Width="200" Height="30" PasswordChar="●" PasswordChanged="PwdBox_PasswordChanged"/><!-- C#获取密码(复制可用) -->
    private string _userPwd;
    private void PwdBox_PasswordChanged(object sender, RoutedEventArgs e)
    {_userPwd = PwdBox.Password; // 实时获取密码
    }

2.4 RichTextBox(富文本输入)

  • 核心场景:格式化文本(字体、颜色、加粗,如邮件编辑)

  • 必记属性:

    • Document:富文本内容(需嵌套FlowDocument

    • IsReadOnly:是否只读(用于展示富文本)

  • 避坑点:无法直接绑定Text,需通过Document操作内容

  • 极简示例:

    <RichTextBox Width="300" Height="150" x:Name="RichTB"><RichTextBox.Document><FlowDocument><Paragraph><Run Text="富文本示例:" FontWeight="Bold" FontSize="14"/><Run Text="可设置" Foreground="Red"/><Run Text="颜色、" FontStyle="Italic"/><Run Text="字体" FontSize="16"/></Paragraph></FlowDocument></RichTextBox.Document>
    </RichTextBox><!-- C#添加内容(复制可用) -->
    private void AddRichTextBtn_Click(object sender, RoutedEventArgs e)
    {Paragraph p = new Paragraph(new Run("新增富文本内容"));p.Foreground = Brushes.Blue; // 蓝色文本RichTB.Document.Blocks.Add(p);
    }

2.5 RepeatButton(长按按钮)

  • 核心场景:连续操作(如音量增减、数值调整)

  • 必记属性:

    • Interval:长按触发间隔(毫秒,默认 100)

    • Delay:长按延迟触发时间(毫秒,默认 300)

  • 极简示例:

    <StackPanel Orientation="Horizontal" Spacing="10"><RepeatButton Content="-" Width="30" Height="30" Click="MinusBtn_Click" Interval="100"/><TextBlock x:Name="NumText" Text="10" Width="40" TextAlignment="Center"/><RepeatButton Content="+" Width="30" Height="30" Click="PlusBtn_Click" Interval="100"/>
    </StackPanel><!-- C#实现数值增减(复制可用) -->
    private int _num = 10;
    private void MinusBtn_Click(object sender, RoutedEventArgs e)
    {if (_num > 0) NumText.Text = (--_num).ToString();
    }
    private void PlusBtn_Click(object sender, RoutedEventArgs e)
    {if (_num < 100) NumText.Text = (++_num).ToString();
    }

2.6 其他高频交互控件(简表)

控件核心场景必记属性 / 事件极简示例
TextBlock只读文本(性能优于 Label)TextForeground(颜色)、TextWrapping<TextBlock Text="只读文本" Foreground="Blue"/>
Label关联控件(带访问键)Target(关联控件)、Content_开头设访问键)<Label Content="_用户名:" Target="UserNameTB"/>
AccessText访问键文本(单独使用)Text_开头设访问键)<AccessText Text="_登录" Target="LoginBtn"/>
ComboBox下拉选择(单选)ItemsSource(绑定选项)、SelectedItem<ComboBox ItemsSource="{Binding Cities}" SelectedItem="{Binding SelectedCity}"/>
CheckBox多选(非互斥)IsChecked(是否选中)、IsThreeState(三态)<CheckBox Content="同意协议" IsChecked="{Binding Agree}"/>
RadioButton单选(互斥)GroupName(同组互斥)、IsChecked<RadioButton Content="男" GroupName="Gender"/>
Slider范围选择(如音量、进度)Minimum/MaximumValue(绑定值)<Slider Minimum="0" Maximum="100" Value="{Binding Volume}"/>
ProgressBar进度展示(如加载)ValueIsIndeterminate(不确定进度)<ProgressBar Value="60" Maximum="100"/>
ToolTip悬停提示Content(提示内容)、ShowDuration<Button ToolTip="点击提交"><Button.ToolTip><ToolTip Content="提交表单" ShowDuration="3000"/></Button.ToolTip></Button>
Calendar完整日历选择SelectedDateSelectionMode(多选)<Calendar SelectedDate="2024-05-20" SelectionMode="MultipleRange"/>
DatePicker简洁日期选择SelectedDateDisplayDateStart(日期范围)<DatePicker SelectedDate="{Binding Birthday}"/>
ContextMenu右键菜单绑定到控件的ContextMenu属性<TextBlock Text="右键我"><TextBlock.ContextMenu><ContextMenu><MenuItem Header="复制"/></ContextMenu></TextBlock.ContextMenu></TextBlock>
Menu+ToolBar顶部菜单 / 工具栏MenuItem(菜单项)、Separator(分割线)<Menu><MenuItem Header="文件"><MenuItem Header="新建"/></MenuItem></Menu>

第三章 数据展示控件(数据可视化核心)

3.1 DataGrid(表格数据)

  • 核心场景:结构化数据(如用户列表、订单表,支持编辑、排序)

  • 必记属性:

    • ItemsSource:绑定数据集合(如List<User>

    • AutoGenerateColumns:是否自动生成列(建议设False,自定义列)

    • CanUserSortColumns:是否允许列排序(默认True

  • 避坑点:绑定的实体类需有公共属性(非字段),否则无法显示数据

  • 完整示例(复制可用):

    <!-- XAML -->
    <DataGrid Width="400" Height="250" ItemsSource="{Binding UserList}" AutoGenerateColumns="False" CanUserSortColumns="True"><DataGrid.Columns><!-- 文本列 --><DataGridTextColumn Header="姓名" Binding="{Binding Name}" Width="100"/><!-- 数值列(格式化) --><DataGridTextColumn Header="年龄" Binding="{Binding Age}" Width="80" TextAlignment="Center"/><!-- 复选框列 --><DataGridCheckBoxColumn Header="是否启用" Binding="{Binding IsEnabled}" Width="120"/><!-- 按钮列 --><DataGridTemplateColumn Header="操作" Width="100"><DataGridTemplateColumn.CellTemplate><DataTemplate><Button Content="编辑" Click="EditBtn_Click" Width="60"/></DataTemplate></DataGridTemplateColumn.CellTemplate></DataGridTemplateColumn></DataGrid.Columns>
    </DataGrid><!-- C#:实体类+数据绑定(复制可用) -->
    // 1. 实体类
    public class User
    {public string Name { get; set; }public int Age { get; set; }public bool IsEnabled { get; set; }
    }// 2. 页面后台(或ViewModel)
    public partial class DataGridPage : Page
    {public List<User> UserList { get; set; } // 数据集合public DataGridPage(){InitializeComponent();// 模拟数据UserList = new List<User>{new User{Name="张三", Age=25, IsEnabled=true},new User{Name="李四", Age=30, IsEnabled=false}};DataContext = this; // 设置绑定上下文}// 编辑按钮事件private void EditBtn_Click(object sender, RoutedEventArgs e){Button btn = sender as Button;User selectedUser = btn.DataContext as User; // 获取当前行数据MessageBox.Show($"编辑用户:{selectedUser.Name}");}
    }

3.2 ListBox(列表选择)

  • 核心场景:简单列表(如选项列表,支持单选 / 多选)

  • 必记属性:

    • ItemsSource:绑定数据集合

    • SelectionMode:选择模式(Single单选 /Multiple多选 /Extended按住 Ctrl 多选)

    • SelectedItems:多选结果(绑定ObservableCollection<T>

  • 极简示例:

    <!-- 多选列表 -->
    <ListBox Width="200" Height="150" ItemsSource="{Binding Books}" SelectionMode="Multiple" SelectedItems="{Binding SelectedBooks}"><!-- 自定义列表项模板 --><ListBox.ItemTemplate><DataTemplate><StackPanel Orientation="Horizontal" Spacing="5"><Image Source="{Binding CoverUrl}" Width="30" Height="40"/><TextBlock Text="{Binding BookName}"/></StackPanel></DataTemplate></ListBox.ItemTemplate>
    </ListBox><!-- C#:实体类+数据(复制可用) -->
    public class Book
    {public string BookName { get; set; }public string CoverUrl { get; set; }
    }public partial class ListBoxPage : Page
    {public List<Book> Books { get; set; }public ObservableCollection<Book> SelectedBooks { get; set; } // 多选需用ObservableCollectionpublic ListBoxPage(){InitializeComponent();Books = new List<Book>{new Book{BookName="WPF实战", CoverUrl="Images/book1.png"},new Book{BookName="C#入门", CoverUrl="Images/book2.png"}};SelectedBooks = new ObservableCollection<Book>();DataContext = this;}
    }

3.3 ListView(灵活列表)

  • 核心场景:自定义视图(网格 / 图标 / 列表,如商品列表)

  • 必记属性:

    • View:视图类型(GridView网格视图 /ListViewItem列表视图)

    • ItemsSource:绑定数据集合

  • 避坑点GridView需通过GridViewColumn定义列,类似 DataGrid 但更轻量

  • 极简示例(网格视图):

    <ListView Width="400" Height="200" ItemsSource="{Binding Products}"><ListView.View><GridView><GridViewColumn Header="商品名" DisplayMemberBinding="{Binding Name}" Width="150"/><GridViewColumn Header="价格" DisplayMemberBinding="{Binding Price, StringFormat='{0:C}'}" Width="100"/><GridViewColumn Header="库存" DisplayMemberBinding="{Binding Stock}" Width="150"/></GridView></ListView.View>
    </ListView><!-- C#:实体类(复制可用) -->
    public class Product
    {public string Name { get; set; }public decimal Price { get; set; }public int Stock { get; set; }
    }// 数据绑定同ListBox,设置DataContext即可

3.4 TreeView(层级数据)

  • 核心场景:层级结构(如文件夹、组织架构)

  • 必记属性:

    • ItemsSource:顶层数据集合

    • HierarchicalDataTemplate:层级模板(绑定子集合)

  • 避坑点:子集合属性名需与模板中ItemsSource一致(如下例Children

  • 极简示例:

    <TreeView Width="250" Height="200" ItemsSource="{Binding Folders}"><TreeView.ItemTemplate><!-- 层级模板:绑定子集合Children --><HierarchicalDataTemplate ItemsSource="{Binding Children}"><StackPanel Orientation="Horizontal" Spacing="5"><Image Source="Images/folder.png" Width="16" Height="16"/><TextBlock Text="{Binding FolderName}"/></StackPanel></HierarchicalDataTemplate></TreeView.ItemTemplate>
    </TreeView><!-- C#:层级实体类(复制可用) -->
    public class Folder
    {public string FolderName { get; set; }public List<Folder> Children { get; set; } // 子集合
    }public partial class TreeViewPage : Page
    {public List<Folder> Folders { get; set; }public TreeViewPage(){InitializeComponent();// 模拟层级数据Folders = new List<Folder>{new Folder{FolderName="文档",Children=new List<Folder>{new Folder{FolderName="工作文档"},new Folder{FolderName="个人文档"}}},new Folder{FolderName="图片"}};DataContext = this;}
    }

第四章 系统对话框与媒体控件

4.1 OpenFileDialog(打开文件)

  • 核心场景:选择单个 / 多个文件(如导入文档、上传图片)

  • 必记方法 / 属性:

    • ShowDialog():显示对话框(返回bool?true表示用户确认)

    • Filter:文件筛选器(如 “文本文件 |.txt | 所有文件 |.*”)

    • Multiselect:是否允许多选(默认false

  • 完整示例(C# 复制可用):

    private void OpenFileBtn_Click(object sender, RoutedEventArgs e)
    {OpenFileDialog openDialog = new OpenFileDialog();// 设置筛选器:文本文件+所有文件openDialog.Filter = "文本文件 (*.txt)|*.txt|所有文件 (*.*)|*.*";openDialog.FilterIndex = 1; // 默认选中第一个筛选器openDialog.Multiselect = true; // 允许多选// 显示对话框,用户点击“确定”则处理if (openDialog.ShowDialog() == true){// 单个文件路径string singleFilePath = openDialog.FileName;// 多个文件路径(Multiselect=true时)string[] multiFilePaths = openDialog.FileNames;// 示例:显示选择的文件string fileMsg = $"选中文件数:{multiFilePaths.Length}\n";foreach (var path in multiFilePaths){fileMsg += path + "\n";}MessageBox.Show(fileMsg);}
    }

4.2 SaveFileDialog(保存文件)

  • 核心场景:指定保存路径(如导出报表、保存编辑内容)

  • 必记属性:

    • FileName:默认保存文件名

    • Filter:文件筛选器(如 “Word 文档 |*.docx”)

  • 完整示例(C# 复制可用):

    private void SaveFileBtn_Click(object sender, RoutedEventArgs e)
    {SaveFileDialog saveDialog = new SaveFileDialog();// 设置筛选器和默认文件名saveDialog.Filter = "Word文档 (*.docx)|*.docx|Excel文档 (*.xlsx)|*.xlsx";saveDialog.FileName = "未命名文档"; // 默认文件名saveDialog.DefaultExt = ".docx"; // 默认扩展名if (saveDialog.ShowDialog() == true){string savePath = saveDialog.FileName;// 执行保存逻辑(如写入文件)File.WriteAllText(savePath, "保存的内容");MessageBox.Show($"文件已保存至:{savePath}");}
    }

4.3 PrintDialog(打印)

  • 核心场景:打印 UI 元素(如表单、文档、Grid)

  • 必记方法

    • ShowDialog():显示打印设置对话框

    • PrintVisual(visual, title):打印指定 UI 元素(visual为 UIElement,如 Grid、DocumentViewer)

  • 完整示例(C# 复制可用)

    <!-- XAML:需打印的Grid -->
    <Grid x:Name="PrintGrid" Width="600" Height="800" Background="White"><TextBlock Text="打印测试文档" FontSize="20" HorizontalAlignment="Center" Margin="20"/><DataGrid ItemsSource="{Binding PrintData}" Margin="20,50,20,20"/>
    </Grid>
    <Button Content="打印" Click="PrintBtn_Click" Margin="20"/>
    private void PrintBtn_Click(object sender, RoutedEventArgs e)
    {PrintDialog printDialog = new PrintDialog();// 设置打印纸张大小(可选)printDialog.PrintTicket.PageMediaSize = new PageMediaSize(PageMediaSizeName.A4);if (printDialog.ShowDialog() == true){// 打印Grid控件printDialog.PrintVisual(PrintGrid, "测试文档打印");MessageBox.Show("打印任务已提交!");}
    }

4.4 Image(图片显示)

  • 核心场景:显示本地 / 网络图片(PNG、JPG、BMP 等)

  • 必记属性:

    • Source:图片路径(本地用相对路径,网络用 URL)

    • Stretch:缩放方式(Uniform保持比例 /Fill拉伸填充 /None不缩放)

  • 避坑点:本地图片需设置 “复制到输出目录”(右键图片文件→属性→复制到输出目录→“如果较新则复制”)

  • 极简示例:

    <!-- 本地图片(相对路径) -->
    <Image Width="200" Height="150" Stretch="Uniform" Margin="10"><Image.Source><BitmapImage UriSource="Images/logo.png"/> <!-- 路径:项目根目录/Images/logo.png --></Image.Source>
    </Image><!-- 网络图片(URL) -->
    <Image Width="200" Height="150" Stretch="Uniform"><Image.Source><BitmapImage UriSource="https://example.com/image.jpg"/></Image.Source>
    </Image>

4.5 MediaElement(音视频播放)

  • 核心场景:播放本地 / 网络音频(MP3)、视频(MP4)

  • 必记属性 / 方法

    • Source:音视频路径

    • Play()/Pause()/Stop():播放 / 暂停 / 停止

    • Volume:音量(0~1);IsMuted:是否静音

  • 避坑点:播放网络视频需确保 URL 可访问,本地文件需设置 “复制到输出目录”

  • 完整示例

    <!-- XAML -->
    <StackPanel><!-- 视频播放控件 --><MediaElement x:Name="MediaElem" Width="400" Height="300" Volume="0.8" LoadedBehavior="Manual"/><!-- 控制按钮 --><StackPanel Orientation="Horizontal" Spacing="10" Margin="10"><Button Content="播放" Click="PlayBtn_Click"/><Button Content="暂停" Click="PauseBtn_Click"/><Button Content="停止" Click="StopBtn_Click"/></StackPanel>
    </StackPanel>

    // C#(复制可用)
    private void PlayBtn_Click(object sender, RoutedEventArgs e)
    {// 本地视频路径(需设置复制到输出目录)MediaElem.Source = new Uri("Media/test.mp4", UriKind.Relative);MediaElem.Play();
    }private void PauseBtn_Click(object sender, RoutedEventArgs e)
    {if (MediaElem.CanPause) MediaElem.Pause();
    }private void StopBtn_Click(object sender, RoutedEventArgs e)
    {MediaElem.Stop();MediaElem.Source = null; // 释放资源
    }

第五章 数字墨迹控件(手写交互)

5.1 InkCanvas(手写画布)

  • 核心场景:手写输入(如签名、绘图,支持触控 / 笔输入)

  • 必记属性 / 方法

    • Strokes:墨迹集合(可保存 / 加载)

    • EditingMode:编辑模式(Ink绘图 /EraseByPoint点擦除 /Select选择)

    • DefaultDrawingAttributes:笔刷样式(颜色、粗细)

  • 极简示例

    <StackPanel><InkCanvas x:Name="InkCanvas" Width="400" Height="300" Background="White" EditingMode="Ink" Margin="10"><!-- 笔刷样式:蓝色,3px粗 --><InkCanvas.DefaultDrawingAttributes><DrawingAttributes Color="Blue" Width="3" Height="3"/></InkCanvas.DefaultDrawingAttributes></InkCanvas><Button Content="清除墨迹" Click="ClearInkBtn_Click" Width="100"/>
    </StackPanel>
    // C#清除墨迹(复制可用)
    private void ClearInkBtn_Click(object sender, RoutedEventArgs e)
    {InkCanvas.Strokes.Clear(); // 清除所有墨迹
    }// 可选:保存墨迹到文件
    private void SaveInkBtn_Click(object sender, RoutedEventArgs e)
    {using (FileStream fs = new FileStream("ink.strokes", FileMode.Create)){InkCanvas.Strokes.Save(fs); // 保存墨迹}
    }

第六章 笔记使用说明

  1. 索引跳转:PDF 中点击 “目录索引” 的 “页码指引”,可直接跳转到对应控件章节;

  2. 代码复制:所有示例代码已去除冗余格式,复制到 Visual Studio 后,只需:

    • 确保实体类命名空间与页面一致;

    • 本地图片 / 音视频文件需放在对应路径,并设置 “复制到输出目录”;

  3. 避坑点优先看:每个控件的 “避坑点” 是实际开发中高频踩坑场景,优先阅读;

  4. 场景匹配:不确定用哪个控件时,先看 “核心场景”,匹配需求后再查属性和示例。

此笔记已覆盖 WPF 开发中 90% 以上的高频控件,可直接作为开发手册使用。若需补充某类控件的进阶用法(如 MVVM 绑定、样式自定义),可随时告知,我会为你扩展补充。

http://www.dtcms.com/a/531834.html

相关文章:

  • Selenium+Unittest自动化测试框架
  • 设计模式-命令模式(Command)
  • 设计模式-外观模式(Facade)
  • web自动化测试-selenium_01_元素定位
  • 苏州建设工程信息网站wordpress自动生成tag
  • 学习C#调用OpenXml操作word文档的基本用法(1:读取样式定义)
  • Java-Spring入门指南(二十八)Android界面设计基础
  • Go 语言类型转换
  • 【Windows】goland-2024版安装包
  • 快速入门elasticsearch
  • Linux 多用户服务器限制单用户最大内存使用(systemd user.slice)
  • 食品公司网站设计项目雨蝶直播免费直播
  • SQL 调试不再靠猜:Gudu SQL Omni 让血缘分析一键可视化
  • RV1126 NO.34:OPENCV的交叉编译和项目Makefile讲解
  • FreeRTOS---进阶知识4---通用链表
  • jvm逃逸问题的分析以及给出解决方案?
  • PHP 表单:深入浅出地掌握表单处理
  • Linux(Ubuntu)操作系统下文件的解压
  • HTTP 1.0版本的webserver自主实现
  • 【开题答辩全过程】以 基于微信小程序的个性化饮品定制点餐系统设计与实现为例,包含答辩的问题和答案
  • kotlin - 显示heic图片
  • 做网站域名是什么意思网站不备案会怎样
  • A2A+MCP构建智能体协作生态:下一代分布式人工智能架构解析
  • SpringBoot 的三类配置文件
  • 创造模式物品栏——多物品栏
  • Docker中部署多个ASP.NET Core实例
  • HarmonyOS生物识别认证深度解析:从指纹到人脸的安全实践
  • GitHub等平台形成的开源文化正在重塑加热d
  • C++新特性概览
  • dify 配置 deepseek Credentials validation failed with status code 402