当前位置 : 主页 > 编程语言 > 其它开发 >

使用Blazor开发WinForm程序

来源:互联网 收集:自由互联 发布时间:2022-05-30
1. 关于Blazor Blazor是微软出品的前端框架,对标谷歌的Flutter,用C#、css、html语言开发前端UI,组件化设计,支持嵌套组件与大多数前端框架react、vue等类似,不同的是开发语言不是JavaSc
1. 关于Blazor

Blazor是微软出品的前端框架,对标谷歌的Flutter,用C#、css、html语言开发前端UI,组件化设计,支持嵌套组件与大多数前端框架react、vue等类似,不同的是开发语言不是JavaScript,但是它可以与JavaScript互操作。Host模式支持Blazor Server、Blazor WebAssembly和Blazor Hybrid(MAUI、WPF、WinForm),可用它来开发Web、移动App、桌面应用。

2.创建WinForm步骤
  1. 打开VS2022,创建新项目,选择Windows窗体应用,将工程文件sdk改成 Microsoft.NET.Sdk.Razor

  2. 添加 NuGet 包 Web 和 WebView.WindowsForms,创建后的工程文件如下:

    <Project Sdk="Microsoft.NET.Sdk.Razor">
      <PropertyGroup>
        <OutputType>WinExe</OutputType>
        <TargetFramework>net6.0-windows</TargetFramework>
        <Nullable>enable</Nullable>
        <UseWindowsForms>true</UseWindowsForms>
        <ImplicitUsings>enable</ImplicitUsings>
      </PropertyGroup>
      <ItemGroup>
        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="6.0.3" />
        <PackageReference Include="Microsoft.AspNetCore.Components.WebView.WindowsForms" Version="6.0.101-preview.11.2349" />
      </ItemGroup>
    </Project>
    
  3. 添加 wwwroot 文件夹,添加 index.html 和 css/app.css

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>WinApp</title>
        <base href="/" />
        <link href="css/font-awesome.css" rel="stylesheet" />
        <link href="css/app.css" rel="stylesheet" />
        <link href="WinApp.styles.css" rel="stylesheet" />
    </head>
    <body>
        <div id="app">Loading...</div>
        <div id="blazor-error-ui">
            An unhandled error has occurred.
            <a href="" class="reload">Reload</a>
            <a class="dismiss"> 
上一篇:云原生监控体系建设
下一篇:没有了
网友评论