将 UIButton 上标题右侧的图像与 imageEdgeInsets 和 titleEdgeInsets 对齐

Posted 2023-03-10

【中文标题】将 UIButton 上标题右侧的图像与 imageEdgeInsets 和 titleEdgeInsets 对齐

【英文标题】：Aligning image on right side of title on UIButton with imageEdgeInsets and titleEdgeInsets

【发布时间】：2016-05-04 07:17:37

【问题描述】：

我想在标题右侧添加一张类似这样的图片

|Button  [image]|
|title          |

我可以通过这段代码实现这一点

button.titleEdgeInsets = UIEdgeInsetsMake(0, -10, 0, 0)
button.imageEdgeInsets = UIEdgeInsetsMake(0, 135, 0, 5)

但是当标题很大时，标题标签和图片会相互交叉。 如何打破标题标签？

【问题讨论】：

检查答案。它永远不会与图像相交。

【参考方案1】：

这个扩展对我有用：

扩展名：

extension UIButton 
  func imageToRight() 
      transform = CGAffineTransform(scaleX: -1.0, y: 1.0)
      titleLabel?.transform = CGAffineTransform(scaleX: -1.0, y: 1.0)
      imageView?.transform = CGAffineTransform(scaleX: -1.0, y: 1.0)
  

用法：

button.imageToRight()

iOS 15 更新

如此处所述：Meet the UIKit Button System

创建您的按钮配置 从 .plain()、.gray()、.tinted() 或 .filled() 中选择

var config = UIButton.Configuration.filled()

为您的图片选择展示位置 从全部、顶部、底部、尾随、前导、无中选择

config.imagePlacement = .trailing

将配置分配给您的按钮

让 myButton = UIButton(configuration: config, primaryAction: ...)

【讨论】：

是的，确实如此。上面显示的扩展按预期工作。将图像放在按钮标题的右侧。

【参考方案2】：

试试这个，它永远不会使标题和图像相互交叉。我在故事板的中心创建了一个按钮。 @IBOutlet weak var myButton: UIButton!

  let somespace: CGFloat = 10

  self.myButton.setImage(UIImage(named: "cross"), forState: UIControlState.Normal)

  self.myButton.imageEdgeInsets = UIEdgeInsetsMake(0, self.myButton.frame.size.width - somespace , 0, 0)

  print(self.myButton.imageView?.frame)

  self.myButton.titleEdgeInsets = UIEdgeInsetsMake(0, (self.myButton.imageView?.frame.width)! + somespace, 0, 10 )

如果你想要按钮的多行标题更改按钮标题的换行模式

self.myButton.titleLabel!.lineBreakMode = NSLineBreakMode.ByWordWrapping

Swift 3.0

在 swift 3.0 中，您可以在界面生成器中轻松完成。

选择 UIButton -> Attributes Inspector -> 转到大小检查器并修改图像或标题插图。如果您想要按钮右侧的图像，只需在语义视图实用程序中选择力Right-to-left

.

【讨论】：

嘿，快速评论一下，实际上使用语义内容属性并不是一个好主意。它搞砸了可访问性，尤其是 VoiceOver。如果您向右滑动以导航到下一个元素，并且您到达一个强制为 .forceRightToLeft 的按钮，则向右滑动实际上会反转 VoiceOver 的导航，并将焦点移回前一个元素。如果您再次向右滑动，您将回到强制从右向左的按钮上，依此类推。因此，用户基本上陷入了焦点陷阱，这可能会让人感到困惑。

确实如此。这只是一个黑客。如果有人在他们的项目中使用可访问性并支持多种语言，则不应使用它。