如何在不同的屏幕尺寸上获得完全相同的点？

Question

我想在用户点击 image 的特定区域（黑点）时调用操作（转到另一个视图）：。图像填充整个视图，内容模式为 'Aspect Fit'。问题是，当我在一个屏幕尺寸（例如 iPhone 8）上将它设置在另一个屏幕尺寸上时，'tap area' 被移动了。我尝试使用按钮和约束或 UITapGestureRecognizer 使用屏幕分辨率 (nativeBounds) 进行点转换来解决此问题，但没有任何帮助。

Answer 1

您可以尝试创建自己的 UIView 子类 BlackDotsView。

，而不是使用图像

在draw(_rect:)方法中，可以绘制线条。要确定线条的起点和终点，您需要对视图的宽度和高度进行一些计算。您计算所有线条的结束位置并创建 UIBezierPaths，然后绘制路径。

在BlackDotsView的初始值设定项中，您可以将点添加为子视图。要使它们成为圆形，只需将 dotView.layer.cornerRadius 设置为点宽度的一半。然后，您可以将 UITapGestureRecognizers 添加到点视图中。

您可以通过创建具有名为 dotTapped(index:) 的方法的 BlackDotsViewDelegate 来遵循委托模式。当点击一个点时，您将调用委托方法并传递点的索引。

Answer 2

可以使用约束来匹配圆圈的位置与 UIButtons。诀窍是使用约束的 multiplier 来缩放按钮 width/height 并定位到屏幕大小。

我将介绍如何为一个按钮执行此操作，然后您可以为其他按钮重复此操作。我假设图片的宽度为 657，高度为 918。如果我颠倒了尺寸，您需要用实际值替换我使用的值。

1. 创建一个 UIView 来保存图像和按钮。给这个视图一个宽高比约束 multiplier 657:918 即 width:height。将 UIImageView 添加到此视图并将其 4 条边约束到具有 0 偏移量的视图的边缘。将此视图约束为主视图的左右边缘，并为其设置垂直约束以将其放置在屏幕上。
2. 获取图中圆的width/height以及右边缘和下边缘的水平和垂直位置。例如，最上面的圆是 106 x 106 并在水平位置 392 结束，底部是 338.
3. 将按钮的宽度设置为等于包含视图的宽度，乘数 106:657 即图像 circle:width 的宽度。
4. 将按钮的高度设置为等于包含视图的高度，乘数 106:918 即图像 circle:height 的高度。
5. 将按钮的后缘设置为等于包含视图的后缘，乘数 392:657 是图像 circle:width 的末尾。
6. 将按钮的底边设置为等于包含视图的底边，乘数 338:918 是图像 circle:height 的底部。

这将使按钮在所有设备上都与圆圈对齐。对其他圆圈重复步骤 2 到 6。