Question

我需要能够在Android和iOS上进行缩放以缩放字体大小。（不仅仅是我在谷歌搜索时看到的众多例子的常规图像）。有人可以告诉我，如果在Ionic 3中有一个简单的方法吗？

Documentation，推断您可以使用（捏）。但这绝不是开箱即用的。
我知道Ionic使用的是Hammer.JS ...... this source。
Ionic Forums建议您使用@ViewChild和手动添加listen和on处理程序的组合启用它。

然后由于某种原因，事件永远不会在带有触摸板的Macbook Pro上发生，但是当我将其上传到Ionic View事件时，当我尝试捏缩放时会触发事件。我想知道是否有一些导航器代理选择不能在Macbook Pro上启用，因为触摸板应该有助于此吗？

更新：也许您需要touch emulator script在Macbook Pro上执行操作。我还在阅读here

iOS上的Safari没有窗口，滚动条或调整大小按钮....用户通过轻弹手指来平移。该用户通过双击和捏开来放大，并缩小捏闭合手势，不适用于Safari 桌面。由于用户与网络互动的方式不同内容，桌面和iOS上的视口都不一样。

所以也许这可能就是为什么Hammer不适用于原生的Macbook Pro ..

在Ionic页面上搜索手势时，你也会得到page（Haptic / Taptic - 它推断的是iOS依赖的）。

我还认为可能与index.html中配置viewport的方式有关。但这似乎是一个兔子洞，没有得到一个干净的解决方案per this thread，而且这似乎是iPhone特有的。

我也看到了：

Gestures - Patterns on Material.io

This blog post捏缩放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"属性可以方便地检测“pinchout”和“pinchin”..我似乎加倍了火。

虽然这种方法在iPhone上看起来很好（除了多个事件发射）...我正在测试的Android三星Galaxy S4手机似乎经常反转，并引发了许多事件。我随后在一位拥有最新浏览器的同事三星Galaxy S8上进行了测试。我想我可能需要打包一个最新的浏览器。但我认为这也不会解决它。没有详尽的测试，看起来Android第一次给出了正确的答案，之后它反转了东西。所以我想知道每个手指的坐标是否都以某种方式被缓存，因此后续的进出请求都是基于陈旧的数据。是否有HammerJS重置配置设置？

我也知道这些其他库（也不需要jQuery）：

InteractJS再次，他们的缩放缩放示例无法在带触摸板的Macbook Pro上运行。

Jester

脚注：我见过的最适合缩放的实现，适用于Android和iOS的是MichaëlCHAIZE的this版本。但是从分析代码开始，它看起来基于HammerJS 0.5的早期实现，甚至不使用pinch作为域语言的一部分 - 就像拖动，转换，点击，double_tap这样的东西，所以它必须促进这个东西通过较低级别的抽象。不幸的是，这是为图像。

Answer 1

经过一些搜索，您可以根据自己的需要进行长篇解释，但这需要针对您的版本进行增强，并且还需要对其中的某些部分进行调整：

基本上有

需要3个文件
library(JuliaCall)
julia_setup()
julia_eval("2//3")
## Julia Object of type Rational{Int64}.
## 2//3
julia_eval("2//3")^2L 
## Error
`^.JuliaObject` <- function(x, n) julia_call("^", x, n, need_return = "J")
julia_eval("2//3")^2L
## Julia Object of type Rational{Int64}.
## 4//9
julia_eval("[2//3, 2//3]")
## [[1]]
## Julia Object of type Rational{Int64}.
## 2//3
## [[2]]
## Julia Object of type Rational{Int64}.
## 2//3
julia_eval("[2//3, 2//3]")^2L
## Error
<强> home.html的

~/src/pages/home/home.ts ~/src/pages/home/home.scss ~/src/pages/home/home.html元素是固定容器   您需要将事件附加到哪里，其子项是   要缩放的项目。

<强> home.scss

<div #zoom class="zoom">填充容器大小，具有固定位置和   .zoom需要的重要touch-action: none。

<强> home.ts

内容可以在没有页脚的情况下确定实际大小   并且标题会妨碍HammerJS只添加for loop的每个子项的absolute height原始大小等于   #zoom.表示viewport，   因为我们覆盖滚动，查看将要的内容   最有可能溢出底部和右边（因为它固定而且可以   通过平移将完成任何规模）所以我们必须知道它有多少   四溢。

平移的最大尺寸是原始的溢出尺寸，现在之前   缩放，缩放首先等于1。基地是要记住哪里   我们在捏缩放时就离开了。

我们发起单独听取的事件*，panend＆amp; pancancel as   以及pinchend＆amp;每个都根据时间调用pinchcancel   当你释放手指所以必须添加两个手指时，要打电话给他们   各自的onEnd功能。

setCoor功能

设置x＆amp; y坐标确保它不会超过它   最大

转换功能

移动＆＃34;翻译＆＃34;，并缩放#zoom元素，xx＆amp;你是为了   重置职位

onPinchend功能

设置基数，并设置比例限制

onPinch功能

根据中断位置设置比例。

完整代码可以从Here获得，他完成了大部分工作，如果你需要添加任何其他功能，你可以增强它。

注意：从Github获取的解释和代码，如果对您有所帮助，请尝试归功于该作者。

使用Ionic3和Hammer.JS捏缩放手势的独家新闻是什么？

1 个答案: