Winform NanUI 0.88版本 用官方源码搭建原生态开发环境
目录
一、需求
二、搭建原生开发环境
1.导入源码
2.解决源码报错
错误1
错误2
3.导入其他项目
4.官方Demo运行效果
三、创建自己的NanUI项目
1.新建项目
2.导入NanUI.Runtime扩展包
3.添加NanUI程序集的引用
4.MainIndex主界面相关代码
5.Program程序入口相关代码
6.读取本地前端文件的处理
四、测试项目效果
五、结束
一、需求
NanUI 插件确实很方便，但想改其中的需求怎么办，下面就来自己搭建NanUI 原生开发环境，在此很感谢作者免费的开源。
官方源码地址：GitHub - NetDimension/NanUI: NanUI is an open source .NET project for .NET / .NET Core developers who want to use front-end technologies such as HTML5 / CSS3 to build user interfaces for Windows Form applications.
如果下载比较慢，也可以选择码云进行下载。
二、搭建原生开发环境
1.导入源码
新建一个项目，将源码的 NetDimension.NanUI 文件夹复制到你的新建的项目中。这里先导入NetDimension.NanUI，是因为其他的插件代码，依赖这个程序集，在导入其他扩展程序集之前，请确保 NetDimension.NanUI 没有错误。
点击解决方案--->添加--->现有项目，选中NetDimension.NanUI.csproj，将NetDimension.NanUI 项目导入到你的项目中
2.解决源码报错
右键生成解决方案，这时项目会报错：
错误1
我们看看报错的地方：
public static ApplicationConfigurationBuilder UseApplicationDataDirectory(
this ApplicationConfigurationBuilder @this, string path)
{
@this.Use(builder =>
{
builder.Properties[nameof(UseApplicationDataDirectory)] = path;
return (runtime, props) =>
{
if (!props.ContainsKey(nameof(UseApplicationDataDirectory)))
{
return;
}
var path = (string)props[nameof(UseApplicationDataDirectory)];
runtime.ChromiumEnvironment.SettingConfigurations += new Action(settings =>
{
settings.CachePath = path;
settings.LogFile = Path.Combine(path, "debug.log");
});
};
}, ExtensionExecutePosition.SubProcessStartup);
return @this;
} 在ApplicationConfigurationBuilder方法的参数中，原本有一个参数叫 path，但在方法里面又申请了一个path的变量，将path改为paths即可。
public static ApplicationConfigurationBuilder UseApplicationDataDirectory(
this ApplicationConfigurationBuilder @this, string path)
{
@this.Use(builder =>
{
builder.Properties[nameof(UseApplicationDataDirectory)] = path;
return (runtime, props) =>
{
if (!props.ContainsKey(nameof(UseApplicationDataDirectory)))
{
return;
}
var paths = (string)props[nameof(UseApplicationDataDirectory)];
runtime.ChromiumEnvironment.SettingConfigurations += new Action(settings =>
{
settings.CachePath = paths;
settings.LogFile = Path.Combine(paths, "debug.log");
});
};
}, ExtensionExecutePosition.SubProcessStartup);
return @this;
} 错误2
另一个错误，和上面的错误一样，在Initialize方法里，原本就有一个args参数，这里将args改为_args即可。
var context = GetAppContext();
if (context == null)
{
context = ApplicationConfiguration.UseApplicationContext?.Invoke();
if (context != null)
{
context.ThreadExit += (_, _args) =>
{
Application.Exit();
};
}
}
3.导入其他项目
将其他的几个项目一样导入进来，包括FormiumClient
4.官方Demo运行效果
将FormiumClient设为启动项目，运行：
以上都是引入官方的Demo，下面我们自己新建一个项目吧
三、创建自己的NanUI项目
1.新建项目
点击解决方案，新建项目，注意这里要用Windows窗体应用
2.导入NanUI.Runtime扩展包
下面添加NanUI的Runtime 扩展包，这个主要是给项目生成CEF包用的，
3.添加NanUI程序集的引用
将我们项目需要用到的程序集添加进来，点击确定
新建的项目结构，如下图
4.MainIndex主界面相关代码
新建类 MainIndex
using NetDimension.NanUI;
using NetDimension.NanUI.HostWindow;
using NetDimension.NanUI.JavaScript;
using System;
using System.Drawing;
namespace WinFormsApp2
{
public class MainIndex : Formium
{
public override HostWindowType WindowType => HostWindowType.System;
//public override string StartUrl => "https://www.baidu.com/";
public override string StartUrl => "static.app.local/index.html";
#region 浏览器函数
protected override void OnReady()
{
//显示控制台
//ShowDevTools();
//注册JS方法
MapClrObjectToJavaScript();
}
private void MainIndex_BeforeClose(object sender, NetDimension.NanUI.Browser.FormiumCloseEventArgs e)
{
Console.WriteLine("[MainIndex]当浏览器关闭时");
}
private void MainIndex_LoadEnd(object sender, NetDimension.NanUI.Browser.LoadEndEventArgs e)
{
Console.WriteLine("[MainIndex]当网页加载完成时");
}
#endregion
#region 注册JS方法
private void MapClrObjectToJavaScript()
{
var obj = JavaScriptValue.CreateObject();
//示例
obj.SetValue("JsCallCSharp", JavaScriptValue.CreateFunction(args =>
{
return null;
}));
RegisterExternalObjectValue("CSharpProject", obj);
}
#endregion
public MainIndex()
{
BeforeClose += MainIndex_BeforeClose;
LoadEnd += MainIndex_LoadEnd;
Size = new Size(1280, 800);
StartPosition = System.Windows.Forms.FormStartPosition.CenterScreen;
Title = "终端";
CanMaximize = false;//不允许使用最大化界面按钮
Resizable = false;//窗体是否能够改变大小
//Mask.BackColor = Color.White;
}
}
}
5.Program程序入口相关代码
Program.cs 改为下面这样
using NetDimension.NanUI;
using NetDimension.NanUI.LocalFileResource;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using System.Windows.Forms;
namespace WinFormsApp2
{
static class Program
{
///
/// The main entry point for the application.
///
[STAThread]
static void Main()
{
//Application.SetHighDpiMode(HighDpiMode.SystemAware);
//Application.EnableVisualStyles();
//Application.SetCompatibleTextRenderingDefault(false);
//Application.Run(new Form1());
WinFormium.CreateRuntimeBuilder(env =>
{
env.CustomCefCommandLineArguments(cmdLine =>
{
// Configure command line arguments of Cef here.
//cmdLine.AppendSwitch("disable-gpu");
//cmdLine.AppendSwitch("disable-gpu-compositing");
});
env.CustomCefSettings(settings =>
{
// Configure default Cef settings here.
settings.WindowlessRenderingEnabled = true;
});
env.CustomDefaultBrowserSettings(cefSettings =>
{
// Configure default browser settings here.
});
},
app =>
{
//读取本地资源
app.UseLocalFileResource("http", "static.app.local", System.IO.Path.Combine(Application.StartupPath, "View"));
app.UseMainWindow(context =>
{
Application.EnableVisualStyles();
Application.SetCompatibleTextRenderingDefault(false);
return new MainIndex();
});
})
.Build()
.Run();
}
}
}
6.读取本地前端文件的处理
新建一个View文件夹
将你的web前端代码复制进去
四、测试项目效果
运行，成功读取到了本地的html文件，那么使用NanUI源码搭建原生开发环境也就到此结束了
五、结束
如果这个帖子对你有用，欢迎给我点赞 + 留言，谢谢