ios - 类似于折线图的 Swift 动画

Question

我的问题可能有点令人困惑，但我会尽力解释它。所以我需要在图像中创建一个如下图所示的视图，它看起来像一个折线图。

换句话说，线拇指应该是交互式的，以便用户可以上下移动它们，这将导致每对之间的“绳索”移动。问题是我无法弄清楚在 swift 中启动什么样的结构以便我可以创建这个视图。到目前为止，我正在考虑创建单独的滑块并通过在它们之间绘制线条来连接它们，但我认为应该有一些更好的解决方案。感谢任何帮助、想法、建议或提示。提前致谢。

标签： iosswiftanimationsprite-kit

Answer 1

第 1 部分。学习在 UIView 中使用“drawRect”

制作自定义视图，即 UIView 的子类。要绘制九个有角度的线段（实际上是后面的网格），您需要掌握核心图形。幸运的是，有很多关于这个主题的 QA：

如何在swift中以最简单的方式画一条线

第 2 部分. UIView 中的自定义层

您必须了解如何将自定义 CALayers 添加到视图。有很多这样的例子，例如

https://stackoverflow.com/a/57465440/294884
https://stackoverflow.com/a/41553784/294884

（请注意，对于小文本标签，我可能会简单地以编程方式添加许多 UILabel，您还需要了解这些内容。）

第 3 部分。使用 UISlider

为每个红点使用 UISlider 确实没有错。如果您刚刚开始使用 iOS，我建议您先尝试熟悉它。

一个方便的提示是，只需使用水平堆栈视图来保存它们 - 你可以随意放置它们。

第 4 部分。使用手势

超越 UISlider。红色按钮很可能是自定义 UIViews。而且，最简单的是，您将使用它UIPanGestureRecognizer来检测手指的移动。

同样，您可以在该研究领域找到许多 QA，例如使用 pangesture 在父视图中移动 UIView

如果你掌握了这四个一般领域，你将能够实现有问题的观点，祝你好运！