Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[FR] esc快捷键取消截图需求讨论 #203

Open
joyexpr opened this issue Mar 6, 2023 · 20 comments
Open

[FR] esc快捷键取消截图需求讨论 #203

joyexpr opened this issue Mar 6, 2023 · 20 comments

Comments

@joyexpr
Copy link

joyexpr commented Mar 6, 2023

目前文档上推荐esc取消截图方案为下述代码,但一旦使用globalShortcut,如果需要在其他页面上使用mousetrap捕捉esc事件就办法了。

需求:提供esc取消截图只在开始截图后才生效。

或者暴露更多screenshots的事件,我们在开始时注册globalShortcut,关闭时取消注册,目前只有ok、cancel、save 三个事件没办法做到上述需求

globalShortcut.register('esc', () => {
if (screenshots.$win?.isFocused()) {
screenshots.endCapture()
}
})

@rhwoodpecker
Copy link
Contributor

可以考虑截图窗口失去焦点的时候取消esc事件注册:

// 聚焦时候注册事件
screenshots.$win.on('focus', () => {
   globalShortcut.register('esc', () => {
        if (screenshots.$win?.isFocused()) {
            screenshots.endCapture()
        }
    })
})

// 失去焦点取消事件
screenshots.$win.on('blur', () => {
 globalShortcut.unegister('esc')
})

@joyexpr
Copy link
Author

joyexpr commented Mar 6, 2023

可以考虑截图窗口失去焦点的时候取消esc事件注册:

// 聚焦时候注册事件
screenshots.$win.on('focus', () => {
   globalShortcut.register('esc', () => {
        if (screenshots.$win?.isFocused()) {
            screenshots.endCapture()
        }
    })
})

// 失去焦点取消事件
screenshots.$win.on('blur', () => {
 globalShortcut.unegister('esc')
})

不行哦,new Screenshots 后,screenshots.$win 是null,没有恰当的时机进行注册focus和blur

@rhwoodpecker
Copy link
Contributor

startCapture() promise 执行完后注册,这时候 $win 是初始化的,可以考虑自己实现一个全局单例添加

@rhwoodpecker
Copy link
Contributor

rhwoodpecker commented Mar 7, 2023

startCapture() promise 执行完后注册,这时候 $win 是初始化的,可以考虑自己实现一个全局单例添加

const singleWrapper = (fn) => {
        let isBind = false;
        return () => {
                if(!isBind) {
                    isBind = true;
                    fn();
                }
         }
  }
        
const bindScreEvent = () => {
    screenshots.$win.on('focus', () => {
         globalShortcut.register('esc', () => {
              if (screenshots.$win?.isFocused()) {
                  screenshots.endCapture()
              }
          })
    })
      
    screenshots.$win.on('blur', () => {
       globalShortcut.unegister('esc')
    })
}
       
const singleBindScreEv = singleWrapper(bindScreEvent)

// 开始截图
await screenshots.startCapture()
singleBindScreEv()

@joyexpr
Copy link
Author

joyexpr commented Mar 7, 2023

good job,测了下在 singleWindow 为 true 下是可行的,但发现当 singleWindow 为 false 时,blur 事件不会触发,需要换成监听 closed 事件。另外 escBound 变量,我就直接挂在 $win 下了~~

@nashaofu
Copy link
Owner

我这边添加一个windowCreated事件是否能满足你们的需求呢?

  screenshots.on('windowCreated', ($win) => {
    $win.on('focus', () => {
      globalShortcut.register('esc', () => {
        if ($win?.isFocused()) {
          screenshots.endCapture();
        }
      });
    });

    $win.on('blur', () => {
      globalShortcut.unregister('esc');
    });
  });

@joyexpr
Copy link
Author

joyexpr commented Apr 21, 2023

我这边添加一个windowCreated事件是否能满足你们的需求呢?

  screenshots.on('windowCreated', ($win) => {
    $win.on('focus', () => {
      globalShortcut.register('esc', () => {
        if ($win?.isFocused()) {
          screenshots.endCapture();
        }
      });
    });

    $win.on('blur', () => {
      globalShortcut.unregister('esc');
    });
  });

可以的,这样就不用在每次调用截屏时去检测处理。

另外,刚才报的0.5.21版本无法触发 $win.on('focus') 事件,mac和win7后面测试了都正常,就linux不行

@nashaofu
Copy link
Owner

nashaofu commented Apr 21, 2023

我这边在 PopOS 上可以触发,你可以拉一下这个仓库的dev分支,运行一下 packages/electron-screenshots 下面的代码试试,克隆到本地后执行一下命令

cd screenshots
yarn 
yarn build 
cd packages/electron-screenshots
yarn start

@joyexpr
Copy link
Author

joyexpr commented Apr 21, 2023

我这边在PopOS上可以触发,你可以拉一下这个仓库的dev分支,运行一下 packages/electron-screenshots下面的代码试试,克隆到本地后执行一下命令

cd screenshots
yarn 
yarn build 
cd packages/electron-screenshots
yarn start

不好意思,统信OS的机器在公司,我得后天上班时试下了。0.5.19和0.5.20之前验证了统信是没问题的

刚看了一眼commit,有点没明白,为什么注释写了linux值为dock时不能触发focus,下面的的代码还是写的dock呢 ?

const windowTypes: Record<string, string | undefined> = {
darwin: 'panel',
// linux 下如果设置为 dock,会导致不能触发 focus 事件
linux: 'dock',
win32: 'toolbar',
};

1 similar comment
@joyexpr
Copy link
Author

joyexpr commented Apr 21, 2023

我这边在PopOS上可以触发,你可以拉一下这个仓库的dev分支,运行一下 packages/electron-screenshots下面的代码试试,克隆到本地后执行一下命令

cd screenshots
yarn 
yarn build 
cd packages/electron-screenshots
yarn start

不好意思,统信OS的机器在公司,我得后天上班时试下了。0.5.19和0.5.20之前验证了统信是没问题的

刚看了一眼commit,有点没明白,为什么注释写了linux值为dock时不能触发focus,下面的的代码还是写的dock呢 ?

const windowTypes: Record<string, string | undefined> = {
darwin: 'panel',
// linux 下如果设置为 dock,会导致不能触发 focus 事件
linux: 'dock',
win32: 'toolbar',
};

@nashaofu
Copy link
Owner

我这边在PopOS上可以触发,你可以拉一下这个仓库的dev分支,运行一下 packages/electron-screenshots下面的代码试试,克隆到本地后执行一下命令

cd screenshots
yarn 
yarn build 
cd packages/electron-screenshots
yarn start

不好意思,统信OS的机器在公司,我得后天上班时试下了。0.5.19和0.5.20之前验证了统信是没问题的

刚看了一眼commit,有点没明白,为什么注释写了linux值为dock时不能触发focus,下面的的代码还是写的dock呢 ?

const windowTypes: Record<string, string | undefined> = { darwin: 'panel', // linux 下如果设置为 dock,会导致不能触发 focus 事件 linux: 'dock', win32: 'toolbar', };

注释忘去掉了

@joyexpr
Copy link
Author

joyexpr commented Apr 21, 2023

啊,注释是错的? 那好像没看到有对linux不能触发focus相关的修复改动?

@nashaofu
Copy link
Owner

我修改了electron-screenshots下的index.ts文件,添加了esc关闭界面的示例,我这边运行正常,想让你也在电脑上测试一下

@joyexpr
Copy link
Author

joyexpr commented Apr 22, 2023

好的,明天到公司了就测下

@joyexpr
Copy link
Author

joyexpr commented Apr 23, 2023

我这边在 PopOS 上可以触发,你可以拉一下这个仓库的dev分支,运行一下 packages/electron-screenshots 下面的代码试试,克隆到本地后执行一下命令

cd screenshots
yarn 
yarn build 
cd packages/electron-screenshots
yarn start

刚刚测了下,在统信下还是没有触发 on focus(on windowCreated有触发),看到有一个报错不知道是否有关:

electron-screenshots SCREENSHOTS:capture NodeScreenshots capture() error Error: /lib/x86_64-linux-gnu/libc.so.6: version `GLIBC_2.33' not found (required by /home/xxx/Downloads/screenshots-dev/packages/electron-screenshots/node_modules/node-screenshots-linux-x64-gnu/node-screenshots.linux-x64-gnu.node) at process.func [as dlopen] (node:electron/js2c/asar_bundle:2:1822) at Module._extensions..node (node:internal/modules/cjs/loader:1259:18) at Object.func [as .node] (node:electron/js2c/asar_bundle:2:1822) at Module.load (node:internal/modules/cjs/loader:1044:32) at Module._load (node:internal/modules/cjs/loader:885:12) at f._load (node:electron/js2c/asar_bundle:2:13330) at Module.require (node:internal/modules/cjs/loader:1068:19) at require (node:internal/modules/cjs/helpers:103:18) at Object. (/home/xxx/Downloads/screenshots-dev/packages/electron-screenshots/node_modules/node-screenshots/index.js:190:31) at Module._compile (node:internal/modules/cjs/loader:1174:14) { code: 'ERR_DLOPEN_FAILED' } +25ms

本机查了下,strings /lib/x86_64-linux-gnu/libc.so.6 | grep GLIBC_,确实最高只到 GLIBC_2.28

@nashaofu
Copy link
Owner

应该不影响,这个问题我再看看吧

@joyexpr
Copy link
Author

joyexpr commented Apr 23, 2023

把 new BrowserWindow里的type: windowTypes[process.platform]注释掉,on focus就能触发了,但发现例子里的窗口白屏了无法加载github页面了,不知道相不相关

@nashaofu
Copy link
Owner

应该不相关,你可以替换为百度,应该也一样

@joyexpr
Copy link
Author

joyexpr commented Apr 23, 2023

在 Linux 上, 可能的类型有 desktop、dock、toolbar、splash、notification

这几个测了下,就只有toolbar的行为是比较正常的(跟不设的效果一样),其他几个值都有些问题

@list12318
Copy link

good job,测了下在 singleWindow 为 true 下是可行的,但发现当 singleWindow 为 false 时,blur 事件不会触发,需要换成监听 closed 事件。另外 escBound 变量,我就直接挂在 $win 下了~~

多谢多谢,我是打开截图弹窗后使用esc关闭,再切到微信点击esc会报错,此方法可以解决,多谢

image

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants