資訊專欄INFORMATION COLUMN
摘要：使用打印到此系列文章的應(yīng)用示例已發(fā)布于可以或下載后運(yùn)行查看歡迎中的模塊具有屬性它允許您的應(yīng)用程序進(jìn)行打印以及打印到這個(gè)模塊有一個(gè)版本可用于這兩個(gè)進(jìn)程和在瀏覽器中查看完整文檔打印到支持為了演示打印到功能上面的示例按鈕會(huì)將此頁(yè)面保存為如果
使用 Electron 打印到 PDF
此系列文章的應(yīng)用示例已發(fā)布于 GitHub: electron-api-demos-Zh_CN. 可以 Clone 或下載后運(yùn)行查看. 歡迎 Star .
Electron 中的 browser window 模塊具有 webContents 屬性, 它允許您的應(yīng)用程序進(jìn)行打印以及打印到PDF.
這個(gè)模塊有一個(gè)版本可用于這兩個(gè)進(jìn)程: ipcMain 和 ipcRenderer.
在瀏覽器中查看 完整 API 文檔.
打印到 PDF支持: Win, macOS, Linux
為了演示打印到PDF功能, 上面的示例按鈕會(huì)將此頁(yè)面保存為PDF, 如果您有PDF查看器, 請(qǐng)打開文件.
在實(shí)際的應(yīng)用程序中, 你更可能將它添加到應(yīng)用程序菜單中, 但為了演示的目的, 我們將其設(shè)置為示例按鈕.
渲染器進(jìn)程
const ipc = require("electron").ipcRenderer
const printPDFBtn = document.getElementById("print-pdf")
printPDFBtn.addEventListener("click", function (event) {
ipc.send("print-to-pdf")
})
ipc.on("wrote-pdf", function (event, path) {
const message = `PDF 保存到: ${path}`
document.getElementById("pdf-path").innerHTML = message
})
主進(jìn)程
const fs = require("fs")
const os = require("os")
const path = require("path")
const electron = require("electron")
const BrowserWindow = electron.BrowserWindow
const ipc = electron.ipcMain
const shell = electron.shell
ipc.on("print-to-pdf", function (event) {
const pdfPath = path.join(os.tmpdir(), "print.pdf")
const win = BrowserWindow.fromWebContents(event.sender)
// 使用默認(rèn)打印選項(xiàng)
win.webContents.printToPDF({}, function (error, data) {
if (error) throw error
fs.writeFile(pdfPath, data, function (error) {
if (error) {
throw error
}
shell.openExternal("file://" + pdfPath)
event.sender.send("wrote-pdf", pdfPath)
})
})
})
高級(jí)技巧
使用打印樣式表.
您可以創(chuàng)建打印目標(biāo)的樣式表, 以優(yōu)化用戶打印的外觀. 下面是在這個(gè)應(yīng)用程序中使用的樣式表, 位于 assets/css/print.css 中.
@media print {
body {
background: none;
color: black !important;
font-size: 70%;
margin: 0; padding: 0;
}
h1 {
font-size: 22px;
}
.nav, button, .demo-box:before,
#pdf-path, header p {
display: none;
}
.demo-box, h2,
pre, code {
padding: 0 !important;
margin: 0 !important;
}
header {
padding: 0 0 10px 0;
}
code, .support {
font-size: 10px;
}
}
如果這邊文章對(duì)您有幫助, 感謝 下方點(diǎn)贊 或 Star GitHub: electron-api-demos-Zh_CN 支持, 謝謝.
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://specialneedsforspecialkids.com/yun/88968.html
摘要：使用打印的理由很多情況下程序中使用的打印都是用戶無感知的。所以一般打印任務(wù)發(fā)出，回調(diào)函數(shù)即會(huì)調(diào)用并返回參數(shù)。選項(xiàng)回調(diào)函數(shù)的用法基本和相同，但是由于是提供的方法，配置項(xiàng)非常少，而則擴(kuò)展了很多屬性。 1.使用electron打印的理由 很多情況下程序中使用的打印都是用戶無感知的。并且想要靈活的控制打印內(nèi)容，往往需要借助打印機(jī)給我們提供的api再進(jìn)行開發(fā)，這種開發(fā)方式非常繁瑣，并且開發(fā)難度較...
摘要：本文主要講解的入門。可以幫助我們管理包的下載依賴部署發(fā)布等。可以認(rèn)為是中的。后續(xù)使用中，全部替換為即可。命令根據(jù)它，自動(dòng)下載所需模塊用于創(chuàng)建窗口和處理系統(tǒng)事件安裝包的位置。 Electron是什么 可以認(rèn)為Electron是一種運(yùn)行環(huán)境庫(kù)，我們可以基于此，用HTML、JS和CSS寫桌面應(yīng)用。PC端的UI交互，主要有web應(yīng)用和桌面應(yīng)用。具體采用哪種方式，主要看系統(tǒng)的應(yīng)用場(chǎng)景，哪個(gè)更合適...
摘要：作者鐘離，酷家樂客戶端負(fù)責(zé)人原文地址酷家樂客戶端下載地址文章背景在酷家樂客戶端在改版成功后，我們積累了許多的寶貴的經(jīng)驗(yàn)和最佳實(shí)踐。 作者：鐘離，酷家樂PC客戶端負(fù)責(zé)人原文地址：https://webfe.kujiale.com/electron-ku-jia-le-ke-hu-duan-kai-fa-shi-jian-fen-xiang-jin-cheng-tong-xin/酷家樂客...
閱讀 1640·2023-04-25 20:36
閱讀 2049·2021-09-02 15:11
閱讀 1177·2021-08-27 13:13
閱讀 2653·2019-08-30 15:52
閱讀 4589·2019-08-29 17:13
閱讀 1001·2019-08-29 11:09
閱讀 1491·2019-08-26 11:51
閱讀 833·2019-08-26 10:56
