Electron.js で VisualStudio っぽい見た目

Electron.js でどこまでできるかなと思ったので。

f:id:bps_tomoya:20151001164632p:plain

なんか色おかしい。

まだできてないこと

  • 最小化、最大化、閉じるボタン、リサイズボタンの表示
    実装そのものはいたって簡単。ただし OS に合わせたボタンがやりたいなら自作するしかなさそう。OS のリソースにアタッチできるプラットフォームでやるのが人道的っぽい。

  • メニューバーの表示
    コードでフレームレスな Window にしろって言ってるので当然メニューバーも消える。独自実装だるそう。API とか先人の知恵ライブラリ欲しい。

  • 枠が光ってない
    この枠は html に border プロパティを設定しているので、たぶん描画範囲の限界問題。html に枠を付けるのを止めて光る幅ぶん余白を作り、その中の子要素を光らせたらできるかも。ただし、API 通りにやってみても Window 透過がうまくいかない。

余談

盛大な二番煎じだった。

www.mylifeforthecode.com