用最潮的 JavaScript

盡情開發 KDE/Qt 程式



       Fred Chien
首先聲明
今天我沒有梗了
雖然昨天看了一晚的新聞找靈感
加上是技術議程
肯定無趣
我們何不速戰速決
成為下午茶解放軍
我是誰?
Who Am I
Fred Chien
   錢逢祥
就是昨天發表退學宣言那位
就是昨天發表退學宣言那位
後來才聽說今年有 Youtube 全球線上直播
不過我現在 R2
無論如何
Businessman
  奸商現在式
要幹大事業就找我!
cfsghost At gmail.com
Blog
fred-zone.blogspot.com
Startup in Taiwan
    Mandice Software.
       MANDICE.COM
CEO, Mandice
慣C

救火    Startup            惡搞
     Mandice Software.



         創新
潮
回到今天正題
征服 KDE/Qt
  用 Node.js
等等等等等等等等!!
   等一下!!!
怎麼又是你!?
你講 GNOME
你搞 LXDE
KDE 的場子還來呀?
   到底哪一國的?
...
身為專業的走路工
   你知道
正題
Node.js + Qt
Why Don't Use QtQuick?
Qt 內建的 JavaScript Solution 不好嗎?
我想答案顯而易見
Node.js 有上萬個 Module
     有千軍萬馬支援
QtQuick 開發者是孤軍奮戰
    什麼都要自己想辦法
現在更是   孤兒軍 奮戰
  Nokia 脫手了 Qt 以後
在 JavaScript 這件事上
Resource, Developer, Documentation...
不是同一個數量級
 與 Node.js 相比
不過
不可否認
Qt 仍然很優秀
  我們得承認
穩定。跨平台。功能完備。
  熱情。臉蛋正。身材火辣。
豈有不染指一下的理由?
Node.js + Qt = ?
Node-Qt
github.com/arturadib/node-qt
Architecture


               JavaScript Application

                  Node-qt Add-on
               Qt Library       Node.js
                       Linux
Qt Works on Several Platforms


            JavaScript Application

               Node-qt Add-on
            Qt Library       Node.js


         MS Windows/Linux/MacOS/...
Live Demo
反正 demo code 不是我寫的
npm install node-qt
  請記得一定要先裝 Qt Library
Sample code
var qt = require('node-qt');
var app = new qt.Application;
var window = new qt.QWidget;

// Prevent objects from being GC'd
global.app = app;
global.window = window;

window.resize(100, 100);
window.show();

// Event Loop
setInterval(app.processEvents, 0);
Normal Program Flow


       Execute Program

         Do Something

                Exit
Normal Program Flow


         Execute Program
Window



          Do Something

                Exit
GUI Application Flow Should Be

            Execute Program


             Do Something



                  LOOP
                          Process Events
Sample code
var qt = require('node-qt');
var app = new qt.Application;
var window = new qt.QWidget;

// Prevent objects from being GC'd
global.app = app;
global.window = window;




                                     !
window.resize(100, 100);
window.show();

// Event Loop

setInterval(app.processEvents, 0);
Event Handler
    事件處理
Sample code for PaintEvent
window.paintEvent(function() {

      /* Do Something ... */

});
Using PaintEvent
window.paintEvent(function() {

      var p = new qt.QPainter();
      p.begin(window);
      p.drawText(20, 30, 'Hello Qt!');
      p.end();

});
mousePressEvent

mouseReleaseEvent

 mouseMoveEvent

  keyPressEvent

 keyReleaseEvent

       ...
Live Demo
   Again
Node-Qt
github.com/arturadib/node-qt
支援度尚不完整
  v0.0.1
肯定有很多問題
  v0.0.1
四個月前
 v0.0.2
不要太期待
 v0.0.2
More Demo?
原作者不會投入太多時間
  但我有空會去補完它
Q&A
Thanks

用最潮的 Java script 盡情開發 kde qt 程式