如何以编程方式为处于触摸状态的 UIButton 创建灰色叠加层？

Posted 2023-03-11

【中文标题】如何以编程方式为处于触摸状态的 UIButton 创建灰色叠加层？

【英文标题】：How to create a gray overlay for a UIButton in touched state programmatically?

【发布时间】：2012-03-23 16:05:20

【问题描述】：

我想创建一个通用类，当点击它时，会使元素变灰。

Facebook 的应用程序是我想要实现的目标的完美示例。点击时，他们所有的链接和图像都会变灰。

我只能猜测它们是UIButton 的子类化。

我已将按钮样式设置为UIButtonTypeCustom 以摆脱圆形边框。除此之外，我不知道如何使用灰色叠加层，因为我在文档中没有看到这样的属性。

【问题讨论】：

我很确定他们使用的是 WebView，它以那种灰色突出显示触摸的链接。

我需要在本机代码中模拟这个 WebView 突出显示。

@JoJo：参考我的回答。我已经编辑了我的答案。我认为这会对你有所帮助。

我喜欢这个***.com/questions/6309225/…

【参考方案1】：

很简单：

#define TAG_GRAYVIEW 5671263 // some random number

// add the gray overlay
UIView *grayView = [[UIView alloc] initWithFrame:button.bounds];
grayView.backgroundColor = [UIColor grayColor];
grayView.tag = TAG_GRAYVIEW; 

[button addSubview:grayView];

// remove the gray overlay
UIView *grayView = [button viewWithTag:TAG_GRAYVIEW];
[grayView removeFromSuperview];

【讨论】：

您会使用UIResponder 的touchesBegan:withEvent: 添加覆盖层并使用touchesEnded:withEvent: 删除覆盖层吗？

@JoJo 应该可以正常工作，因为它在主线程上调用。

这很简单，效果很好！我只是在一个 UIImageView 上使用它，漂亮！

【参考方案2】：

我认为您需要使用半透明的灰度图像 PNG 文件。然后您需要将按钮的图像设置为Highlighted 状态。

还要注意NormalState 和HighlightedState 的图片都需要带有标题的图片。

一旦我们将图像设置为按钮，btn.titleLabel.text 将不会显示。

因此，您可以为Normal 状态提供一个带有透明背景和标题的图像。还有一个带有标题的灰色图像，用于Highlighted State。

以编程方式进行的代码是

[btn setImage:@"Transperant.png" forState:UIControlStateNormal];
[btn setImage:@"Grey.png" forState:UIControlStateHighlighted];

希望对你有所帮助。

【讨论】：

@JoJo：请参考我的回答。我认为这是最简单的解决方案

【参考方案3】：

默认UIButton 使用灰色突出显示不透明的内容。例如，当使用透明 png 时，只有包含不透明像素的部分才会在触摸时变灰。默认的UIButton 高亮对子视图/子图层没有影响，并且只对提供的图像起作用。您在 Facebook 应用中看到的可能只是 UIWebView 的一个亮点，可能是使用 css 自定义的。

要使用您自己的控件创建类似的内容（以防止UIWebView 的开销），您可能应该创建自己的UIControl 子类并使用透明的CALayer 突出显示触摸内容。您甚至可以屏蔽 CALayer 以仅突出显示实际内容，而不是矩形。

另请参阅我在 creating custom controls for ios by subclassing UIControl 上的 *** 帖子。

【参考方案4】：

尝试像这样设置按钮。 *请注意，我没有为此示例创建图像。

将您的按钮类型设置为自定义，然后在“状态配置”中选择“突出显示”，您需要将按钮的图像设置为半透明的灰色图像。可能还有其他几种方法可以达到同样的效果，但这个应该很好而且简单。

【讨论】：

我不会使用 Interface Builder。我的视图将通过代码动态生成。