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

news2024/12/25 1:11:04

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

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

设计模式之迭代器模式(Iterator)的C++实现

1、迭代器模式的提出 在软件开发过程中&#xff0c;操作的集合对象内部结构常常变化&#xff0c;在访问这些对象元素的同时&#xff0c;也要保证对象内部的封装性。迭代器模式提供了一种利用面向对象的遍历方法来遍历对象元素。迭代器模式通过抽象一个迭代器类&#xff0c;不同…

list使用

list的使用于string的使用都类似&#xff0c;首先通过查阅来看list有哪些函数&#xff1a; 可以看到函数还是蛮多的&#xff0c;我们值重点一些常用的和常见的&#xff1a; 1.关于push_back,push_front,和对应迭代器的使用 //关于push_back和push_front void test_list1() {l…

算法通关村——字符串反转问题解析

1. 反转字符串 反转字符串 编写一个函数&#xff0c;其作用是将输入的字符串反转过来。输入字符串以字符数组 s 的形式给出。 不要给另外的数组分配额外的空间&#xff0c;你必须原地修改输入数组、使用 O(1) 的额外空间解决这一问题。 1.1 交换 这一题的思路还是简单的&…

Flink状态和状态管理

1.什么是状态 官方定义&#xff1a;当前计算流程需要依赖到之前计算的结果&#xff0c;那么之前计算的结果就是状态。 这句话还是挺好理解的&#xff0c;状态不只存在于Flink&#xff0c;也存在生活的方方面面&#xff0c;比如看到一个认识的人&#xff0c;如何识别认识呢&am…

程序的编译流程

程序的编译过程大致可以分为以下几个阶段

八大排序算法 - Java实现

冒泡排序 排序原理&#xff1a; 比较相邻的元素。如果前一个元素比后一个元素大&#xff0c;就交换这两个元素的位置。对每一对相邻元素做同样的工作&#xff0c;从开始第一对元素到结尾的最后一对元素。最终最后位置的元素就是最大值 代码实现&#xff1a; import java.uti…

图神经网络学习

入门 目的&#xff1a;训练一个图模型&#xff0c;使得该图模型可以区分图上的黄色节点和绿色节点。 特征作为图的节点&#xff0c;颜色就是图的分类。 图的度的概念&#xff1a;与节点相连的条数。 邻接表记录的是后续邻居的信息&#xff1b; 在新闻推荐中&#xff0c;节点是…

2021年09月 C/C++(三级)真题解析#中国电子学会#全国青少年软件编程等级考试

第1题&#xff1a;余数相同问题 已知三个正整数 a&#xff0c;b&#xff0c;c。 现有一个大于1的整数x&#xff0c;将其作为除数分别除a&#xff0c;b&#xff0c;c&#xff0c;得到的余数相同。 请问满足上述条件的x的最小值是多少? 数据保证x有解。 输入 一行&#xff0c;三…

微服务中间件--Nacos

Nacos 1. Nacos入门a.服务注册到Nacosb.Nacos服务分级存储模型c.NacosRule负载均衡d.服务实例的权重设置e.环境隔离 - namespacef.Nacos和Eureka的对比 2. Nacos配置管理a.统一配置管理b.配置热更新c.多环境配置共享 1. Nacos入门 Nacos是阿里巴巴的产品&#xff0c;现在是Spr…

【前端|JS实战第1篇】使用JS来实现属于自己的贪吃蛇游戏!

前言 贪吃蛇游戏是经典的小游戏&#xff0c;也是学习前端JS的一个很好的练习项目。在本教程中&#xff0c;我们将使用 JavaScript 来逐步构建一个贪吃蛇游戏。我们会从创建游戏区域开始&#xff0c;逐步添加蛇的移动、食物的生成以及游戏逻辑等功能。 &#x1f680; 作者简介&a…

tcl学习之路(五)(Vivado时序约束)

1.主时钟约束 主时钟通常是FPGA器件外部的板机时钟或FPGA的高速收发器输出数据的同步恢复时钟信号等。下面这句语法大家一定不会陌生。该语句用于对主时钟的名称、周期、占空比以及对应物理引脚进行约束。 create_clock -name <clock_name> -periood <period> -wa…

电影《孤注一掷》感触、计算机底层二进制与十进制的转换

今天&#xff0c;我与媳妇一同在商场吃完午餐&#xff0c;正值天空绵绵细雨。近期&#xff0c;听闻一部名为《孤注一掷》的电影&#xff0c;其主人公是一位程序员&#xff0c;故事情节围绕境外电信诈骗展开&#xff0c;引发了广泛的关注。身为一名程序员&#xff0c;我对与电信…

DSO 系列文章(2)——DSO点帧管理策略

文章目录 1.点所构成的残差Residual的管理1.1.前端残差的状态1.2.后端点的残差的状态1.3.点的某个残差的删除 2.点Point的管理2.1.如何删除点——点Point的删除2.2.边缘化时删除哪些点&#xff1f; 3.帧FrameHessian的管理 DSO代码注释&#xff1a;https://github.com/Cc19245/…

Vulnhub: DriftingBlues: 2靶机

kali&#xff1a;192.168.111.111 靶机&#xff1a;192.168.111.207 信息收集 端口扫描 nmap -A -sC -v -sV -T5 -p- --scripthttp-enum 192.168.111.207 80端口的/blog目录为wordpress wpscan收集wordpress用户和爆破密码 wpscan --url http://driftingblues.box/blog -e…

深入理解Linux内核--回收页框

页框回收算法 Linux中有一点很有意思&#xff0c;在为用户态进程与内核分配动态内存时&#xff0c;所作的检查是马马虎虎的。 比如&#xff0c;对单个用户所创建进程的RAM使用总量并不作严格检查(第三章的“进程资源限制”一节提到的限制只针对单个进程); 对内核使用的许多磁盘…

【数据结构】链表的回文结构

文章目录 &#x1f30f;引言&#x1f9ed;[链表的回文结构](https://www.nowcoder.com/practice/d281619e4b3e4a60a2cc66ea32855bfa?tpId49&&tqId29370&rp1&ru/activity/oj&qru/ta/2016test/question-ranking)&#x1f6a9;&#x1f6a9;题目描述&#xf…

学习网络编程No.3【socket理论实战】

引言&#xff1a; 北京时间&#xff1a;2023/8/12/15:32&#xff0c;自前天晚上更新完文章&#xff0c;看了一下鹅厂新出的《扫毒3》摆烂至现在&#xff0c;不知道是长大了&#xff0c;还是近年港片就那样&#xff0c;给我的感觉不是很好&#xff0c;也可能是国内市场对港片不…

XXL-JOB任务调度中心后台命令执行漏洞

漏洞描述 XXL-JOB任务调度中心后台存在命令执行漏洞,攻击者可在后台通过写入shell命令任务调度获取服务器控制权限 免责声明 技术文章仅供参考,任何个人和组织使用网络应当遵守宪法法律,遵守公共秩序,尊重社会公德,不得利用网络从事危害国家安全、荣誉和利益,未经授权…

AndroidAGP8.1.0和JDK 17迁移之旅

AndroidAGP8.1.0和JDK 17迁移之旅 前言&#xff1a; 由于我最近写demo的直接把之前的项目从AGP4.2.2升级到8.1.0引发了一些列问题&#xff0c;这里记录一下&#xff0c;前面讲解过迁移DSL方式遇到的问题&#xff0c;这次升级8.1.0也比之前顺利多了&#xff0c;想看DSL迁移的可…

Edge浏览器免费使用GPT3.5

搜索sider,安装Sidebar插件 注册账号即可每天免费使用30次。 Sider: ChatGPT侧边栏,GPT-4, 联网, 绘图