介绍

NanUI是一套桌面开发框架,最终输出的是exe桌面程序,但运行的内容是BS页面的内容。
解决了CS界面不容易输出很美观界面的问题。
官网说明:

这是一个开放源代码的 .NET / .NET Core 窗体应用程序(WinForms)界面组件。您可以使用 HTML5 / CSS3 / Javascript 等前端技术来构建您的应用程序界面。主流的Javascript框架,比如Angular, React, Vue都是可以用来构架SPA应用的明智选择。使用 NanUI 界面组件将给您的窗体设计工作带来无限可能。

官网
https://www.formium.net/

国内gitee源码
https://gitee.com/linxuanchen/NanUI
中文使用说明,官方的,讲的很清楚
https://gitee.com/linxuanchen/NanUI/blob/master/docs/zh-CN/README.md

github源码
https://github.com/NetDimension/NanUI

教程
知乎:

使用说明

以下代码是基于0.8这个版本的。
NanUI 版本:

  • Chromium 80.0.3987.163
  • NanUI 0.8.80.120

新建一个winform项目

在这里插入图片描述
在这里插入图片描述

1.安装包

把这下面前两个都安装了。
在这里插入图片描述

在这里插入图片描述

修改代码

在这里插入图片描述

修改progrome.cs文件

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using System.Windows.Forms;
using NetDimension.NanUI;

namespace WindowsFormsApp1
{
    static class Program
    {
        static void Main()
        {
            // ...
            WinFormium.CreateRuntimeBuilder(env => {

                env.CustomCefSettings(settings =>
                {
                    // 在此处设置 CEF 的相关参数
                });

                env.CustomCefCommandLineArguments(commandLine =>
                {
                    // 在此处指定 CEF 命令行参数
                });

            }, app =>
            {
                // 指定启动窗体
                app.UseMainWindow(context => new MainWindow());
            })
            .Build()
            .Run();
        }
    }
}

新建一个class文件
在这里插入图片描述
在这里插入图片描述
代码

using NetDimension.NanUI;
using NetDimension.NanUI.HostWindow;

class MainWindow : Formium
{
    // 设置窗体样式类型
    public override HostWindowType WindowType => HostWindowType.System;
    // 指定启动 Url
    public override string StartUrl => "https://www.formium.net";

    public MainWindow()
    {
        // 在此处设置窗口样式
        Size = new System.Drawing.Size(1024, 768);
    }

    protected override void OnReady()
    {
        // 在此处进行浏览器相关操作

        //ShowDevTools();
        //ExecuteJavaScript("alert('Hello NanUI')");
    }
}

运行

先出现遮罩层
在这里插入图片描述
然后是运行的网页。
在这里插入图片描述

总结

问题一:打包文件太大


一个demo大小290M,真不小啊。
不过也可以接受。
根据与作者沟通,这个包同时包含x86和x64,所以大一些,实际操作时可以分开打两个包,就会小一些。

问题二:启动有遮罩层

遮罩层可以在代码中自定义或者关闭。

Mask对象,里面有Image属性可以改启动图片,BackColor属性改颜色,Content可以添加子控件
AutoShowMask为false那么就不在启动时显示启动遮罩层

上面是作者的回复,但那个AutoShowMask为false,我暂时没有操作成功。Mask代码如下

    public MainWindow()
    {
        // 在此处设置窗口样式
        Size = new System.Drawing.Size(1024, 768);
        AutoShowMask = false;
        //AllowFullScreen = true;

        Mask.BackColor = System.Drawing.Color.Green;

        Trace.WriteLine(StartUrl);        
    }
Logo

前往低代码交流专区

更多推荐