一款實用的前端截圖工具

kscreenshot

代碼地址：github 碼雲

這是一款基本涵蓋了截圖全部功能的截圖工具。

npm: npm install kscreenshot --save

demo圖1：

如上圖所示，用戶可對截圖框進行拖拽，而且工具欄能隨着截圖框與可視區域的位置動態顯示在可視區域範圍內。

demo圖2：

如上圖所示，用戶可拖動截圖框四周的拖拽點以及拖拽線進行隨意拖動。

demo圖3：

如上圖所示，用戶可以使用工具欄中的各個工具對截圖進行繪製。工具欄功能從左到右依次爲：顏色，文字，橢圓，矩形，線條，箭頭，後退，完成。當用戶在進行繪製後沒法在對截圖框進行拖拽工做，除非使用後退功能直到無繪製時才能繼續拖拽。

使用

import kscreenshot from 'kscreenshot'

//65指鍵盤中的A
new kscreenshot(
    {
        key: 65 
    }
)

當按下shift + A將會觸發截圖功能

結合electron、NW等前端桌面開發庫可實現整個顯示屏截圖

demo

具體的參數配置可在github上查看。喜歡的話，麻煩你們start一下：github 碼雲