为什么手机截图很模糊

‘壹’ 手机为什么截屏总是模糊的呢

分享是传播活动，吸引用户最重要的一环。现有分享手段多是题目配合单张图片，利用点击的方式跳转到目标页面。在信息越来越丰富的今天，单个题目和图片对用户的吸引力是有限的。而在对推广要求更高的营销场景和裂变过程中，我们往往需要将页面内容一部分作为图片整体分享出去。直接利用手机原生的截屏功能会有几个问题：
内容格式无法自定义。

翻页情况无法处理。

视窗区域不可控。

本文通过讨论现有截屏的方案和闲鱼内部截屏方案，介绍如何利用web实现移动端高还原度富图文分享。
现有方案：Html2Canvas
介绍
html2canvas是一种基于canvas，将DOM结构绘制在canvas上面产生图片的第三方库。通过如下的方式可以将对应的DOM结构绘制成图片保存出来。优势在于上手简单，使用方便。

绘制原理
原理如下图所示。核心逻辑是克隆对应节点DOM结构，利用parse解析成数据，构建canvas进行内容绘制，返回对应的canvas。

实际使用中发现存在如下问题
图片跨域不支持。生成的图片存在跨域限制问题。
绘制清晰度低。即使使用api scale放大后绘制，又会由于生成base64格式图片内容过长导致无法传输。
圆弧计算精度低。由于html2canvas是计算像素后绘制到canvas上，而canvas展示又会经过浏览器绘制，导致像素精度降低。
深度节点出现黑色情况。由于DOM结构过深，经过像素计算后，会偶尔出现像素丢失情况。
现有方案：SVG
介绍
该方案是利用svg可以包裹DOM结构的特性，将对应目标装载进去，之后将svg导出成base64格式的图片。使用方式如下。通过xmlns指定命名空间，防止多集合下元素和属性的冲突。后缀中的 svg和 xhtml分别表示解析方式。利用不同的解析方式，实现了svg内部嵌入html的方式。

之后只要通过 encodeURIComponent(svg)将对应的svg转换成base64就可以。优势是容易上手且不依赖第三方库。
实际使用中发现存在如下问题
SVG无法连接到外部的资源。比如通过cdn引入的css以及html中的图片连接都会被限制。
不支持js执行。现如今SPA页面都需要执行JS后才会渲染对应的DOM节点，而SVG却不支持JS的执行。
SVG位置和大小不确定。遇到需要及时展示的情况，需要实时计算位置才行。
解决方案
思路
从上面可以看到，现有的两种主流移动端截屏方案都有自己的不足。相比之下，利用canvas绘制的方法更适合SPA应用。那么我们需要解决的是html2canvas对应的几个问题：图片跨域，清晰度低，圆弧计算精度差，深层节点解析出错。
图片跨域
通过 newImage()的方式生成图片，在 image.onload阶段使用canvas绘制图片。此时会产生跨域限制，需要通过 crossOrigin='Anonymous'设置来解决这个问题。

提高清晰度
在绘制中发现，如果采用宽度375px的canvas将图片导出，会出现图片模糊的情况。一种方案是提高原图片清晰度，但是加载时间会极大延长，用户体验不友好。另一种方式是放大canvas，利用 drawImage中的参数控制图片坐标和canvas中的绘制坐标。drawImage中包含几个参数：控制图片的sx, sy, sWidth, sHeight和控制canvas绘制的x, y, width, height。参数具体含义如图中所示。

‘贰’ 为什么手机截图很清晰，发到网上就很模糊

客户端传图片服务器压缩所变模糊建议升级漆.二版本客户端设置浏览设置面打原图模式清晰缺点耗流量

‘叁’ 手机截屏不清楚是怎么回事

若使用的是vivo手机，手机截屏的图片与屏幕分辨率会保持一致。如果手机屏幕分辨率较低，那截屏之后放大查看可能会比较模糊；若图片经过软件传输，图片分辨率和大小会被压缩，也会导致截图模糊，建议在上传或发送截图时尽量选择原图传送。

‘肆’ 为什么我手机截图出来那么模糊

如果是三方软件，可能是兼容性问题
如果自身携带的，升级下看看，不行可能硬件问题

‘伍’ 手机截图为什么模糊

这是软件为了增加速度，在发送图片时将图片进行压缩导致的，可以将图片压缩，可以将图片仅保存压缩后发送，收到后再解压，不过比较麻烦。
用压缩软件将图片仅保存压缩，有的文件管理软件就可以的，然后发送压缩包对方收到后再进行解压，就能最大程度的保持图片质量。

‘陆’ 为什么手机截图发出来模糊

因为没有点击发送原图，发送原图的方法如下：

需要用到的工具：微信app、vivo x21手机

以vivo x21手机为例，步骤如下：

1、打开微信app，找到需要发送截图的对话框并点击，如下图：

‘柒’ 手机截图模糊怎么回事

原因：手机截图模糊是因为屏幕分辨率设置过低，屏幕分辨率设置过低就会导致截图模糊，只需要把屏幕分辨率调高就可以了。

苹果手机截屏方法如下：

工具：iPhone 8

操作系统：iOS 14.4.1

1、以苹果8为例，进入手机“设置”界面，点击“辅助功能”。

‘捌’ 为什么截图很模糊

1、手机截屏的图片与手机屏幕分辨率要保持一致。如果您的手机屏幕分辨率较低，那截屏之后放大查看可能会比较模糊。

2、若图片经过软件传播，图片分辨率和大小会被压缩，也是会导致截图模糊的，建议您在上传或发送时尽量选择原图传送，即可查看清晰截图。

3、编辑加工图片也可能会导致图片模糊。

截屏是一种截取图片或文字的途径，也是一种计算机运用技术。通过这种技术可以从网上截取下自己感兴趣的文章图片供自己使用观看，可以帮助人们更好的去理解使用知识。是一种人人都能使用并且学会方法。可以通过一些软件实现截屏功能。

‘玖’ 我是vivo手机，为什么截图的图片很模糊，先这像

截屏的图片与手机屏幕分辨率会保持一致，如果您的手机屏幕分辨率较低，那截屏之后放大查看可能会比较模糊。若图片经过软件传播，图片分辨率和大小会被压缩，也是会导致截图模糊的，建议您在上传或发送时尽量选择原图传送，即可查看清晰截图。