当前位置: 首页 > Web前端 > HTML5

使用Electron创建屏幕截图

时间:2023-04-05 01:47:54 HTML5

使用Electron制作截图本系列文章的应用示例已发布在GitHub上:electron-api-demos-Zh_CN。您可以克隆或下载并运行查看。欢迎来到星空。Electron中的desktopCapturer模块可用于访问Chromium的getUserMediawebAPI提供的音频、视频、屏幕和窗口等任何媒体。此模块的一个版本可用于这两个进程:ipcMain和ipcRenderer。在浏览器中查看完整的API文档。创建屏幕截图支持:Win、macOS、Linux|Process:Renderer此示例使用desktopCapturer模块来捕获正在使用的屏幕并创建全屏捕获。单击示例按钮将截取当前屏幕的屏幕截图并在默认查看器中打开它。渲染器进程constelectron=require('electron')constdesktopCapturer=electron.desktopCapturerconstelectronScreen=electron.screenconstshell=electron.shellconstfs=require('fs')constos=require('os')constpath=require('path')constscreenshot=document.getElementById('screen-shot')constscreenshotMsg=document.getElementById('screenshot-path')screenshot.addEventListener('click',function(event){screenshotMsg.textContent='复制代码屏幕截图...'constthumbSize=determineScreenShotSize()letoptions={types:['screen'],thumbnailSize:thumbSize}desktopCapturer.getSources(options,function(error,sources){if(error)returnconsole.log(error)sources.forEach(function(source){if(source.name==='整个屏幕'||source.name==='屏幕1'){constscreenshotPath=path.join(os.tmpdir(),'screenshot.png')fs.writeFile(screenshotPath,source.thumbnail.toPng(),function(error){如果(错误)返回console.log(错误)shell.openExternal('file://'+screenshotPath)constmessage=`Screenshotsavedto:${screenshotPath}`screenshotMsg.textContent=message})}})})})functiondetermineScreenShotSize(){constscreenSize=electronScreen.getPrimaryDisplay().workAreaSizeconstmaxDimension=Math.max(screenSize.width,screenSize.height)return{width:maxDimension*window.devicePixelRatio,height:maxDimension*window.devicePixelRatio}}如果这篇文章对你有帮助,谢谢支持下方或StarGitHub:electron-api-demos-Zh_CN,谢谢。