成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

一款實(shí)用的前端截圖工具

VishKozus / 993人閱讀

摘要：代碼地址碼云這是一款基本涵蓋了截圖所有功能的截圖工具。圖如上圖所示，用戶可對(duì)截圖框進(jìn)行拖拽，并且工具欄能隨著截圖框與可視區(qū)域的位置動(dòng)態(tài)顯示在可視區(qū)域范圍內(nèi)。工具欄功能從左到右依次為顏色，文字，橢圓，矩形，線條，箭頭，后退，完成。

kscreenshot

代碼地址：github 碼云

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

npm: npm install kscreenshot --save

demo圖1：

如上圖所示，用戶可對(duì)截圖框進(jìn)行拖拽，并且工具欄能隨著截圖框與可視區(qū)域的位置動(dòng)態(tài)顯示在可視區(qū)域范圍內(nèi)。

demo圖2：

如上圖所示，用戶可拖動(dòng)截圖框四周的拖拽點(diǎn)以及拖拽線進(jìn)行隨意拖動(dòng)。

demo圖3：

如上圖所示，用戶可使用工具欄中的各個(gè)工具對(duì)截圖進(jìn)行繪制。工具欄功能從左到右依次為：顏色，文字，橢圓，矩形，線條，箭頭，后退，完成。當(dāng)用戶在進(jìn)行繪制后無法在對(duì)截圖框進(jìn)行拖拽工作，除非使用后退功能直到無繪制時(shí)才能繼續(xù)拖拽。

使用 
import kscreenshot from "kscreenshot"

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

當(dāng)按下shift + A將會(huì)觸發(fā)截圖功能

結(jié)合electron、NW等前端桌面開發(fā)庫(kù)可實(shí)現(xiàn)整個(gè)顯示屏截圖 demo

具體的參數(shù)配置可在github上查看。喜歡的話，麻煩大家start一下：github 碼云

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/95923.html

相關(guān)文章

  • chrome 擴(kuò)展精選推薦

    摘要：我本人對(duì)擴(kuò)展比較挑，一般有同類型的擴(kuò)展我會(huì)選擇維護(hù)比較積極的，使用人數(shù)更多的。其實(shí)包括很多編輯器和都有類似的擴(kuò)展用來糾正英文的拼寫錯(cuò)誤。一款可以分析網(wǎng)站用到的技術(shù)框架的擴(kuò)展?？梢燥@示網(wǎng)站的國(guó)旗和其它信息。 雖然有點(diǎn)標(biāo)題黨的嫌疑，但是內(nèi)容絕對(duì)是滿滿的的干貨。很多擴(kuò)展功能比較單一，直接用一張圖就能很清楚說明它的用途啦。出于篇幅的限制，我在這里會(huì)重點(diǎn)介紹一些我個(gè)人比較用得上的一些擴(kuò)展。因?yàn)槠?..

    X_AirDu 評(píng)論0 收藏0

  • 前端工具【3】—— 圖片處理

    摘要：切圖主要是用的工具就是等等，除此之外，在開發(fā)過程中我們也會(huì)用到其他工具，以下介紹一些有關(guān)于圖片處理的操作。是打開文件捕捉活動(dòng)窗口捕獲窗口捕獲矩形區(qū)域，可自行截圖。新版的比之前那些版本增加了一鍵導(dǎo)出功能，這個(gè)功能很大程度方便了我們拆分圖片。 在寫頁(yè)面之前，很重要的一個(gè)技能是切圖，根據(jù)UI設(shè)計(jì)的設(shè)計(jì)圖，在了解頁(yè)面結(jié)構(gòu)和操作后進(jìn)行分割，取出自己在開發(fā)過程中是用到的圖片資源。切圖主要是用的工具...

    MobService 評(píng)論0 收藏0

  • 前端工具【3】—— 圖片處理

    摘要：切圖主要是用的工具就是等等，除此之外，在開發(fā)過程中我們也會(huì)用到其他工具，以下介紹一些有關(guān)于圖片處理的操作。是打開文件捕捉活動(dòng)窗口捕獲窗口捕獲矩形區(qū)域，可自行截圖。新版的比之前那些版本增加了一鍵導(dǎo)出功能，這個(gè)功能很大程度方便了我們拆分圖片。 在寫頁(yè)面之前，很重要的一個(gè)技能是切圖，根據(jù)UI設(shè)計(jì)的設(shè)計(jì)圖，在了解頁(yè)面結(jié)構(gòu)和操作后進(jìn)行分割，取出自己在開發(fā)過程中是用到的圖片資源。切圖主要是用的工具...

    Rango 評(píng)論0 收藏0

  • 分享一些實(shí)用的軟件工具

    摘要：分享一些實(shí)用的軟件工具也可以分享自己常用的軟件給大家，這里會(huì)同步更新必備放幾個(gè)資源站點(diǎn)有能力建議購(gòu)買正版不要看格式的，可以是。建議使用清除系統(tǒng)的間諜軟件，用了之后夏一跳，趕緊卸載了迅雷極速版，只用精簡(jiǎn)版。 分享一些實(shí)用的軟件工具 PS：也可以分享自己常用的軟件給大家，這里會(huì)同步更新 kindle(必備) 放幾個(gè)azw3資源站點(diǎn)：有能力建議購(gòu)買正版,不要看PDF格式的，可以是mobi。我...

    arashicage 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<