ホームページ >ウェブフロントエンド >Vue.js >Electronでスクリーンショットを撮る方法
この記事では、Electron アプリでスクリーンショットをキャプチャする方法について説明します。特定のウィンドウや領域のスクリーンショットの撮影、ウィンドウ枠を除く画面全体のスクリーンショットの取得、キャプチャした画像の保存や共有方法について説明します
1. Electron アプリで特定のウィンドウまたは領域のスクリーンショットを取得する方法
Electron では、screenshot
メソッドを使用して特定のウィンドウまたは領域のスクリーンショットをキャプチャできます。その方法は次のとおりです:screenshot
method. Here's how you do it:
<code class="js">const { BrowserWindow } = require('electron'); const window = new BrowserWindow({ width: 800, height: 600 }); window.capturePage((image) => { // Save the image to a file or share it using an appropriate platform-specific method. });</code>
For taking screenshots of a specific region, use the capturePage
function with non-default options:
<code class="js">const options = { x: 0, y: 0, width: 200, height: 100 }; window.capturePage(options, (image) => { // ... });</code>
2. How to Get a Screenshot of the Entire Screen Excluding the Window Frame in Electron App?
To capture a screenshot of the entire screen excluding the window frame in Electron, create a new window without a frame and capture the screen:
<code class="js">const { BrowserWindow } = require('electron'); const window = new BrowserWindow({ frame: false, show: false }); window.capturePage((image) => { // ... });</code>
The frame: false
option ensures that the window doesn't have a border or title bar, resulting in a screenshot that only includes the screen content.
3. How to Save or Share a Screenshot in Electron App?
Once you have the screenshot image
<code class="js">const fs = require('fs'); fs.writeFile('my-screenshot.png', image.toPNG(), (err) => { if (err) { console.log('Error saving the screenshot:', err); } else { console.log('Screenshot saved successfully'); } });</code>特定の領域のスクリーンショットを撮るには、デフォルト以外のオプションを指定して
capturePage
関数を使用します:<code class="js">const dialog = require('electron').dialog; dialog.showSaveDialog(window, { title: 'Save screenshot', filters: [ { name: 'PNG Images', extensions: ['png'] } ] }, (file) => { if (file) { fs.writeFile(file, image.toPNG(), (err) => { if (err) { console.log('Error saving the screenshot:', err); } else { console.log('Screenshot saved successfully'); } }); } });</code>
2。 Electron アプリでウィンドウ フレームを除く画面全体のスクリーンショットを取得する方法
Electron でウィンドウ フレームを除く画面全体のスクリーンショットをキャプチャするには、フレームなしで新しいウィンドウを作成し、画面をキャプチャします:frame: false
オプションを使用すると、ウィンドウに境界線やタイトル バーがなくなり、画面のコンテンツのみが含まれるスクリーンショットが作成されます。3. Electron アプリでスクリーンショットを保存または共有する方法
image
を取得したら、それをファイルに保存したり、プラットフォーム固有の方法を使用して共有したりできます。以下に例を示します:🎜🎜🎜🎜🎜 スクリーンショットをファイルに保存する:🎜🎜rrreee🎜🎜🎜🎜 システムダイアログを使用してスクリーンショットを共有する:🎜🎜rrreee🎜🎜以上がElectronでスクリーンショットを撮る方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。