天天看點

如何使用JavaScript UI控件(WijmoJS)建構Electron應用程式

概述

What is Electron?

Electron是一個使用JavaScript、HTML和CSS建構跨平台桌面應用程式的架構。 您可以将Electron與純JavaScript或您選擇的JavaScript架構一起使用:

React

Angular

Vue

建構一個簡單的Electron應用程式

要建立基本的Electron應用程式,請按照下列步驟操作:

您應該看到如下所示的Hello World應用程式:

如何使用JavaScript UI控件(WijmoJS)建構Electron應用程式

将JavaScript UI控件(WijmoJS)添加到應用程式

要将WijmoJS添加到應用程式,請先安裝它。在指令提示符下,進入app檔案夾(electron-quick-start)并鍵入:

接下來,使用VS Code或您喜好的編輯器打開index.html檔案,并添加以下内容:

在這一步中,我們為兩個WijmoJS控件添加了一些樣式和主題元素。接下來,打開“renderer.js”檔案并按如下所示進行編輯:

實作這段代碼首先需要三個WijmoJS子產品:WijmoJS Core,Grid和Chart。 (它設定了WijmoJS許可證密鑰,是以應用程式在運作時不會顯示水印。如果您沒有許可證密鑰,請跳過此步驟,應用程式仍将運作,但會顯示水印元素)

如果您在此之前已經安裝了許可證密鑰,則不需要特定域。WijmoJS電子應用程式會從檔案或本地主機協定運作,是以任何有效的WijmoJS密鑰都将起作用,無論用于生成它的域是什麼。

最後一步是建立WijmoJS控件并将它們綁定到資料源。 在此示例中,網格和圖表綁定到同一資料源。

運作Electron應用程式

像以前一樣運作應用程式!

這次你會看到這個:

如何使用JavaScript UI控件(WijmoJS)建構Electron應用程式

由于表格和圖表綁定到相同的資料,是以您對網格所做的任何更改(如編輯單元格或排序列)都将自動應用于圖表。

現在,請下載下傳WijmoJS,享用WijmoJS JavaScript控件的Electron應用程式吧。

關于WijmoJS:

快如閃電,觸控優先。純前端控件集 WijmoJS,為您的企業應用提供更加靈活的操作體驗,在全球率先支援 AngularJS,并×××能卓越、零依賴的 FlexGrid 和金融圖表等多個控件,為您提供易用、輕松的操作體驗,全面滿足開發所需。

關于葡萄城:

賦能開發者!葡萄城公司成立于 1980 年,是全球領先的集開發工具、商業智能解決方案、管理系統設計工具于一身的軟體和服務提供商。西安葡萄城是其在中國的分支機構,面向全球市場提供軟體研發服務,并為中國企業的資訊化提供國際先進的開發工具、軟體和研發咨詢服務。葡萄城的控件和軟體産品在國内外屢獲殊榮,在全球被數十萬家企業、學校和政府機構廣泛應用。

繼續閱讀