我需要能够在Android和iOS上进行捏合以缩放字体大小。(不仅仅是我在谷歌搜索时看到的众多例子中的常规图像)。有人可以让我知道在 Ionic 3 中是否有一种简单的方法可以做到这一点吗？
- 文档，推断您可以使用(捏)。但这永远不是开箱即用的。
- 我知道Ionic使用锤子.JS在幕后...根据此来源。
-
Ionic Forums建议您可以使用
@ViewChild和手动添加listen和on处理程序的组合来启用它。然后由于某种原因，该事件永远不会在带有触摸板的 Macbook Pro 上触发，但是当我将其上传到 Ionic View 事件时，当我尝试进行捏合缩放时会触发。我想知道是否有一些导航器代理选择无法在Macbook Pro上启用功能，因为触摸板应该可以促进这一点？
更新：也许您需要触摸模拟器脚本才能在Macbook Pro上执行操作。我也在这里读书
iOS上的Safari没有窗口，滚动条或调整按钮大小。用户通过轻弹手指进行平移。这 用户通过双击和捏合打开来放大，缩小 收缩合拢 - 在 桌面。由于用户与网络交互的方式不同 内容，桌面和iOS上的视口是不一样的。
所以也许这就是为什么Hammer不能在原生Macbook Pro上运行的原因。
在Ionic页面上搜索手势时，您也会得到此页面(触觉/触觉 - 它推断出它依赖于iOS)。
我还认为可能与索引.html中配置视口的方式有关。但这似乎是一个兔子洞，根据此线程没有干净的解决方案，这似乎是特定于iPhone的。
我还看到：
手势 - Material.io 上的图案
这篇关于 Pinch to Zoom on Android 的博客文章。
使用JSON.stringify事件警报 - 您可以使用与论坛类似的来源在iPhone中捏合缩放来获得这些属性。我通过查看iPhone警报手动输入了它。所以可能有奇怪的错别字。我省略了很多实际值...
人们是否倾向于使用带有收缩事件的 RxJS 去抖动来限制放大/缩小的速率？
{"pointers": [{},{}],
"changedPointers": [{}],
"pointerType": "touch",
"srcEvent":{"isTrusted":true},
"isFirst":false,
"isFinal":false,
"eventType":2
"center":{"x":158, "y":302}
"timeStamp":
"deltaTime":
"angle":
"distance":
"deltaX":,
"deltaY":,
"offsetDirection":,
"overallVelocityX":,
"overallVelocityY":,
"overallVelocity":,
"scale":,
"rotation":,
"maxPointers":,
"velocity":,
"direction":,
"target":,
}
我还认为有一个"additionalEvent"属性可以方便地检测"捏"与"捏"..我似乎加倍火力。
虽然这种方法在iPhone上似乎很好(除了多个事件触发)......我正在测试的Android三星Galaxy S4手机似乎经常颠倒这一点，并引发许多事件。随后，我还在同事三星Galaxy S8上进行了测试，该同事具有最新的浏览器。我想我可能需要打包一个最新的浏览器。但我也不认为这能解决它。如果没有详尽的测试，看起来Android第一次就给出了正确的答案，然后它颠倒了东西。所以我想知道每个手指的坐标是否以某种方式被缓存，所以随后的捏入和捏出请求是基于陈旧的数据。是否有 HammerJS 重置配置设置？
我也知道这些其他库(也不需要jQuery)：
InteractJS 同样，他们的罐头捏缩放示例无法在带有触摸板的Macbook Pro上运行。
弄臣
脚注：我见过的最好的捏合缩放实现，适用于Android和iOS是Michaël CHAIZE的这个版本。但是从分析代码来看，它看起来是基于 HammerJS 0.5 的真正早期实现，甚至没有使用 pinch 作为域语言的一部分 - 只是像拖动、转换、点击double_tap这样的东西，所以它必须通过较低级别的抽象来促进这些东西。不幸的是，这是针对图像的。
从经过一些搜索后冗长的解释的输入来看，这可能适合您的需求，但它需要针对您的版本进行增强，并且它的某些部分也需要调整：
基本上有
需要 3 个文件
~/src/pages/home/home.ts ~/src/pages/home/home.scss ~/src/pages/home/home.html首页.html
<div #zoom class="zoom">元素是固定容器 您需要将事件附加到的位置，其子项是 将缩放的项目。家.scss
.zoom填充容器尺寸，具有固定位置和HammerJS需要的重要touch-action: none。首页
在没有页脚的情况下，需要内容来计算实际大小 和标题妨碍，
for loop只是增加了每个子#zoom.子项的absolute height原始大小等于viewportuser sees minus the actual size of the content， 由于我们覆盖了滚动，因此查看的内容将 很可能溢出底部和右侧(因为它是固定的并且可以 是任何大小)，将通过平移完成，因此我们必须知道它有多少 四 溢。要平移的最大大小是原始溢出大小，目前之前 缩放，缩放一开始将等于 1。基地是记住在哪里 我们在捏住缩放时离开了。
我们单独发起活动监听*，panend 和 pancancel 作为 Well和Pinchend和Pinchcancel 各自根据时间调用 当你松开手指时，必须添加两个，以调用他们的 相应的结束功能。
设置库尔函数
设置 X 和 Y 坐标，确保它不会超过它 .max
变换函数
移动"翻译"，并缩放 #zoom 元素，xx 和 yy 用于 重置位置
上捏合功能
设置基础，并设置比例限制
上捏合功能
根据比例停止的位置设置比例。
完整的代码可以从这里得到，他已经完成了大部分的工作，如果需要添加任何其他功能可以增强它。
注意：解释和代码取自 Github，如果它对您有帮助，请尝试归功于该作者。