摘要:使用打印的理由很多情況下程序中使用的打印都是用戶無感知的。所以一般打印任務發出,回調函數即會調用并返回參數。選項回調函數的用法基本和相同,但是由于是提供的方法,配置項非常少,而則擴展了很多屬性。
1.使用electron打印的理由
很多情況下程序中使用的打印都是用戶無感知的。并且想要靈活的控制打印內容,往往需要借助打印機給我們提供的api再進行開發,這種開發方式非常繁瑣,并且開發難度較大。
electron提供的打印api可以非常靈活的控制打印設置的顯示,并且可以通過html來書寫打印內容。
2.apielectron提供了兩種方式進行打印,一種是直接調用打印機打印,一種是打印到pdf。
并且有兩種對象可以調用打印:
第一是通過window的webcontent對象,使用此種方式需要多帶帶開出一個打印的窗口,可以將該窗口隱藏,但是通信調用相對復雜。
另一種是使用頁面的webview元素調用打印,可以將webview隱藏在調用的頁面中,通信方式比較簡單。
兩個對象調用打印方法的使用方式都一樣。
2.1 print官網api如下
contents.print([options], [callback]) 選項 Object (可選) silent Boolean (可選) - 不詢問用戶打印信息,默認為 false。 printBackground Boolean (optional) - Also prints the background color and image of the web page. Default is false. deviceName String (optional) - Set the printer device name to use. Default is "". callback Function (可選) success Boolean - Indicates success of the print call.
打印配置(options)中只有簡單的三個配置:
silent:打印時是否不展示打印配置(是否靜默打印)
printBackground:是否打印背景
deviceName:打印機設備名稱
首先要將我們使用的打印機名稱配置好,并且要在調用打印前首先要判斷打印機是否可用。
使用getPrinters方法可獲取當前設備已經配置的打印機列表,注意配置過不是可用,只是在此設備上安裝過驅動。
通過getprinter獲取到的打印機對象:https://electronjs.org/docs/a...
我們這里只管關心兩個,name和status,status為0時表示打印機可用。
這里的status必須經歷一次打印失敗才能返回非0值,也就是說第一次獲取打印機狀態一定是0。但是這一次的打印雖然不能判斷出錯誤,打印的任務已經預存在隊列中了,當下一次打印機狀態變為可用時,將會打印暫存的任務。
當打印機紙張用完時也是這種情況,剩余任務會暫存起來,下次打印機可用時即可以打印了。
print的第二個參數callback是用于判斷打印任務是否發出的回調,而不是打印任務完成后的回調。所以一般打印任務發出,回調函數即會調用并返回參數true。這個回調并不能判斷打印是否真的成功了。
2.2 printToPdfcontents.printToPDF(options, callback) 選項 Object marginsType Integer (optional) - Specifies the type of margins to use. Uses 0 for default margin, 1 for no margin, and 2 for minimum margin. pageSize String (optional) - Specify page size of the generated PDF. Can be A3, A4, A5, Legal, Letter, Tabloid or an Object containing height and width in microns. printBackground Boolean (optional) - Whether to print CSS backgrounds. printSelectionOnly Boolean (optional) - Whether to print selection only. landscape Boolean (optional) - true for landscape, false for portrait. callback Function - 回調函數 error Error data Buffer
printToPdf的用法基本和print相同,但是由于print是native code提供的方法,配置項非常少,而printToPdf則擴展了很多屬性。
包括可以對打印的margin,打印頁眉頁腳等進行配置。
配置項很多,翻了一下源碼發現還有很多沒有被貼進api的:
const defaultPrintingSetting = { pageRage: [], mediaSize: {}, landscape: false, color: 2, headerFooterEnabled: false, marginsType: 0, isFirstRequest: false, requestID: getNextId(), previewModifiable: true, printToPDF: true, printWithCloudPrint: false, printWithPrivet: false, printWithExtension: false, deviceName: "Save as PDF", generateDraftData: true, fitToPageEnabled: false, scaleFactor: 1, dpiHorizontal: 72, dpiVertical: 72, rasterizePDF: false, duplex: 0, copies: 1, collate: true, shouldPrintBackgrounds: false, shouldPrintSelectionOnly: false }3.打印邊距問題
打印的時候打印機會給紙張留一個默認邊距,如果是A4這樣的紙張幾乎可以忽略不計了,但是打印小規格紙張如50mm*50mm,這個邊距就十分明顯了,嚴重影響了整體布局。
printToPdf方法提供了非常多的配置項,其中包括了配置打印邊距的參數,但是print方法卻沒有該配置項。
我們可以通過一項css配置來解決這個問題,即@page:
@page { margin: 0px; }
通過此配置可靈活配置打印邊距。
還有一個css屬性@media print {}此配置是只有在打印時才生效的css,控制的是打印邊距以內的css,并不能控制打印邊距。
4.打印方案使用webcontent打印,首先要有一個打印窗口,這個窗口不能隨時打印隨時創建,比較耗費性能。可以將它在程序運行時啟動好,并做好事件監聽。
此過程需和調用打印的進行做好通信:大致過程如下:
可見通信非常繁瑣
使用webview進行打印可實現同樣的效果但是通信方式會變得簡單,因為渲染進程和webview通信不需要經過主進程,通過如下方式即可:
// In embedder page. const webview = document.querySelector("webview") webview.addEventListener("ipc-message", (event) => { console.log(event.channel) // Prints "pong" }) webview.send("ping") Copy
// 在訪客頁。 const {ipcRenderer} = require("electron") ipcRenderer.on("ping", () => { ipcRenderer.sendToHost("pong") })5.示例程序
示例demo:https://github.com/ConardLi/e...
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/98342.html
摘要:項目環境代碼完成時間廢話不多說,先放源碼安裝依賴運行項目打包項目目錄結構先在主進程引入在方法里添加以下代碼,獲取打印機列表在主線程下,通過對象監聽渲染線程傳過來的事件在主線程中獲取打印機列表通過發送事件到渲染線程,同時將 項目環境 node 10.15.3yarn 1.15.2win10代碼完成時間2019-4-18 廢話不多說,先放源碼 GitHub https://github....
摘要:文章轉載自,感謝文章作者,成功完成選擇文件夾的功能第一種方法,純代碼其原理是利用標簽的類別,打開選擇文件對話框通過標簽的事件,將選擇的文件返回。通過標簽對象的屬性獲得選中的文件名。 文章轉載自:https://www.jianshu.com/p/e71...,感謝文章作者,成功完成選擇文件夾 的功能 1.第一種方法,純js代碼其原理是:利用input標簽的file類別,打開選擇文件對話...
摘要:使用打印到此系列文章的應用示例已發布于可以或下載后運行查看歡迎中的模塊具有屬性它允許您的應用程序進行打印以及打印到這個模塊有一個版本可用于這兩個進程和在瀏覽器中查看完整文檔打印到支持為了演示打印到功能上面的示例按鈕會將此頁面保存為如果 使用 Electron 打印到 PDF 此系列文章的應用示例已發布于 GitHub: electron-api-demos-Zh_CN. 可以 Clon...
摘要:最近使用開發了一套軟件,記錄一下遇到的調試問題所需工具官網鏈接本次所使用的版本為本次直接使用的鏈接官網鏈接配置方式我們使用的項目初始配置已經完成。建議端代碼在主進程中運行調試確定無誤后再引入渲染進程中減少調試工作難度。 最近使用electron開發了一套軟件,記錄一下遇到的調試問題 所需工具 vscode 官網鏈接; electron,本次所使用的版本為: Electron: 1...
閱讀 1201·2021-11-24 11:16
閱讀 3428·2021-11-15 11:38
閱讀 1920·2021-10-20 13:47
閱讀 546·2021-09-29 09:35
閱讀 2192·2021-09-22 15:17
閱讀 1013·2021-09-07 09:59
閱讀 3374·2019-08-30 13:21
閱讀 2904·2019-08-30 12:47