我有一个UIButton带有文本“探索应用程序”和UIImage(>)的Interface Builder内容，如下所示：
[ (>) Explore the app ]
但我需要把它放在UIImage文本之后：
[ Explore the app (>) ]
我怎样才能UIImage向右移动？
问问题
88060 次
16 回答
164
我的解决方案很简单
[button sizeToFit];
button.titleEdgeInsets = UIEdgeInsetsMake(0, -button.imageView.frame.size.width, 0, button.imageView.frame.size.width);
button.imageEdgeInsets = UIEdgeInsetsMake(0, button.titleLabel.frame.size.width, 0, -button.titleLabel.frame.size.width);
于 2013-02-05T14:37:32.817 回答
136
从iOS 9开始，实现这一点的一种简单方法似乎是强制视图的语义。
或以编程方式，使用：
button.semanticContentAttribute = .ForceRightToLeft
于 2015-08-14T16:41:33.820 回答
86
设置imageEdgeInset和titleEdgeInset以在图像中移动组件。您还可以使用这些全尺寸图形创建一个按钮，并将其用作按钮的背景图像（然后用于titleEdgeInsets移动标题）。
于 2010-03-25T13:59:11.417 回答
54
Raymond W 的答案在这里是最好的。具有自定义 layoutSubviews 的子类 UIButton。非常简单，这是一个对我有用的 layoutSubviews 实现：
- (void)layoutSubviews
{
// Allow default layout, then adjust image and label positions
[super layoutSubviews];
UIImageView *imageView = [self imageView];
UILabel *label = [self titleLabel];
CGRect imageFrame = imageView.frame;
CGRect labelFrame = label.frame;
labelFrame.origin.x = imageFrame.origin.x;
imageFrame.origin.x = labelFrame.origin.x + CGRectGetWidth(labelFrame);
imageView.frame = imageFrame;
label.frame = labelFrame;
}
于 2011-09-19T01:30:53.603 回答
30
子类化UIButton和覆盖layoutSubviews呢？
然后对self.imageView&的位置进行后处理self.titleLabel
于 2010-11-03T15:36:29.670 回答
14
另一种简单的方法（不仅仅是 iOS 9）是继承 UIButton 来覆盖这两个方法
override func titleRectForContentRect(contentRect: CGRect) -> CGRect {
var rect = super.titleRectForContentRect(contentRect)
rect.origin.x = 0
return rect
}
override func imageRectForContentRect(contentRect: CGRect) -> CGRect {
var rect = super.imageRectForContentRect(contentRect)
rect.origin.x = CGRectGetMaxX(contentRect) - CGRectGetWidth(rect)
return rect
}
contentEdgeInsets已经通过使用 super 考虑在内。
于 2016-06-22T15:08:36.597 回答
10
如果您的应用同时支持“从左到右”和“从右到左”，则不能选择强制按钮从右到左。
对我有用的解决方案是一个子类，它可以添加到故事板中的按钮中，并且可以很好地处理约束（在 iOS 11 中测试）：
class ButtonWithImageAtEnd: UIButton {
override func layoutSubviews() {
super.layoutSubviews()
if let imageView = imageView, let titleLabel = titleLabel {
let padding: CGFloat = 15
imageEdgeInsets = UIEdgeInsets(top: 5, left: titleLabel.frame.size.width+padding, bottom: 5, right: -titleLabel.frame.size.width-padding)
titleEdgeInsets = UIEdgeInsets(top: 0, left: -imageView.frame.width, bottom: 0, right: imageView.frame.width)
}
}
}
其中“填充”是标题和图像之间的空间。
于 2018-02-27T16:10:54.940 回答
5
在斯威夫特：
override func layoutSubviews(){
super.layoutSubviews()
let inset: CGFloat = 5
if var imageFrame = self.imageView?.frame,
var labelFrame = self.titleLabel?.frame {
let cumulativeWidth = imageFrame.width + labelFrame.width + inset
let excessiveWidth = self.bounds.width - cumulativeWidth
labelFrame.origin.x = excessiveWidth / 2
imageFrame.origin.x = labelFrame.origin.x + labelFrame.width + inset
self.imageView?.frame = imageFrame
self.titleLabel?.frame = labelFrame
}
}
于 2015-03-16T16:32:21.753 回答
4
通过@split建立答案......
答案很棒，但它忽略了按钮可能具有预先设置的自定义图像和标题边缘插图（例如在情节提要中）的事实。
例如，您可能希望图像在容器的顶部和底部有一些填充，但仍将图像移动到按钮的右侧。
我用这种方法扩展了这个概念：-
- (void) moveImageToRightSide {
[self sizeToFit];
CGFloat titleWidth = self.titleLabel.frame.size.width;
CGFloat imageWidth = self.imageView.frame.size.width;
CGFloat gapWidth = self.frame.size.width - titleWidth - imageWidth;
self.titleEdgeInsets = UIEdgeInsetsMake(self.titleEdgeInsets.top,
-imageWidth + self.titleEdgeInsets.left,
self.titleEdgeInsets.bottom,
imageWidth - self.titleEdgeInsets.right);
self.imageEdgeInsets = UIEdgeInsetsMake(self.imageEdgeInsets.top,
titleWidth + self.imageEdgeInsets.left + gapWidth,
self.imageEdgeInsets.bottom,
-titleWidth + self.imageEdgeInsets.right - gapWidth);
}
于 2014-08-13T02:14:05.107 回答
2
// Get the size of the text and image
CGSize buttonLabelSize = [[self.button titleForState:UIControlStateNormal] sizeWithFont:self.button.titleLabel.font];
CGSize buttonImageSize = [[self.button imageForState:UIControlStateNormal] size];
// You can do this line in the xib too:
self.button.contentHorizontalAlignment = UIControlContentHorizontalAlignmentRight;
// Adjust Edge Insets according to the above measurement. The +2 adds a little space
self.button.imageEdgeInsets = UIEdgeInsetsMake(0, 0, 0, -(buttonLabelSize.width+2));
self.button.titleEdgeInsets = UIEdgeInsetsMake(0, 0, 0, buttonImageSize.width+2);
这将创建一个右对齐按钮，如下所示：
[ button label (>)]
该按钮不会根据上下文调整其宽度，因此标签左侧会出现空格。您可以通过从 buttonLabelSize.width 和 buttonImageSize.width 计算按钮的框架宽度来解决此问题。
于 2012-08-27T12:20:22.290 回答
1
button.semanticContentAttribute = UISemanticContentAttributeForceRightToLeft;
button.contentHorizontalAlignment = UIControlContentHorizontalAlignmentRight;
于 2016-03-26T18:48:46.427 回答
1
基于以前的答案。如果您想在图标和按钮标题之间留出边距，代码必须稍作更改，以防止标签和图标浮动到固有大小按钮的边界之上。
let margin = CGFloat(4.0)
button.titleEdgeInsets = UIEdgeInsetsMake(0, -button.imageView.frame.size.width, 0, button.imageView.frame.size.width);
button.imageEdgeInsets = UIEdgeInsetsMake(0, button.titleLabel.frame.size.width, 0, -button.titleLabel.frame.size.width)
button.contentEdgeInsets = UIEdgeInsetsMake(0, margin, 0, margin)
最后一行代码对于自动布局的内在内容大小计算很重要。
于 2017-01-24T11:48:25.483 回答
1
Swift 中的单行解决方案：
// iOS 9 and Onwards
button.semanticContentAttribute = .forceRightToLeft
于 2020-07-28T09:35:59.247 回答
0
此解决方案适用于 iOS 7 及更高版本
只是 UIButton 的子类
@interface UIButton (Image)
- (void)swapTextWithImage;
@end
@implementation UIButton (Image)
- (void)swapTextWithImage {
const CGFloat kDefaultPadding = 6.0f;
CGSize buttonSize = [self.titleLabel.text sizeWithAttributes:@{
NSFontAttributeName:self.titleLabel.font
}];
self.titleEdgeInsets = UIEdgeInsetsMake(0, -self.imageView.frame.size.width, 0, self.imageView.frame.size.width);
self.imageEdgeInsets = UIEdgeInsetsMake(0, buttonSize.width + kDefaultPadding, 0, -buttonSize.width);
}
@end
用法（在你班上的某个地方）：
[self.myButton setTitle:@"Any text" forState:UIControlStateNormal];
[self.myButton swapTextWithImage];
于 2016-10-11T15:23:38.347 回答
0
这是我自己做这件事的方式，（大约 10 年后）
- UIButton 的子类（按钮，因为我们生活在 Swift 时代）
- 将图像和标签放在堆栈视图中。
class CustomButton: Button {
var didLayout: Bool = false // The code must be called only once
override func layoutSubviews() {
super.layoutSubviews()
if !didLayout, let imageView = imageView, let titleLabel = titleLabel {
didLayout = true
let stack = UIStackView(arrangedSubviews: [titleLabel, imageView])
addSubview(stack)
stack.edgesToSuperview() // I use TinyConstraints library. You could handle the constraints directly
stack.axis = .horizontal
}
}
}
于 2019-11-15T11:03:06.243 回答
0
我尝试了解决方案，并且有效，但它以标题+图像为中心。在我的方法中，我需要以导航栏为中心的文本和右侧的图像。
我实现了这个自定义视图：
class CenteredViewWithImage: UIView {
// MARK: - Vars
private let marginBetweenElements: CGFloat = 10.0
private let imageViewWidth: CGFloat = 20.0
private weak var spaceView: UIView?
private weak var titleLabel: UILabel?
private weak var imageView: UIImageView?
var title: String? {
willSet {
self.titleLabel?.text = newValue
}
}
// MARK: - LifeCycle
override init(frame: CGRect) {
super.init(frame: frame)
self.commonSetup()
}
required init?(coder: NSCoder) {
super.init(coder: coder)
self.commonSetup()
}
// MARK: - Setup
private func commonSetup() {
let spaceView = UIView.init()
self.spaceView = spaceView
self.addSubview(spaceView)
let titleLabel = UILabel.init()
self.titleLabel = titleLabel
self.titleLabel?.text = nil
self.titleLabel?.font = UIFont.systemFont(ofSize: 17, weight: .semibold)
self.titleLabel?.lineBreakMode = .byTruncatingTail
self.titleLabel?.textAlignment = .center
self.addSubview(titleLabel)
let imageView = UIImageView.init()
self.imageView = imageView
self.imageView?.image = UIImage.init(named: "image_name")
self.imageView?.contentMode = .scaleAspectFit
self.addSubview(imageView)
self.addConstraints()
}
// MARK: - Helper
private func addConstraints() {
guard let spaceView = self.spaceView,
let titleLabel = self.titleLabel,
let imageView = self.imageView else { return }
let guide = self.safeAreaLayoutGuide
self.spaceView?.translatesAutoresizingMaskIntoConstraints = false
self.spaceView?.topAnchor.constraint(equalTo: guide.topAnchor).isActive = true
self.spaceView?.leadingAnchor.constraint(equalTo: guide.leadingAnchor).isActive = true
guide.bottomAnchor.constraint(equalTo: spaceView.bottomAnchor).isActive = true
self.spaceView?.widthAnchor.constraint(equalTo: imageView.widthAnchor).isActive = true
self.titleLabel?.translatesAutoresizingMaskIntoConstraints = false
self.titleLabel?.topAnchor.constraint(equalTo: guide.topAnchor).isActive = true
self.titleLabel?.leadingAnchor.constraint(equalTo: spaceView.trailingAnchor, constant: self.marginBetweenElements).isActive = true
guide.bottomAnchor.constraint(equalTo: titleLabel.bottomAnchor).isActive = true
self.imageView?.translatesAutoresizingMaskIntoConstraints = false
self.imageView?.topAnchor.constraint(equalTo: guide.topAnchor).isActive = true
self.imageView?.leadingAnchor.constraint(equalTo: titleLabel.trailingAnchor, constant: self.marginBetweenElements).isActive = true
guide.trailingAnchor.constraint(equalTo: imageView.trailingAnchor).isActive = true
guide.bottomAnchor.constraint(equalTo: imageView.bottomAnchor).isActive = true
self.imageView?.widthAnchor.constraint(equalToConstant: self.imageViewWidth).isActive = true
self.imageView?.heightAnchor.constraint(equalTo: imageView.widthAnchor).isActive = true
}
}
要使用它：
let centeredView = CenteredViewWithImage.init()
self.centeredView = centeredView
self.centeredView?.title = "text centered"
let tapGesture: UITapGestureRecognizer = UITapGestureRecognizer.init(target: self, action: #selector(self.centeredViewHasBeenPressed))
self.centeredView?.addGestureRecognizer(tapGesture)
self.navigationItem.titleView = self.centeredView
@objc
private func centeredViewHasBeenPressed() {
debugPrint("do something")
}
外观如何：
于 2020-11-18T13:47:21.960 回答