WPF视频学习-基础知识篇

1.简介WPF:

C# 一套关于windows界面应用开发框架

2.WPF和winform的差别

,(WPF比较新)
创建新项目使用模板:在这里插入图片描述
WPF使用.xaml后缀,双击可查看操作界面和设置代码,其文件展开之后中有MainWindow.xaml.cs为程序交互逻辑。
winform为Form.cs,双击可进入交互逻辑界面编写,其文件展开之后下层中有Form1.Designal.cs包含 Windows 窗体设计器生成的代码,可进行查看。

界面效果实现的难易程度:WPF去实现:直接搜索需要的控件形式,然后把对应的代码加入即可。

WPF绑定:可以将界面上的某个属性跟流程中做绑定,可以进行同步更新

3.基础项目文件知识

生成文件目录:代码文件下bin目录下的对应的Debug/Realse
项目中用到的资源文件目录:代码文件下Properties/Resources.resx添加进去
App.xaml中可设置启动页
MainWindow.xaml为页面,可添加多个WPF窗口(例如:Window1.xaml)

4.布局控件Grid和StackPanel

(Grid需要自己手动移动控件位置,而StackPanel会自动进行堆积)
分为客户区和非客户区:
“Grid”为布局控件,在非客户区可用,为行列布局,布局可动态分配
而“StackPanel”会根据给的控件依次排列
WPF像素无关

//按行排列:
<Grid.RowDefinitions>
    <RowDefinition Height="20"/>	 <!--同时设置宽度-->
    <RowDefinition Height="20"/>    <!--多增加一行-->
    <RowDefinition/>
</Grid.RowDefinitions>

//按列排列
<Grid ShowGridLines="True" Grid.Row="2" Grid.Column="0">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="70"/>
        <ColumnDefinition/>
    </Grid.ColumnDefinitions>
</Grid>

实现:
在这里插入图片描述
代码:
练习代码链接

5.Style 样式:用法介绍

可以统一设置一类控件的形式
举例:作用于所有button,在每次添加一个button时,会自动调用这个样式

<Window.Resources>
    <Style TargetType="Button">     <!--作用于button-->
        <Setter Property="Background" Value="Red"/>
        <Setter Property="FontSize" Value="20"/>
        <Setter Property="Height" Value="50"/>

    </Style>
</Window.Resources>

【样式多样性】,在想要使用样式时才使用

<Window.Resources>
<Style x:Key="LoginStyle" TargetType="Button">
    <Setter Property="Background" Value="Green"/>
    <Setter Property="FontSize" Value="20"/>
    <Setter Property="Height" Value="50"/>
</Style>

<Style x:Key="QuitStyle" TargetType="Button">
    <Setter Property="Background" Value="Green"/>
    <Setter Property="FontSize" Value="20"/>
    <Setter Property="Height" Value="50"/>
</Style>
</Window.Resources>

//使用
<Grid>
    <StackPanel>
        <Button Style="{StaticResource LoginStyle}"  Content="登录" />    <!--定向使用-->
        <Button Style="{StaticResource QuitStyle}" Content="退出" />      <!--定向使用-->
        <Button Content="忘记密码"  />

    </StackPanel>

</Grid>


在这里插入图片描述
【另一种形式:先定义button使用的基础样式,在基于这个基础的样式定义个性化的样式】

<Style TargetType="Button">
    <Setter Property="Background" Value="WhiteSmoke"/>
    <Setter Property="FontSize" Value="20"/>
    <Setter Property="Margin" Value="20,10"/>
</Style>

<!--延用之前的统一style,创建新的style-->
<Style x:Key="loginStyle" TargetType="Button" BasedOn="{StaticResource {x:Type Button}}">
    <Setter Property="Background" Value="Green"/>
    
</Style>

<!--延用之前的统一style,创建新的style-->
<Style x:Key="QuitStyle" TargetType="Button" BasedOn="{StaticResource {x:Type Button}}">
    <Setter Property="Background" Value="Red"/>

</Style>

//样式使用时跟上面举例是相同的

【style外部引用】:方便管理,可以供所有的界面去使用
1.添加资源字典的类BaseButtonStyleDictionary1,把想要全局使用的style加在这里

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">


    <!--//把之前写下style的复制到这里来-->
    <Style TargetType="Button">
        <Setter Property="Background" Value="WhiteSmoke"/>
        <Setter Property="FontSize" Value="20"/>
        <Setter Property="Margin" Value="20,10"/>
    </Style>
	.........

</ResourceDictionary>

2.把创建的BaseButtonStyleDictionary1加入到App.xaml中,成为全局可识别变量

<Application.Resources>
    
    <!--//加入资源字典-->
    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>
            <ResourceDictionary Source="/WpfApp1;component/BaseButtonStyleDictionary1.xaml"/>
        </ResourceDictionary.MergedDictionaries>
    </ResourceDictionary>
     
</Application.Resources>

3.在下面的窗口MainWindow.xaml等文件中,正常Style引用即可识别

6.自定义按钮以及设置触发器

自定义模板:例如之前的圆角按钮

<Button Width="300" Height="100" Content="自定义按钮" Background="#0078d4" FontSize="50" Foreground="White">
    <Button.Template>
        <ControlTemplate TargetType="{x:Type Button}">
            <Border Background="Red" BorderBrush="Black" BorderThickness="4" CornerRadius="10">
                <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
            </Border>

        </ControlTemplate>
    </Button.Template>
</Button>

生成圆角按钮:
在这里插入图片描述
但第一行设置的会被覆盖掉。后面值设为可改,与原始按钮设置的值相同,进行同步更改不会进行覆盖:,以及触发器的部分

<Button.Template>
    <ControlTemplate TargetType="{x:Type Button}">
        <Border x:Name="boder" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" 
                BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="10">
            <!--<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>-->
            <TextBlock x:Name="txtContent" Text="{TemplateBinding Content}" HorizontalAlignment="Center" VerticalAlignment="Center"/>
        </Border>

        <!--//触发器设置-->
        <ControlTemplate.Triggers>
            <Trigger Property="IsMouseOver" Value="True" >
                <!--//当鼠标移入则启动触发操作-->
                <Setter TargetName="boder" Property="Background" Value="black"/>
                <Setter TargetName="txtContent" Property="FontSize" Value="100"/>
            </Trigger>

            <Trigger Property="IsPressed" Value="True" >
                <!--//当鼠标点击则启动触发操作-->
                <Setter TargetName="boder" Property="Background" Value="white"/>
            </Trigger>
        </ControlTemplate.Triggers>

    </ControlTemplate>
</Button.Template>

7.C#代码事件

界面上的的操作都跟相应的C#代码对应执行
增加界面点击事件,直接在按钮创建的时候添加Click=“Button_Click_1” ,

<Button Content="你好" Width="200" Height="30" Click="Button_Click_1" HorizontalAlignment="Center" VerticalAlignment="Center"/>    

则进入对应的.xaml.cs则可看见自动创建了

private void Button_Click_1(object sender, RoutedEventArgs e)
{

}

在其中增加时间处理的流程

<StackPanel>
    <TextBlock x:Name="txtTotal" Text ="计算结果" Visibility="Hidden"/>
    <Button Content="你好" Width="200" Height="30" Click="Button_Click_1" HorizontalAlignment="Center" VerticalAlignment="Center"/>
    
</StackPanel>
private void Button_Click_1(object sender, RoutedEventArgs e)
{
    int num1 = 200;
    int num2 = 300;
    int total = num1 + num2;
    txtTotal.Text = total.ToString();
    //更改枚举类型(ctrl + “J”)会默认进行代码提示
    txtTotal.Visibility = Visibility.Visible;
}

查看所有的事件:点击控件之后有属性界面,点击【⚡】标识符可查看所有信号。且进入该信号边界可显示该信号内容,双击则可自动生成对应执行函数。
在这里插入图片描述
例如:鼠标移入和鼠标移出的事件

//鼠标移入控件范围内
private void Button_MouseEnter(object sender, MouseEventArgs e)
{
    txtTotal.Text = "你的鼠标进入button的范围了";
}

//鼠标移出控件范围内
private void Button_MouseLeave(object sender, MouseEventArgs e)
{
    txtTotal.Text = "你的鼠标移出button的范围了";
}

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

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

相关文章

1.Vue2使用ElementUI-初识及环境搭建

目录 1.下载nodejs v16.x 2.设置淘宝镜像源 3.安装脚手架 4.创建一个项目 5.项目修改 代码地址&#xff1a;source-code: 源码笔记 1.下载nodejs v16.x 下载地址&#xff1a;Node.js — Download Node.js 2.设置淘宝镜像源 npm config set registry https://registry.…

Python实现连连看9

&#xff08;2&#xff09;标识选中的图片 在判断出玩家选中的是哪一张图片之后&#xff0c;接下来就可以标识选中的图片了&#xff0c;即在该选中的图片外围画矩形。代码如下所示。 FIRSTCLICK True #FIRSTCLICK是全局变量 if(click_col>0 and click_row>0) and \(no…

GUI编程-01

组件 窗口 弹窗 面板 文本框 列表框 按钮 图片 监听事件 鼠标 键盘事件 破解工具 Java提供了丰富的图形用户界面&#xff08;Graphics User Interface&#xff0c;GUI&#xff09;的类库&#xff0c;基于这些类库可以编写窗口程序。 Java关于图形界面的类库主要放在…

uniapp自定义的下面导航

uniapp自定义的下面导航 看看效果图片吧 文章目录 uniapp自定义的下面导航 看看效果图片吧 ![在这里插入图片描述](https://img-blog.csdnimg.cn/direct/6aa0e964741d4dd3a58f4e86c4bf3247.png) 前言一、写组件、我这里就没有写组件了直接写了一个页面&#xff1f;总结 前言 在…

JWT 快速入门

什么是 JWT JSON Web Token&#xff08;JWT&#xff09;是目前最流行的跨域身份验证解决方案 JSON Web Token Introduction - jwt.ioLearn about JSON Web Tokens, what are they, how they work, when and why you should use them.https://jwt.io/introduction 一、常见会…

Vue13-计算属性的简写

一、计算属性的简写 注意&#xff1a; 当计算属性只有get&#xff0c;没有set的时候&#xff0c;才能用简写形式&#xff01;&#xff01;&#xff01;

端午与高考的交汇点:家的温暖与梦想的起点

当端午节的粽香弥漫在街头巷尾&#xff0c;高考的脚步也悄然而至。这两个看似毫无关联的时刻&#xff0c;却在每年的六月&#xff0c;奇妙地交汇在一起&#xff0c;为我们带来了一段特别的记忆。这不仅是家的温暖与梦想的起点相遇的时刻&#xff0c;更是传统文化与现代追求共融…

Rust-06-所有权

所有权&#xff08;系统&#xff09;是 Rust 最为与众不同的特性&#xff0c;它让 Rust 无需垃圾回收即可保障内存安全&#xff0c;下面是所有权以及相关功能&#xff1a;借用&#xff08;borrowing&#xff09;、slice 以及 Rust 如何在内存中布局数据。 通过所有权系统管理内…

Java版工程项目管理平台:以源码驱动,引领工程企业数字化转型

在当今数字化时代&#xff0c;随着企业的扩张和业务的增长&#xff0c;传统的工程项目管理方法已显不足。为了提升管理效率、减轻工作负担、增强信息处理的快速性和精确度&#xff0c;工程企业亟需借助数字化技术进行转型升级。本文将向您展示一款基于Spring Cloud、Spring Boo…

当前主流的App开发技术综述

一、引言 随着移动互联网的蓬勃发展&#xff0c;App&#xff08;应用程序&#xff09;已经成为人们日常生活中不可或缺的一部分。无论是社交、购物、娱乐还是工作学习&#xff0c;App都以其便捷、高效和个性化的特点深受用户喜爱。而在这一过程中&#xff0c;App开发技术也在不…

MFC 教程-文本框失去焦点处理

【1】增加窗口的消息处理函数 void CTESTMFCDlg::OnKillFocus(CWnd* pNewWnd) {//CDialogEx::OnKillFocus(pNewWnd);//首先使用true将数据从控件传入成员变量中UpdateData(true);//校验成员变量m_data中的数据是否符合要求&#xff0c;如果不符合&#xff0c;修改后将它显示在控…

访问网站时IP被阻止?原因及解决方法

在互联网上&#xff0c;用户可能会面临一个令人困扰的问题——当尝试访问某个特定的网站时&#xff0c;却发现自己的IP地址被该网站屏蔽。 IP地址被网站屏蔽是一个相对常见的现象&#xff0c;而导致这种情况的原因多种多样&#xff0c;包括恶意行为、违规访问等。本文将解释IP地…

转让北京公司带旅行许可证流程和要求

旅行社是开展旅游服务业务的专项经济主体&#xff0c;旅行社开展相关业务必须持有旅行社业务经营许可证。该资质又分为国内旅行社经营许可证和出境旅行社经营许可证。主要区别在于能否开展出境旅游业务&#xff0c;下面老耿带大家了解&#xff0c;新成立国内旅行社要求及出境旅…

Git之解决重复输入用户名和密码(三十九)

简介&#xff1a; CSDN博客专家&#xff0c;专注Android/Linux系统&#xff0c;分享多mic语音方案、音视频、编解码等技术&#xff0c;与大家一起成长&#xff01; 优质专栏&#xff1a;Audio工程师进阶系列【原创干货持续更新中……】&#x1f680; 优质专栏&#xff1a;多媒…

【CS.CN】深入探讨下HTTP的Connection头:通过keep-alive实现高效网络连接

文章目录 0 序言0.1 由来0.2 使用场景0.3 现在还需要吗&#xff1f; 1 Connection: keep-alive的机制2 语法 && 通过设置Connection: keep-alive优化性能3 验证与性能提升4 总结References 0 序言 0.1 由来 Connection头部字段在HTTP/1.1中被引入&#xff0c;主要用于…

React的useState的基础使用

import {useState} from react // 1.调用useState添加状态变量 // count 是新增的状态变量 // setCount 修改状态变量的方法 // 2.添加点击事件回调 // userState实现计数实例import {useState} from react// 使用组件 function App() {// 1.调用useState添加状态变量// coun…

ChatTTS增强版V2,批量导出srt,语速控制,情感控制,支持朗读数字,问题修复

ChatTTS增强版最新版本已经发布&#xff0c;本次更新我主要增加了多文本批量、SRT导出、语速控制、情感控制、停顿控制等新功能&#xff0c;并针对上一版本中存在的数字读音异常、随机uv_break等问题进行了修复。 视频版本 【ChatTTS增强版V2&#xff0c;批量导出srt&#xff…

基于C#的计算机与安捷伦34970A通信方法

概述 安捷伦34970A采集数据&#xff0c;34970A支持RS232接口&#xff0c;但是如果直接用winform自带的seriaport类基本是没必要使用的&#xff0c;安捷伦等仪表通讯需要用到VISA的库。 库的获取 1. 是德科技的IO Library. 2. NI下载NI-VISA. 两者用法接近. 代码如下 using…

数据库安全加固与API防护策略

在数字化时代&#xff0c;数据库作为企业核心资产的安全性至关重要。然而&#xff0c;随着网络攻击手段的不断演进&#xff0c;数据库和API接口成为了黑客的主要攻击目标。本文将探讨数据库被攻击、API接口被滥用的情况&#xff0c;并提供一系列实用的防护措施&#xff0c;旨在…

JSP中连接数据库MySQL

JSP中连接数据库MySQL 一、软件环境 下载并安装MySQL&#xff0c;Tomacat&#xff0c;JDBC、IDEA或其他IDE&#xff0c;本文使用IDEA 二、环境配置 将其环境变量配置好之后&#xff0c;下载Java 专用的连接MySQL的驱动包JDBC。 下载链接&#xff1a;https://dev.mysql.com/…