WPF入门到精通:2.WPF常用控件及布局

WPF(Windows Presentation Foundation)是一个用于构建 Windows 应用程序的框架,它提供了丰富的控件和布局方式,帮助开发者快速构建出现代化的应用程序。

WPF常用控件

  1. Button 控件 WPF 中最常用的控件之一。它由一个文本标签和一个可选图像定义。

    <Button Content="Click Me!" />
    <Button Content="Save" ImageSource="/Images/save.png" />
    
  2. Label 控件用于显示文本,它通常用于标识其他控件。
    <Label Content="Username:" />
    
  3. TextBox 控件允许用户输入文本。
    <TextBox />
    
  4. PasswordBox控件用于输入密码,它不会显示输入的字符。
    <PasswordBox />
    
  5. CheckBox控件允许用户选择是否选中一个选项。它通常用于开关选项。
    <CheckBox Content="I agree to the terms and conditions." />
    
  6. RadioButton 控件用于选择一组互斥的选项。只有一个选项可以被选中。
    <RadioButton Content="Male" GroupName="gender" />
    <RadioButton Content="Female" GroupName="gender" />
    
  7. ComboBox控件允许用户从一个下拉列表中选择一个选项。
    <ComboBox>
      <ComboBoxItem Content="Red" />
      <ComboBoxItem Content="Green" />
      <ComboBoxItem Content="Blue" />
    </ComboBox>
    
  8. ListBox控件用于显示一个列出的项目,用户可以从中选择一个或多个。
    <ListBox>
      <ListBoxItem Content="Item 1" />
      <ListBoxItem Content="Item 2" />
      <ListBoxItem Content="Item 3" />
    </ListBox>
    
  9. TabControl  标签页控件
    
    
    <Window x:Class="WpfApp1.MainWindow"
            xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
            xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
            xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
            xmlns:local="clr-namespace:WpfApp1"
            xmlns:sys="clr-namespace:WpfApp1.UserControls.TestControl;assembly=WpfApp1.UserControls" 
            mc:Ignorable="d"
            Title="MainWindow" Height="450" Width="800">
        <Grid>
                <TabControl SelectedIndex="1">
                <TabItem Header="测试页">
                    <sys:TestControl />
                </TabItem>
                <TabItem Header="测试页2">
                    <sys:TestControl />
                </TabItem>
            </TabControl>
        </Grid>
    </Window>
    
  10. UserControl  用户控件
    <UserControl x:Class="WpfApp1.UserControls.TestControl"
                 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                 xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
                 xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
                 xmlns:local="clr-namespace:MES.Client.Test.UserControls"
                 mc:Ignorable="d" 
                 d:DesignHeight="450" d:DesignWidth="800">
        <Grid>
     
        </Grid>
    </UserControl>
    

注意:TabControl  标签页控件中TabItem 为对应用户控件,sys为引用命名空间名称,TestControl指向具体用户控件

WPF布局面板:

  1. 栅格布局(Grid) :栅格布局是 WPF 中最灵活和最强大的布局方式之一。它允许你将 UI 元素划分为行和列,并在每个单元格中放置 UI 元素。

  2. 堆叠布局(StackPanel):堆叠布局是一种简单的布局方式,它按照水平或垂直顺序将 UI 元素堆叠在一起。可以使用 Orientation 属性来控制堆叠的方向。

  3. 流式布局(WrapPanel):流式布局是一种自适应的布局方式,它按照水平或垂直顺序将 UI 元素排列在一行或一列中,当元素无法全部显示在行或列中时,它们将自动换行。

  4. 均匀布局(UniformGrid):均匀布局将 UI 元素均匀分布在一个网格中。可以使用 Rows 和 Columns 属性来控制行数和列数。

  5. DockPanel(停靠面板) - 它允许你将 UI 元素放置在容器的上、下、左、右或中心位置。

  6. Canvas(画布) - 可以将控件按照绝对位置进行放置,常用于绘制图形或自定义布局。

常用布局演示代码

<Window x:Class="WpfApp1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp1"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Grid>
        <Grid>
            <Grid.RowDefinitions>

                <!--①:绝对尺寸
            <RowDefinition Height="161" />

            ②:自动尺寸
            <RowDefinition Height="auto" />

            ③:按比例尺寸  
            <RowDefinition Height="*" />-->

                <RowDefinition Height="*" />
                <RowDefinition Height="*" />
                <RowDefinition Height="*" />
                <RowDefinition Height="*" />
                <RowDefinition Height="*" />
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>

            <!--栅格布局:栅格布局是 WPF 中最灵活和最强大的布局方式之一。它允许你将 UI 元素划分为行和列,并在每个单元格中放置 UI 元素-->
            <Grid    Grid.Row="0">
                <Grid.RowDefinitions>
                    <RowDefinition Height="*" />
                    <RowDefinition Height="*" />
                    <RowDefinition Height="*" />
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>
                <Button Grid.Row="0" Grid.Column="0" Content="1:"  />
                <Button Grid.Row="0" Grid.Column="1" Content="2:" />
                <Button Grid.Row="1" Grid.Column="0"  Content="3:" />
                <Button Grid.Row="1" Grid.Column="1" Content="4:" />
                <Button Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="2"  Content="5:"/>
            </Grid>

            <!--堆叠布局(StackPanel):堆叠布局是一种简单的布局方式,它按照水平或垂直顺序将 UI 元素堆叠在一起。可以使用 Orientation 属性来控制堆叠的方向-->
            <StackPanel  Grid.Row="1" Orientation="Horizontal">
                <Button Content="Save" />
                <Button Content="Cancel" />
            </StackPanel>

            <!--流式布局(WrapPanel):流式布局是一种自适应的布局方式,它按照水平或垂直顺序将 UI 元素排列在一行或一列中,当元素无法全部显示在行或列中时,它们将自动换行-->
            <WrapPanel  Grid.Row="2" Width="200" Height="100">
                <Button Content="Button 1"   Width="100"/>
                <Button Content="Button 2"  Width="100" />
                <Button Content="Button 3"  Width="100" />
            </WrapPanel>

            <!--均匀布局(UniformGrid):均匀布局将 UI 元素均匀分布在一个网格中。可以使用 Rows 和 Columns 属性来控制行数和列数-->
            <UniformGrid Grid.Row="3" Rows="2" Columns="2"  >
                <Button Content="Button 1" />
                <Button Content="Button 2" />
                <Button Content="Button 3" />
                <Button Content="Button 4" />
            </UniformGrid>

            <!--DockPanel:DockPanel 是一种布局方式,它允许你将 UI 元素放置在容器的上、下、左、右或中心位置-->
            <DockPanel  Grid.Row="4"  >
                <Button DockPanel.Dock="Top" Content="Top" />
                <Button DockPanel.Dock="Left" Content="Left" />
                <Button DockPanel.Dock="Right" Content="Right" />
                <Button DockPanel.Dock="Bottom" Content="Bottom" />
                <Button Content="Center" />
            </DockPanel>

            <!--Canvas(画布) - 可以将控件按照绝对位置进行放置,常用于绘制图形或自定义布局-->
            <Canvas  Grid.Row="5" >
                <Button Canvas.Left="10" Canvas.Top="10" Content="Button 1" />
                <Button Canvas.Left="50" Canvas.Top="20" Content="Button 2" />
                <Button Canvas.Left="90" Canvas.Top="30" Content="Button 3" />
            </Canvas>
        </Grid>
    </Grid>
</Window>

演示效果: 

总结

WPF 提供了大量的控件和布局方式,可以帮助快速构建应用程序。在选择控件和布局方式时,需要根据具体的需求进行选择。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/82651.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

flinksql实时统计程序背压延迟优化

问题&#xff1a; flinkcdcflinksql做实时读取sls日志和实时统计业务指标&#xff0c;今天发现程序背压了&#xff0c;业务延迟了6个小时。解决办法&#xff1a; 1、资源优化 作业并发大时&#xff1a;在作业的高级配置的资源配置中&#xff0c;增加JobManager的资源&#xf…

MySQL系统变量 会话变量,用户变量

系统变量 分类 全局系统变量需要添加 global 关键字&#xff0c;有时把全局系统变量简称 全局变量 会话系统变量需要添加 session 关键字&#xff0c;有时也把会话系统变量称为 local 变量 局部变量 如果不写&#xff08;global、session&#xff09;默认会话级别。 静态变量在…

在云服务器上安装Jenkins

说明&#xff1a;Jenkins是一个部署项目的平台&#xff0c;通过Jenkins可以省去从项目开发–>部署项目之间的所有流程&#xff0c;做到代码提交即上线。本文介绍在云服务CentOS上安装Jenkins。 前提 安装Jenkins之前&#xff0c;先要在云服务上安装JDK、Maven、Git&#x…

07_缓存预热缓存雪崩缓存击穿缓存穿透

缓存预热&缓存雪崩&缓存击穿&缓存穿透 一、缓存预热 提前将数据从数据库同步到redis。 在程序启动的时候&#xff0c;直接将数据刷新到redis懒加载&#xff0c;用户访问的时候&#xff0c;第一次查询数据库&#xff0c;然后将数据写入redis 二、缓存雪崩 发生情…

Docker搭建LNMP运行Wordpress平台

一、项目1.1 项目环境1.2 服务器环境1.3 任务需求 二、Linux 系统基础镜像三、Nginx1、建立工作目录2、编写 Dockerfile 脚本3、准备 nginx.conf 配置文件4、生成镜像5、创建自定义网络6、启动镜像容器7、验证 nginx 四、Mysql1、建立工作目录2、编写 Dockerfile3、准备 my.cnf…

Azure虚拟网络对等互连

什么是Azure虚拟网络对等互联 Azure虚拟网络对等互联&#xff08;Azure Virtual Network peering&#xff09;是一种连接两个虚拟网络的方法&#xff0c;使得这两个虚拟网络能够在同一地理区域内进行通信。它通过私有IP地址在虚拟网络之间建立网络连接&#xff0c;不论是在同一…

信安通用基础知识

文章目录 密码学经典误区PGP优良保密协议信安经典其它安全手段XSS与CSRF cross site request forgeryCSRF的利用逻辑CSRF示例CSRF防范检查Referer字段添加校验token XSS cross site scripting common weakness enumeration常见密码api误用&#xff08;摘自毕设参考文献&#xf…

Unity VR:XR Interaction Toolkit 输入系统(Input System):获取手柄的输入

文章目录 &#x1f4d5;教程说明&#x1f4d5;Input System 和 XR Input Subsystem&#xff08;推荐 Input System&#xff09;&#x1f4d5;Input Action Asset⭐Actions Maps⭐Actions⭐Action Properties&#x1f50d;Action Type (Value, Button, Pass through) ⭐Binding …

Error creating bean with name ‘esUtils‘ defined in file

报错异常&#xff1a; 背景&#xff1a; esUtils在common服务中、启动media服务时候、报这个异常、后排查esUtils在启动时候发生异常引起的、在相关bean中加入try{}catch{}即可解决问题 String[] split url.split(","); HttpHost[] httpHosts new HttpHost[split.…

字符设备驱动实例(PWM和RTC)

目录 五、PWM 六、RTC 五、PWM PWM(Pulse Width Modulation&#xff0c;脉宽调制器)&#xff0c;顾名思义就是一个输出脉冲宽度可以调整的硬件器件&#xff0c;其实它不仅脉冲宽度可调&#xff0c;频率也可以调整。它的核心部件是一个硬件定时器&#xff0c;其工作原理可以用…

微信小程序:函数节流与函数防抖

目录 问题引入&#xff1a; 定义 解决方案&#xff1a;函数节流 一、案例举例 1.页面展示 2.search.wxml标签展示 3.search.js展示 4.结果展示 二、函数节流解决问题 1.函数 2.实例应用 三、函数防抖解决问题 1.函数 2.原理 3.应用场景 4.应用实例 总结 问题引入…

华为云零代码新手教学-体验通过Astro Zero快速搭建微信小程序

您将会学到 您将学会如何基于Astro零代码能力&#xff0c;DIY开发&#xff0c;完成问卷、投票、信息收集、流程处理等工作&#xff0c;还能够在线筛选、分析数据。实现一站式快速开发个性化应用&#xff0c;体验轻松拖拽开发的乐趣。 您需要什么 环境准备 注册华为云账号、实…

unity之Input.GetKeyDown与Input.GetKey区别

文章目录 Input.GetKeyDown与Input.GetKey区别 Input.GetKeyDown与Input.GetKey区别 Input.GetKey 和 Input.GetKeyDown 是 Unity 中用于检测按键状态的两个不同函数。它们之间的区别在于何时触发。 Input.GetKey(KeyCode key): 这个函数会在用户按住指定的键时触发&#xff0…

深度学习|自监督学习、MAE学习策略、消融实验

前言&#xff1a;最近在阅读论文&#xff0c;发现太多机器学习的知识不懂&#xff0c;把最近看的一篇论文有关的知识点汇总了一下。 自监督学习、MAE学习策略、消融实验 自监督学习MAE学习策略消融实验 自监督学习 Pretrain-Finetune&#xff08;预训练精调&#xff09;模式&…

Jmeter生成可视化的HTML测试报告

Jmeter也是可以生成测试报告的。 性能测试工具Jmeter由于其体积小、使用方便、学习成本低等原因&#xff0c;在现在的性能测试过程中&#xff0c;使用率越来越高&#xff0c;但其本身也有一定的缺点&#xff0c;比如提供的测试结果可视化做的很一般。 不过从3.0版本开始&…

初阶c语言:实战项目三子棋

前言 大家已经和博主学习有一段时间了&#xff0c;今天讲一个有趣的实战项目——三子棋 目录 前言 制作菜单 构建游戏选择框架 实现游戏功能 模块化编程 初始化棋盘 打印棋盘 玩家下棋 电脑下棋 时间戳&#xff1a;推荐一篇 C语言生成随机数的方法_c语言随机数_杯浅…

数据库结构差异对比工具

简介 前几年写了一个数据库对比工具&#xff0c;但是由于实现方式的原因&#xff0c;数据库支持有限&#xff0c;所以重新设计了一下&#xff0c;便于支持多种数据库&#xff0c;并且更新了UI。 新版地址&#xff1a;https://gitee.com/xgpxg/db-diff 旧版地址&#xff1a;h…

ARM 配置晶振频率

文章目录 前言串口乱码问题定位内核修改晶振频率uboot 修改晶振频率番外篇 前言 上篇文章《ARM DIY 硬件调试》介绍了 DIY ARM 板的基础硬件焊接&#xff0c;包括电源、SOC、SD 卡座等&#xff0c;板子已经可以跑起来了。 但是发现串口乱码&#xff0c;今天就来解决串口乱码问…

OpenCV图片校正

OpenCV图片校正 背景几种校正方法1.傅里叶变换 霍夫变换 直线 角度 旋转3.四点透视 角度 旋转4.检测矩形轮廓 角度 旋转参考 背景 遇到偏的图片想要校正成水平或者垂直的。 几种校正方法 对于倾斜的图片通过矫正可以得到水平的图片。一般有如下几种基于opencv的组合方…

【前端】vscode javascript 代码片段失效问题解决

1. 文件--首选项--用户代码片段-vue.json : 添加 // { // // Place your global snippets here. Each snippet is defined under a snippet name and has a scope, prefix, body and // // description. Add comma separated ids of the languages where the snippet is app…