UIView 标注气泡

Posted 2023-03-21

技术标签:

【中文标题】UIView 标注气泡【英文标题】：UIView Callout Bubble 【发布时间】：2009-12-26 10:20:51 【问题描述】：

当用户在标准视图中触摸 UILabel 时，我希望能够执行 MapView 标注之类的操作。这不是地图视图！或者我可以将鼠标悬停在新的 UIView 上吗？

谁能指点我正确的方向？

谢谢，

【问题讨论】：

【参考方案1】：

我最近这样做了。

您需要两个 UIView 子类：一个外部视图（绘制背景并处理消除气泡）和一个内部视图（绘制气泡本身）。我打电话给我的 IMPBubbleView 和 IMPBubbleInternalView。

在 IMPBubbleView 中，它会将自己设置为当前 UIWindow 的大小，然后将自己添加为窗口的子视图。调用者必须传入一个气泡应该指向的矩形：通过执行 convertRect:toView:（UIView 上的一个方法）并传入 IMPBubbleView 来确定它在窗口中的位置。

IMPBubbleView 创建一个 IMPBubbleInternalView 对象，并将其添加为 self 的子视图。

需要确定是否有空间可以在矩形下方或上方绘制气泡（因此气泡不会最终脱离屏幕）。您可以使气泡视图采用传入的 UIView 对象在其中显示：这是最可重用的 API。然后，您可以询问此视图的大小。一些简单的数学运算，并设置 IMPBubbleInternalView 的 bubbleOnTop 属性。

为了实际绘制气泡本身，我移植了一些 Matt Gemmel 的代码（位于 http://mattgemmell.com/source）来创建气泡轮廓的路径。然后我用以下颜色填充它：

    CGFloat locations[5] =  0.0, 0.5, 0.65, 0.65, 1.0 ;
CGFloat components[20] =  0.0, 0.0, 0.0, 1.0,  // Start color
                          58.0/255, 58.0/255, 58.0/255, 1.0,
                          58.0/255, 58.0/255, 58.0/255, 1.0,
                          91.0/255, 91.0/255, 91.0/255, 1.0,
                          144.0/255, 144.0/255, 144.0/255, 1.0 ; // End color

当您显示 IMPBubbleInternalView 时，您可以使用 Core Animation 使其淡入，或稍微放大然后缩小，或其他任何方式。

最后，您需要处理 IMPBubbleView（绘制背景）中的点击。点击此处应消除气泡。覆盖 touchesEnded:withEvent: 并在触摸对象上使用 locationInView: 方法（以确保您正在处理气泡外的点击）。

我认为这就是一切。我有很多用于添加按钮的东西（我正在模拟复制/粘贴菜单）。

【讨论】：

【参考方案2】：

this answer 中提供了一些可下载的代码来做类似的事情。

【讨论】：

【参考方案3】：

我的方法是创建一个 png 图像，以气泡的样式（当然只对固定大小的气泡有用），子类 UIView，并在创建时将此图像绘制到 UIView 的背景中，我还会添加一个 UILabel 或 UIImage 取决于我想要做什么，无论是显示文本还是图像。

如果你想做可变大小的图像，你会想使用 Quartz2D 并绘制你需要的矩形。虽然这需要更多的工作，但如果做得好，您最终会得到一个更可扩展的组件。

下一步是继承UILabel，并添加一个响应touchesBegan（UIResponder）方法的方法，每次触摸时都会调用它。然后，您可以创建自定义视图并将其显示给用户。通常我会说创建一个委托，但我认为 UILabel/UIView 不支持这一点。

【讨论】：