对从剪贴板粘贴的图像自动应用缩放比例

功能
1

我使用的是 HiDPI 显示器，缩放比例为 150%。每次我截屏并将其粘贴到 Discourse 中时，一切都显得太大。我需要手动为图像应用缩放比例才能使其看起来正常。

假设我截取了下面这个 110x110 像素的框的屏幕截图。

image
image110×110 77 Bytes

当我将该屏幕截图（Ctrl+V）粘贴到编辑器中时，我得到一个 167x167 像素的图像。

image
image167×167 96 Bytes

![image|167x167](upload://fWfpRZXtBMVBXjcMTAPOwtG5bND.png)

理想情况下，我应该得到一个正确尺寸的图像，而无需记住正确的缩小百分比（在本例中为 66%）。

image
image167×167 96 Bytes

![image|167x167, 66%](upload://fWfpRZXtBMVBXjcMTAPOwtG5bND.png)

我看到了两种选择。如果缩放比例不等于 1，则：

  1. 自动为图像 Markdown 添加正确的缩放比例
    ![image|167x167, 66%](...)

或者

  1. 在预览窗口的图像工具箱中添加正确的缩放比例
    image

缩放比例可以用 JavaScript 计算：

Math.floor(100 / window.devicePixelRatio)
6 个赞
2

这是一个很棒的主意，我一直也为此苦恼。

我一边想一边说，如果用户复制粘贴了一个非截图的图片，这会不会导致误报？

另外，关于重新实现，我不明白为什么我们不能同时实现 1 和 2。

4 个赞
3

是的，粘贴非屏幕截图的图片时会产生误报。我想知道屏幕截图和非屏幕截图的图片哪种插入得更频繁。:thinking:

1 个赞
4

不确定，我想这取决于用户以及你发布什么样的照片。有时我会在手机上复制一张图片，然后粘贴到电脑上，所以也有这种情况。

无论如何，从选项 2 开始可以避免误报，它只会为预览提供一个更好的默认备选尺寸。

1 个赞
5

看起来截图工具会将一些关于 DPI 的信息编码到 PNG 文件中。例如，如果我将高 DPI macOS 环境下的截图上传到 https://www.metadata2go.com/，我会看到

SCR-20230913-pxzb
SCR-20230913-pxzb1258×254 4.19 KB

如果我关闭 HiDpi，那么这些元数据字段似乎会从文件中消失。

@gerhard，你在 Windows 上也看到类似的情况吗？如果看到了，也许我们可以用 JS 读取它并猜测像素密度。

我还发现了 这个 gist，可能有用。

2 个赞
6

我也在研究解析 PNG 的前几个字节，用于远程动画 PNG 失去动画，所以我们在这里有多个使用钩子的场景。

2 个赞
7

我在 Linux 上使用 Spectacle，但它似乎没有向元数据添加任何内容。

该 gist 中的代码在我的 Linux 系统上使用 150% 缩放因子创建的屏幕截图返回 false。该图像的 pHYs 块如下所示：

{ xDpu: 3780, yDpu: 3780, xDpi: 96, yDpi: 96, unit: 'meter' }
3 个赞