輕量級桌面應用開發的捷徑:nw.js

jopen 9年前發布 | 36K 次閱讀 nw.js
 

每個程序員都希望用自己喜歡的語言,自己喜歡的平臺、工具,寫自己喜歡的程序。于是我們會看到有人在Win下用Visual Studio愉快地coding,也會看到有人在OS X下用Xcode來開發,或者是用Sublime Text不受平臺限制地玩。

當然了,愿望往往是美好的,然而事與愿違的情況時有發生。如果你基本都是用OS X,卻有人讓你寫一個帶有簡單界面的小程序,保證在他的Win系統上一定可以運行,那么你是不是有點抓狂。

輕量級桌面應用開發的捷徑:nw.js

選擇哪條路?

當然,我可以在Visual Studio(已經有 Mac OS X版 )下用MFC或者其他框架來寫,但是總感覺有點重量級,并且不能移植到其他平臺(萬一哪天讓我寫個OS X下的界面呢,想想都不寒而栗啊!)

所以我想找的就是一個可以跨平臺的、輕量級的圖形界面開發的庫,于是想到了喜歡的Python,然后發現它下面的GUI開發框架還真不少: wxPython , tkInter , PyGtk, PyQt。

  • wxPython: 首先官網相當簡潔(丑陋),然后快速瀏覽了一下文檔,發現有這塊: Cross-Platform Development Tips ,告訴你跨平臺要注意哪些東東,看來不是我心中想的那樣只需要寫一份代碼,在不同平臺編譯一下就可以,于是放棄。
  • TkInter: 也在其他地方看到有人推薦這個,但是感覺文檔特別亂,網上一些教程也相當簡陋,里面界面丑的掉渣,也放棄了。

后面兩個我甚至都沒耐心繼續看下去了,因為我不經意看到了 nw.js ,他就像一座燈塔,冥冥之中照亮了前進的方向啊。

nwjs——前進的方向!

Github上nw.js有兩萬多Star和接近3000的Fork,說明它已經相當成熟,不會是某個人隨興放的一個并不成熟的技術。并且在 Github項目的最后面,顯示Intel有贊助這個項目,看起來很牛的樣子。而且關于nw.js的資料也特別齊全,首先來看看它的特點:

  • 支持用HTML5, CSS3, JS和WebGL來寫應用程序,包括桌面端和移動端;
  • 完全支持 Node.js APIs 和所有的第三方模塊;
  • 性能也不會很差,對于輕量級的應用足夠了;
  • 對應用進行打包和發布十分簡單,也就是說寫一份代碼很容易移植到不同的平臺(包括主流的Linux, Mac OS X 和 Windows);

然后作者怕你認為它很難打交道,進而“知難而退”,就在項目主頁里用許多slides來介紹它。

下面這張slide解決了“nw.js能做什么?”的問題,簡單來說nw.js就是使HTML, CSS, JavaScript寫的原本在瀏覽器上運行的程序,也可以在桌面端運行。

輕量級桌面應用開發的捷徑:nw.js

下面這張slide解決了“怎么用nw.js完成任務?”的問題,

輕量級桌面應用開發的捷徑:nw.js

最后,開發者怕你懷疑nw.js的強大,又提供了 幾個Demo許多成功的案例 來打消我們的顧慮。

nwjs——拿下助攻!

決定用nw.js之后,就開始補充相應的知識啦。首先自己沒有怎么去學過JavaScript, HTML, CSS這類web方面的語言,不過想來也不會比C++難。學習的成本也應該比學習MFC, wxPython低很多,并且這些語言太基礎、使用場景太多了,所以早晚都得了解一下,干脆借這個機會一邊學一邊做具體的東西。于是買了 《JavaScript DOM編程藝術(第2版) 》這本書拿來入門。

講了這么多,還沒說我具體要做什么呢,其實要做的事情特別簡單,就是統計一本書的頁碼中一共有多少個0,1,2,3,4,5,6,7,8,9。關于這個問題,詳細看前面的那篇博客: 講得明白,但寫的明白嗎?

我要實現的目標很簡單,在輸入正確的數字時,給出統計結果;輸入錯誤的數字時,則給出錯誤提示,重置輸入框和統計結果。如下:

輕量級桌面應用開發的捷徑:nw.js

實現過程相當簡單,特別是對于那些做過web開發的,詳細過程就不在這里給出了,只提供一個簡單的程序邏輯圖吧。

輕量級桌面應用開發的捷徑:nw.js

源碼十分簡單,可以在 這里 找到,結構如下:

 tree
.
├── index.html ├── main.js ├── package.json └── style.css  directories, 4 files 

打包到各個平臺也有 詳細的文檔 。以Win為例,只需要三步即可:

  1. 將所有工程文件,放在一個文件夾下,確保 package.json 在根目錄,然后壓縮為.zip格式,并將壓縮文件的后綴由 .zip 改為 .nw
  2. 在nw.js的環境目錄下執行 copy /b nw.exe+you_nw_name.nw you_app_name.exe (這一步之后,就可以在生成的目錄中直接運行 you_app_name.exe ,它依賴同目錄下的一些其他庫);
  3. Enigma Virtual Boxyou_app_name.exe 和依賴的庫打包到單個exe文件中,這樣我們的應用在沒有任何編程環境的win機器上都可以運行。

nwjs——你值得擁有!

不得不提nw.js開發出的應用已經涵蓋了許多領域:

  1. WhatsApp 經典的聊天應用,還有 Messenger
  2. Powder Player 種子下載,以及視頻播放器;
  3. Boson Editor 代碼編輯器,甚至還有一款Markdown編輯器叫 Story-writer
  4. Leanote Desktop App 類似Evernote的筆記類應用程序;
  5. Mongo Management Studio 數據庫管理應用。

來欣賞一下一些應用的截圖吧,不得不說nw.js開發出的應用一點不比原生的丑陋啊。

看來nw.js贏得了很多青睞,那么還有什么能阻止我們擁抱nw.js呢?。

ps:如果有的鏈接打不開,先檢查打開的姿勢對不對。

 本文由用戶 jopen 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。
 轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!