html - 如何使用 Ionic 实现捏合/捏合？

Question

我使用 Ionic4 和 Angular8。

我想在智能手机上捏合/捏合屏幕。

我试过的 以下说明已添加到 index.html。

<meta name = "viewport" content = "viewport-fit = cover, width = device-width, initial-scale = 1.0, minimum-scale = 1.0, maximum-scale = 4.0, user-scalable = yes" />

但事与愿违，在真机上并没有运行。

我也试过了。

以下已添加到 .

scrollX = "true"

然后您现在可以在智能手机的屏幕上捏合/捏合。 但我不知道为什么或为什么。

另外，如果 的高度足够大，需要垂直滚动 捏合屏幕后无法水平滚动。

我不知道为什么。 我想在屏幕放大后进行水平滚动。

如果有人知道怎么做，请告诉我。

Answer 1

您可以使用 Angular 的双指缩放。

The module provides opportunities for image zooming in, zooming out and positioning with use of gestures on a touch screen.

Check out live demo .它易于安装。

1 - 安装 npm 包。

npm i ngx-pinch-zoom

2 - 在你的 ts 中导入模块。像 home.module.ts:

import { PinchZoomModule } from 'ngx-pinch-zoom';

@NgModule({
    imports: [ PinchZoomModule ]
})

3 - 在你的 html 中

<pinch-zoom>
    <img src="path_to_image" /> 
</pinch-zoom>