libui-node體驗筆記
簡介
libui-node是基於libui庫的node封裝.libui庫是一個簡便的將本地原生的GUI封裝的C語言庫,並支持各平臺(Mac,Linux,windows)。官網提供了第三方封裝文檔,開發者可以方便的實現自己語言的封裝。目前市面上有基於swift,kotlin,python,php,node,lua.... 各種第三方語言的封裝庫,這裏只介紹node封裝庫的使用方法。
對比electron
與electron比較起來,github上的數據比較起來得可憐的很。 社區也基本沒啥活躍。 個人也比較喜歡electron完全web化的任性開發。
就目前看起來libui-node的主打賣點如下:
- 支持各種開發語言
- 原生Ui渲染
- 打包較小(helloworld代碼40M,比electron的100M小不少)
stars ?? | forks ?? | issues ?? | updated | created ?? | |
---|---|---|---|---|---|
libui-node | 1391 | 61 | 24 | Jun 19, 2018 | May 21, 2016 |
electron | 61773 | 8086 | 1195 | Jun 27, 2018 | Apr 12, 2013 |
安裝
node安裝
命令行下運行node命令:
npm install -save libui-node
對應平臺的libui二進制庫會被自動下載安裝,如果報錯可能是因為本地的npm庫比較老,可以更新npm.其他錯誤可以看看this node-gyp issue.
值得註意的是,貌似libui-node開發編譯版本是
8.11.x
所以請註意本地的node版本最好是在此之上。
運行示例
下載線上的git庫,其中docs為文檔目錄,examples為示例目錄,運行示例看是否可正常運行:
#在根目錄下先執行安裝
npm install
#直接運行control gallery示例
npm start
#運行core api示例
npm run start-core
#運行指定的示例文件
node <path to example file>
開發
詳細的文檔查看git源碼目錄下的docs目錄,下面做一個簡單的例子
建立一個工程目錄
mkdir test cd test npm install --save libui-node
新建一個index.js
const libui = require('libui-node');
const menu = new libui.UiMenu('File');
menu.appendQuitItem();
const win = libui.UiWindow('test', 400, 300, true);
var widget = new libui.UiLabel();
widget.text = '呵呵呵呵';
win.setChild(widget);
win.onClosing(()=>{
win.close();
libui.stopLoop();
});
libui.onShouldQuit(() => {
win.close();
libui.stopLoop();
});
win.show();
libui.startLoop();
測試運行
node index.js
打包
這些示例都源碼的方式在node環境下執行,如果想打包的話那麽就需要用到 launchui-packager 一個基於LaunchUI的跨平臺打包器。
安裝
npm install --g launchui-packager
打包命令
第一次執行的時候會下載對應平臺的依賴包。
launchui-packager <name> <version> <entry> [options...]
比如上面做的開發中的示例可以如此打包:
#在工程目錄下執行
launchui-packager hello 1.0.0 index.js --out output
參數介紹
<name> 應用名稱
<version> 應用版本號
<entry> 應用的啟動腳本,將被拷貝到最終包的 app/main.js
配置介紹 options
--out <path> 生成包的輸出目錄,默認當前目錄
--platform <platform> 目標平臺,支持win32, darwin (OS X) and linux. 默認當前平臺一致(process.platform)
--arch <arch> 包的架構,支持x64 (全平臺支持) and ia32 (win32/linux),默認當前平臺一致(process.arch)
--overwrite 是否覆蓋之前生成的包或目錄,默認不覆蓋
--pack <format> 定義打包的格式,目前只支持zip格式,默認生成應用目錄不打包
--launchui-version <version> 定義下載的launchui版本,默認使用當前系統已有的
--launchui-cache <path> 定義launchui下載路徑,默認~/.launchui
--company <company> 公司名稱,對應Windows下的CompanyName 屬性設置
--copyright <copyright> 應用的版權信息,對應 windows下的LegalCopyright屬性 和 Mac OS X下的 NSHumanReadableCopyright
--identifier <identifier> 應用的bundle identifie,對應Mac OS X下的CFBundleIdentifier
--category <category> 應用的category,對應Mac OS X 下的LSApplicationCategoryType
--icon <path> 應用的圖標路徑,windows下使用.ico,Mac OS X下使用.icns後綴
--license <path> 應用的license文件,將被拷貝到應用的根目錄下
--dir <path> 應用額外需要打包的文件目錄,將作為子目錄被打包到應用的app目錄下
--files <pattern,...> 定義dir定義的文件目錄中拷貝文件的匹配規則,可以參考glob文檔,多個規則可以使用數組。默認**,代表拷貝dir目錄下的所有文件
輸出
將生成一個名稱為 <name>-v<version>-<platform>-<arch> 目錄,比如:MyApp-v1.0.0-win32-ia32
api方式
除了使用上面命令行的方式也可以使用api的方式進行打包,比如再用自動化工具的時候,跟上面的參數大同小異:
const packager = require( 'launchui-packager' );
packager( {
name: 'MyApp',
version: '1.0.0',
entry: './dist/main.js',
out: './packages'
.....
}, function ( err, outPath ) {
// outPath will be the path of the created package directory or file
} );
libui-node體驗筆記