C#開發BIMFACE系列52 CS客戶端集成BIMFACE應用的技術方案
- 2021 年 10 月 19 日
- 筆記
- BIM BIMFACE, BIM 之 BIMFace
在我的部落格《C#開發BIMFACE系列49 Web網頁集成BIMFACE應用的技術方案》、《C#開發BIMFACE系列50 Web網頁中使用jQuery載入模型與圖紙》、《C#開發BIMFACE系列51 Web網頁中使用Vue.js載入模型與圖紙》三篇文章中介紹了Web網頁中集成BIMFace應用開發的技術方案與示常式序。在建築領域中涉及的應用管理系統絕大部分都是BS架構Web形式,這是主流趨勢。BIMFACE在網頁中載入瀏覽模型圖紙時用到了HTML5、CSS3、WebGL等新技術,無需安裝任何插件,極速流暢的瀏覽體驗,並且可以集成應用於App、小程式、公眾號等移動端。
CS架構的WinForm客戶端程式仍然具有很實用的價值,如設計類軟體 AutoCAD與Autodesk Revit、WPS、IT類的集成開發環境(資料庫、圖形處理軟體)、PC端的小工具等等,充分利用了客戶端電腦的資源綜合計算能力,處理性能更加優秀。
但是BIMFACE官方並未提供CS客戶端程式的二次開發插件,如果想在CS客戶端程式中集成BIMFACE應用,也只能藉助Web網頁,然後將網頁集成到客戶端程式中,這樣就間接的達到了目的。下面是審圖系統中的實際應用案例
WinForm程式中集成網頁的基本原理就是通過一個包含類似瀏覽器功能的控制項,將Web網頁載入並解析渲染出來。下面主要介紹 WinForm 集成 Web 網頁的幾種實現方式。
談論集成的問題之前,先了解一下瀏覽器的內核。
瀏覽器最重要或者說核心的部分是「Rendering Engine」,可大概譯為「渲染引擎」,不過我們一般習慣將之稱為「瀏覽器內核」。負責對網頁語法的解釋(如標準通用標記語言下的一個應用HTML、JavaScript)並渲染(顯示)網頁。 所以,通常所謂的瀏覽器內核也就是瀏覽器所採用的渲染引擎,渲染引擎決定了瀏覽器如何顯示網頁的內容以及頁面的格式資訊。不同的瀏覽器內核對網頁編寫語法的解釋也有不同,因此同一網頁在不同的內核的瀏覽器里的渲染(顯示)效果也可能不同,這也是網頁編寫者需要在不同內核的瀏覽器中測試網頁顯示效果的原因。
- Trident(MSHTML、IE內核)
內核被包含在全世界最高的使用率的作業系統中,即為Windows作業系統,所以我們又經常把它稱之為IE內核。
Trident內核的常見瀏覽器有:
-
- IE6、IE7、IE8(Trident 4.0)、IE9(Trident 5.0)、IE10(Trident 6.0)、IE11
- 360安全瀏覽器(1.0-5.0為Trident,6.0為Trident+Webkit,7.0為Trident+Blink)
- 360極速瀏覽器(7.5之前為Trident+Webkit,7.5為Trident+Blink)
- 百度瀏覽器(早期版本)
- 世界之窗瀏覽器(最初為IE內核,2013年採用Chrome+IE內核)
- UC瀏覽器(Webkit內核+Trident內核)
- 其他等
其中部分瀏覽器的新版本是「雙核」甚至是「多核」,其中一個內核是Trident,然後再增加一個其他內核。中國的廠商一般把其他內核叫做「高速瀏覽模式」,而Trident則是「兼容瀏覽模式」,用戶可以來回切換。
- Gecko(Firefox內核)
Gecko內核常見的瀏覽器:Mozilla Firefox、Mozilla SeaMonkey、waterfox(Firefox的64位開源版)、Iceweasel、Epiphany(早期版本)、Flock(早期版本)、K-Meleon。
- Webkit(Safari內核,Chrome內核原型,開源)
WebKit內核常見的瀏覽器:Chrome、傲遊瀏覽器3、Apple Safari (Win/Mac/iPhone/iPad)、Symbian手機瀏覽器、Android 默認瀏覽器。
參考網站://liulanmi.com/labs/core.html
- Blink
Blink是一個由Google和Opera Software開發的瀏覽器排版引擎,Google計劃將這個渲染引擎作為Chromium計劃的一部分,並且在2013年4月的時候公布了這一消息。這一渲染引擎是開源引擎WebKit中WebCore組件的一個分支,並且在Chrome(28及往後版本)、Opera(15及往後版本)和Yandex瀏覽器中使用。
- ie.icoa.cn
//ie.icoa.cn 可檢測 PC 或手機瀏覽器內核和作業系統類型,包括Google Chrome的WebKit、IE的Trident、ME的Edge、Firefox的Gecko/Servo,以及Windows/MacOS/Linux/iOS/Android等的判斷。
- //mybrowse.osfipin.com
- WebBrowser
微軟WinForm開發框架中老牌控制項。
-
- 默認基於IE7內核,對H5網頁載入支援不完善。
- 只支援單執行緒模式,大部分對其操作必須在創建它的執行緒中執行,不可以在其它執行緒中調用其方法或屬性。
- 性能相對較弱。
- CefSharp【推薦】
CefSharp是一種將功能齊全的符合標準的web瀏覽器嵌入C#或VB.NET應用程式的簡單方法。CefSharp擁有WinForms和WPF應用程式的瀏覽器控制項,以及自動化項目的OffScreen版本。CefSharp基於Chromium Embedded Framework,這是Google Chrome的開源版本。
- CefSharp中文幫助文檔,請點擊查看
- 免費、開源://github.com/cefsharp/CefSharp
- 支援JS、C#、WinForm窗體之間相互通訊與調用。
- 兼容性較好,支援H5、CSS5、WebGL等。
- 支援獲取Cookies較全面。
- 通過NeGet安裝SDK時,運行時環境會被自動下載到當前項目的bin\debug 或者 bin\Release目錄下。導致整個項目非常大,大約110M左右。
- 以獨立進程方式運行,消耗記憶體較多。
- 當控制項Dock屬性設置為 Fill,客戶端電腦的縮放與布局不是100%時,窗體呈現黑邊(嚴重bug),並沒有完全填充父容器。
實際項目應用效果如下圖(縮放比例為100%):
呈現的模型是三維BIM模型,裡面用到了HTML5、CSS3、WebGL等新技術。
- Miniblink
Miniblink是一個追求極致小巧的瀏覽器內核項目,全世界第三大流行的瀏覽器內核控制項。其基於chromium最新版內核,去除了chromium所有多餘的部件,只保留最基本的排版引擎blink。Miniblink保持了10M左右的極簡大小,是所有同類產品最小的體積,同時支援windows xp、npapi。
- GeckoFX
GeckoFX是skybound工作室開發的一個開源的用於方便將gecko引擎(最主要的瀏覽器是firefox)鏈接到.net 窗體應用的一個組件。它是用C#寫成的,裡面有大量的C#的注釋,geckofx是最完美的默認的iE核心webbrowse控制項的替代控制項。
- DotNetBrowser
DotNetBrowser能嵌入一個基於Chromium的WPF或WinForms組件到你的.NET應用中,用來顯示使用HTML5、CSS3、JavaScript、Silverlight等技術構建的現代網頁。
-
- 收費
- EO.WebBrowser
- 官網://www.essentialobjects.com/Products/WebBrowser/Default.aspx
- 收費
- Microsoft Edge WebView2【推薦】
Microsoft Edge WebView2 控制項允許在本機應用中嵌入 web 技術(HTML、CSS 以及 JavaScript)。 WebView2 控制項使用 Microsoft Edge(Chromium) 作為繪製引擎,以在本機應用中顯示 web 內容。 使用 WebView2,可以在本機應用的不同部分嵌入 Web 程式碼,或在單個 WebView 實例中生成所有本機應用。
- 官網://docs.microsoft.com/zh-cn/microsoft-edge/webview2
- 免費。
- 誕生較晚,相比CefSharp,功能較弱。
- 通過NeGet下載SDK時,僅下載以下3個類庫。DLL尺寸較小,對項目安裝包大小几乎沒有影響。
-
運行WebView2時,首先需要下載並 WebView2 運行時安裝程式。下載地址: //developer.microsoft.com/zh-cn/microsoft-edge/webview2
分發 WebView2 應用和 WebView2 運行時://docs.microsoft.com/zh-cn/microsoft-edge/webview2/concepts/distribution
-
- WebView2 Runtime 可以離線安裝。 而CEFSharp從Nuget上下載Runtime耗時較長。
- WebView2 Runtime 一次安裝,可以所有程式共享,並且還支援獨立自動升級,而CEFSharp每個程式都需要下載。
- WebView2 Runtime x86,x64自動識別,不需要手動設置。
- WinForm、WPF、.NET Core 都可以用一個統一的包。
實際項目應用效果如下圖。
呈現的模型是三維BIM模型,裡面用到了HTML5、CSS3、WebGL等新技術。
- BlazorWebView
RemoteBlazorWebView.Wpf.BlazorWebView、RemoteBlazorWebView.WindowsForms.BlazorWebView 是基於 .NET 6 Preview 7 開發的 Blazor WebView 控制項,支援WinForm 與 WPF。
-
- 開源地址://github.com/budcribar/RemoteBlazorWebView
- 示常式序://github.com/budcribar/RemoteBlazorWebViewTutorial
綜合考慮,在客戶端程式中嵌入網頁程式,首選CefSharp、WebView2。
參考文獻://www.cnblogs.com/TianFang/p/14352539.html
《BIMFace.SDK.CSharp》開源SDK。歡迎大家下載使用。