學習目標：

• 快速開始使用 NanUI
• 通過VisualStudio2022 快速跑通NanUIDemo
• Gitee 林選臣 / NanUI
• Gitee中附帶了中英文文檔，里面寫的很詳細了，進階的可以去看看

NanUI基本介紹

這是一個開放源代碼的 .NET / .NET Core 窗體應用程序（WinForms）界面組件。您可以使用 HTML5 / CSS3 / Javascript 等前端技術來構建您的應用程序界面。主流的Javascript框架，比如Angular, React, Vue都是可以用來構架SPA應用的明智選擇。使用 NanUI 界面組件將給您的窗體設計工作帶來無限可能。

NanUI文檔 - 使用網頁來設計整個窗口
NanUI是一套桌面開發(fā)框架，最終輸出的是exe桌面程序，但運行的內容是瀏覽器頁面的內容（解決了CS界面不容易輸出很美觀界面的問題）

效果展示：

如果效果展示符合你的審美，那么你可以繼續(xù)往下看該文章

遮罩層

有點類似于Ps打開軟件的時候出現的logo，加載畫面，當然該遮罩層可以關閉，后面會提供關閉方法

運行界面

有點類似將網頁裝進了App，當然該界面的前提是你已經搭建好自己的網站，也可以是你用別人的網頁地址

開始配置項目：

查看電腦安裝Framwork ： C:\Windows\Microsoft.NET\Framework

Create a new Project

創(chuàng)建新的Windows Form App(.NET Framework)

Configure your new Project

References引用NetDimension.NanUI

右鍵選擇Manage NuGet Packages

搜索安裝NanUI

• NetDimension.NanUI
• NetDimension.NanUI.Runtime

安裝過程中有問題請移步：NetDimension.NanUI安裝報錯Unable to find a version of ‘SharpGen.Runtime‘解決方案

當所有環(huán)境安裝完成，那么可以繼續(xù)下面代碼修改環(huán)節(jié)

修改progrome.cs文件

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();
        }
    }
}

新建一個名為MainWindow的Class

MainWindow.cs修改代碼如下：

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);
        
		//設置標題
        Title = "m-todo.com";
        
        // 在此處設置窗口Icon
        //Icon = new System.Drawing.Icon("Mega.ico");

        //設置啟動位置
        StartPosition = System.Windows.Forms.FormStartPosition.CenterScreen;
    }

    protected override void OnReady()
    {
        // 在此處進行瀏覽器相關操作

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

至此運行即可實現效果展示的樣子

遮罩定制篇

選臣 / NanUI 0.9 示例

雙擊Resource.resx 點擊添加Resource，添加現有項

MainWindow.cs加入下述代碼

using System.Drawing;

class MainWindow : Formium
{
    public MainWindow()
    {
        // 修改啟動界面
        //ColorTranslator使用前提是using System.Drawing;
        SplashScreen.BackColor = ColorTranslator.FromHtml("#fafafa");
        
        //mmmmtodo為你項目的名稱
        //林選臣Demo中解決方案是namespace HostWindowFeatures; 然后 SplashScreen.Image = Properties.Resources.SplashLogo;
        //但是當我使用namespace HostWindowFeatures;時候報錯： 讓C# langversion 7.4提升到10.0+
        //修改項目mmmmtodo.csproj里面的langversion為10.0后，發(fā)現Program.cs代碼部分又報錯了，所以最后選擇方案是使用mmmmtodo
        SplashScreen.Image = mmmmtodo.Properties.Resources.SplashLogo;
    }
}

如此便得到下述頁面效果：
文章來源地址http://www.zghlxwxcb.cn/news/detail-404287.html

到了這里，關于VisualStudio 快速開始使用 NanUI（從0搭建到運行程序僅需10分鐘）的文章就介紹完了。如果您還想了解更多內容，請在右上角搜索TOY模板網以前的文章或繼續(xù)瀏覽下面的相關文章，希望大家以后多多支持TOY模板網！