【愚公系列】2023年10月 WPF+上位机+工业互联 001-桌面应用开发思维转变

本文介绍了WPF(Windows Presentation Foundation)作为.NET Framework的桌面应用程序界面设计框架,及其在桌面应用开发思维转变中的作用。讨论了WPF的应用场景,如桌面应用、数据可视化和游戏界面设计等。深入讲解了WPF的界面渲染机制,包括使用DirectX进行矢量图形绘制和硬件加速。最后,阐述了WPF的三层体系结构和基本控件集合类,以及简单的WPF案例,如主窗口、ViewModel模型类和命令类。

在这里插入图片描述

🏆 作者简介,愚公搬代码
🏆《头衔》:华为云特约编辑,华为云云享专家,华为开发者专家,华为产品云测专家,CSDN博客专家,阿里云专家博主,腾讯云优秀博主,掘金优秀博主,51CTO博客专家等。
🏆《近期荣誉》:2022年CSDN博客之星TOP2,2022年华为云十佳博主等。
🏆《博客内容》:.NET、Java、Python、Go、Node、前端、IOS、Android、鸿蒙、Linux、物联网、网络安全、大数据、人工智能、U3D游戏、小程序等相关领域知识。
🏆🎉欢迎 👍点赞✍评论⭐收藏


🚀前言

桌面应用程序是指在个人计算机(PC)或笔记本电脑(Laptop)等设备本地运行的应用程序,与网络或云服务无关。这些应用程序通常需要在操作系统上安装并占用计算机的一部分资源。

具体桌面应用程序的框架有很多种,以下是一些常见的框架:

  1. Java框架:Java桌面应用程序可以使用JavaFX或Swing框架。JavaFX提供了一个现代化的图形用户界面和矢量图形操作,而Swing则提供了一个传统的图形用户界面和大量的组件类库。

  2. .NET框架:.NET桌面应用程序主要使用Windows Forms或WPF框架。Windows Forms提供基于Win32API的GUI控件,而WPF提供了更现代、更灵活的GUI控件和可扩展性。

  3. Electron框架:Electron桌面应用程序使用JavaScript、HTML和CSS开发,可以让开发者使用Web技术开发出本地应用程序并在不同平台上运行。

  4. QT框架:QT桌面应用程序使用C++编写,提供了一套丰富的GUI组件库和一些便于跨平台开发的工具。

桌面应用程序框架的选择取决于开发者的技术背景和应用程序的需求。不同的框架有不同的优势和限制,开发者需要根据实际情况进行选择。

🚀一、桌面应用开发思维转变

🔎1.WPF框架以及应用场景

WPF源码网址:https://github.com/dotnet/wpf

在这里插入图片描述

WPF (Windows Presentation Foundation)是微软推出的一种基于.NET Framework的桌面应用程序界面设计框架。它能够使用XAML (eXtensible Application Markup Language)语言创建高质量的、富有交互性的Windows客户端应用程序界面,同时还支持通过数据绑定实现界面与数据的分离,提高了程序开发的效率和可维护性。

WPF的应用场景包括:

  1. 桌面应用程序的开发:WPF提供了丰富的控件库和可自定义样式的界面设计语言,能够帮助开发者快速构建富有交互性的、美观的桌面应用程序。

  2. 数据可视化:WPF支持数据绑定,能够将数据直接绑定到UI元素上,实现数据的实时展示和交互操作,因此在数据可视化方面应用广泛。

  3. 游戏界面设计:WPF提供了支持3D渲染的工具和控件,能够帮助游戏开发者实现游戏的界面设计和效果展示。

  4. 内部管理系统:企业内部管理系统往往需要高度定制化的界面,WPF能够帮助企业开发者快速构建满足特定需求的管理系统。

  5. 独立应用程序:WPF可以帮助开发者将应用程序打包成独立的可执行文件,方便用户下载和部署。

🔎2.从桌面应用到WPF的界面渲染

WPF(Windows Presentation Foundation)使用DirectX作为其界面渲染引擎,因此其具有强大的绘图和动画功能,且支持3D效果。WPF使用矢量图形来绘制界面,而非像素图像,这意味着WPF应用程序可以在任何分辨率下都能呈现出清晰的图像,而且可以无缝缩放。在渲染WPF界面时,它会根据布局信息和样式设置,将元素组合成一张完整的界面图像,并通过DirectX进行渲染。WPF还支持硬件加速,可大大提高界面的渲染性能。

WPF的界面渲染和逻辑处理是分离的,这是WPF的一个重要特性。WPF将UI控件和逻辑处理分别封装在不同的类中,开发人员可以自由组合和重用这些类。通过这种方式,WPF可以实现高度可定制化的界面,同时保持逻辑处理的清晰和简洁。

WPF应用程序的逻辑处理使用C#或其他.NET语言编写,可以使用面向对象的编程模式。它支持使用MVVM(Model-View-ViewModel)模式,通过ViewModel来实现逻辑处理和数据绑定,从而使代码更加清晰和易于维护。

WPF的界面渲染和逻辑处理的分离还提供了一些优势。例如,它允许WPF应用程序在不同的线程上并行执行逻辑处理和界面渲染,从而提高应用程序的性能和响应速度。此外,它还使得WPF应用程序可以更容易地实现MVVM模式和测试驱动开发(TDD)。

🔎3.WPF体系结构

WPF(Windows Presentation Foundation)是一种用于创建 Windows 用户界面的框架,是一个基于 .NET 的桌面应用程序开发技术。它提供了一种新的方式来创建用户界面,使用 XAML(Extensible Application Markup Language)语言来进行界面设计,并通过 .NET 中的代码与界面进行交互。

WPF 的体系结构如下:

  1. 应用程序:WPF 应用程序是基于 .NET 框架的应用程序,集成了 WPF 的功能模块和组件,提供了一个界面来与用户交互。

  2. 用户界面:WPF 用户界面是用 XAML 定义的,它包含了窗口、控件、布局和样式等元素。

  3. 窗口:WPF 窗口是用于承载用户界面的容器,除了标准的窗口外,还有可以自定义、透明、无边框等不同类型的窗口。

  4. 控件:WPF 中提供了大量的控件,包括文本框、按钮、菜单、列表框等,这些控件可以用于构建用户界面。

  5. 布局:WPF 中提供了多种布局方式,例如 Grid、StackPanel、WrapPanel 等,可以用于管理和排列控件。

  6. 样式:WPF 的样式和模板是用来定义控件的外观和行为的,可以提供整个应用程序的一致性外观。

  7. 事件:WPF 的事件模型非常强大,可以使开发人员轻松地订阅和处理事件。

  8. 数据绑定:WPF 中的数据绑定允许开发人员将数据与界面元素进行关联,从而实现 UI 的自动更新和更高效的开发。

  9. 图形和动画:WPF 中的图形和动画支持矢量图形、3D 图形和高级动画等,可以用于创建复杂的可视化效果。

WPF 的体系结构是一个高度可扩展和灵活的框架,它提供了丰富的功能,可以用于开发各种类型的应用程序。

🦋3.1 三层体系结构

PresentationFramework:用于在WPF(Windows Presentation Foundation)应用程序中开发图形用户界面(GUI)的库。

PresentationCore:一个库,为开发WPF应用程序提供核心服务,如渲染、输入和媒体服务。

WindowsBase:一个库,为WPF和其他基于Windows的应用程序提供基本的Windows操作系统服务。

mllcore:在基于Windows的应用程序中提供多媒体相关服务的库,例如媒体文件的解码和播放。

WindowsCodecs:一个库,为基于Windows的应用程序中的图像处理和文件格式提供支持。

Direct3D:一种图形API(应用程序编程接口),用于在基于Windows的应用程序中开发3D图形应用程序。

User32:在基于Windows的应用程序中提供低级用户界面服务的库,如窗口管理、消息传递和输入处理。

在这里插入图片描述

🦋3.2 基本控件集合类

DispatcherObject:一个对象,它有一个与 WPF 线程相关联的 Dispatcher,可用于将操作放入适当的线程上下文中执行。

DependencyObject:一个基类,它提供了依赖属性的支持,使对象能够与应用程序中的其他对象进行数据绑定。

Visual:一种类型的对象,它表示 WPF 中的可视元素,如图形、文本和 multmedia。

UIElement:表示可视元素的基类,可通过它接收输入、处理命令、渲染和布局

FrameworkElement:是 UIElement 的子类,它增加了数据绑定、样式、模板、布局和其他功能。

Shape:表示可渲染的图形元素,如直线、矩形、椭圆和路径。

Control:表示可包含可视化内容的基本控件,如 Button、TextBox、CheckBox 等。

ContentControl:表示具有单个可视化子元素的控件,如 Label、Button 等。

ItemsControl:表示具有可多次重复的子元素的控件,如 ListBox、TabControl、TreeView 等。

Panel:将子元素按照特定的布局进行排列的控件,如 StackPanel、Grid、DockPanel 等。

在这里插入图片描述

🚀二、WPF简单案例

🔎1.主窗口

<Window x:Class="Zhaoxi.WPFStudy.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:Zhaoxi.WPFStudy"
        mc:Ignorable="d" FontSize="30"
        Title="{Binding Title}" Height="450" Width="800">
    <Grid>
        <StackPanel>
            <TextBox Height="30" VerticalAlignment="Top" Background="Orange" Margin="10"
                 Text="{Binding TB1Model.Text,UpdateSourceTrigger=PropertyChanged}" TextChanged="TextBox_TextChanged"/>
            <TextBox Height="30" VerticalAlignment="Top" Margin="10"
                 Text="{Binding TB2Model.Text,UpdateSourceTrigger=PropertyChanged}"/>
        </StackPanel>
        <Button HorizontalAlignment="Left" 
                Margin="35,82,0,0"  Width="{Binding BModel.Width}"
                VerticalAlignment="Top" Command="{Binding ClickCommand}">
            <TextBlock Text="{Binding BModel.Text}"/>
        </Button>
    </Grid>
</Window>

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace Zhaoxi.WPFStudy
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();

            this.DataContext = new WindowViewModel();
        }

        private void Button_Click(object sender, RoutedEventArgs e)
        {
            // 按钮的点击 
            // 移动到VM中去
            //this.tb.Text = "Hello WPF!";
            //this.tb.Foreground = Brushes.Red;
        }
    }
}

🔎2.ViewModel模型类

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading;
using System.Threading.Tasks;
using Zhaoxi.WPFStudy.Base;

namespace Zhaoxi.WPFStudy
{

    public class WindowViewModel
    {
        // 完全可以/   必须是属性
        public string Title { get; set; } = "Hello WPF";
        public TextBoxModel TB1Model { get; set; } = new TextBoxModel();
        public TextBoxModel TB2Model { get; set; } = new TextBoxModel();
        public ButtonModel BModel { get; set; } = new ButtonModel();


        //业务逻辑
        // 需要绑定给界面的命令属性
        // VM中的方法也可以绑定
        public CommandBase ClickCommand
        {
            get => new CommandBase(DoClick);
        }
        // 该命令所执行的逻辑
        private void DoClick(object obj)
        {
            // 界面上两个输入
            // 进行计算逻辑  1+2=3

            Task.Run(async () =>
            {
                while (true)
                {
                    await Task.Delay(10);
                    // this.控件.text    线程
                    // 基本属性绑定没有跨线程
                    //BModel.Text = TB1Model.Text + TB2Model.Text;
                    // UI线程中处理   影响界面的刷新

                    BModel.Text = DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss");
                }
            });
        }
    }
}

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace Zhaoxi.WPFStudy
{
    public class TextBoxModel
    {
        public string Text { get; set; } = "Zhaoxi Jovan";
    }
}

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace Zhaoxi.WPFStudy
{
    public class ButtonModel : INotifyPropertyChanged 
    {
        // alt + enter
        public event PropertyChangedEventHandler PropertyChanged;
        public int Width { get; set; } = 400;
        //public string Text { get; set; } = "点击";

        private string _text = "点击";


        public string Text
        {
            get { return _text; }
            set
            {
                _text = value;
                PropertyChanged?.Invoke(this, new PropertyChangedEventArgs("Text"));
            }
        }

    }
}

🔎3.命令类

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Input;

namespace Zhaoxi.WPFStudy.Base
{
    public class CommandBase : ICommand
    {
        public event EventHandler CanExecuteChanged;

        public bool CanExecute(object parameter)
        {
            return true;
        }

        public void Execute(object parameter)
        {
            DoExecute?.Invoke(parameter);
        }

        public Action<object> DoExecute { get; set; }

        public CommandBase(Action<object> doExecute)
        {
            DoExecute = doExecute;
        }
    }
}

🚀备注

Telerik UI for WPF是一种WPF框架,提供了许多可定制的UI控件和功能,以帮助开发人员创建专业的WPF应用程序。该框架通过提供大量的控件、布局、主题和样式,来简化WPF应用程序的开发过程,并提高应用程序的可视化质量和用户体验。Telerik UI for WPF还提供了一系列工具和技术,以增强WPF应用程序的性能和稳定性。

Telerik UI for WPF控件库包含了诸如图表、图标、数据网格、日历等更多控件。这些控件都是高度可定制化的,允许开发人员根据自己的需要进行调整和修改。此外,Telerik UI for WPF还提供了丰富的主题和样式,以帮助开发人员轻松创建现代和专业的UI界面。

Telerik UI for WPF还提供了诸如MVVM框架、数据访问库、代码编辑器等工具和技术,可以帮助开发人员更加高效地开发WPF应用程序,并提高应用程序的性能和稳定性。在WPF开发中,Telerik UI for WPF是一个非常实用和强大的工具,可以大大简化和加速WPF应用程序的开发。

Telerik UI for WPF:https://www.kendouicn.com/post/product/telerik-ui-for-wpf

在这里插入图片描述


🚀感谢:给读者的一封信

亲爱的读者,

我在这篇文章中投入了大量的心血和时间,希望为您提供有价值的内容。这篇文章包含了深入的研究和个人经验,我相信这些信息对您非常有帮助。

如果您觉得这篇文章对您有所帮助,我诚恳地请求您考虑赞赏1元钱的支持。这个金额不会对您的财务状况造成负担,但它会对我继续创作高质量的内容产生积极的影响。

我之所以写这篇文章,是因为我热爱分享有用的知识和见解。您的支持将帮助我继续这个使命,也鼓励我花更多的时间和精力创作更多有价值的内容。

如果您愿意支持我的创作,请扫描下面二维码,您的支持将不胜感激。同时,如果您有任何反馈或建议,也欢迎与我分享。

在这里插入图片描述

再次感谢您的阅读和支持!

最诚挚的问候, “愚公搬代码”

评论 17
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

愚公搬代码

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值