Is it possible to adjust x,y position for titleLabel of UIButton?

Question

Is it possible to adjust the x,y position for the titleLabel of a UIButton?

Here is my code:

    UIButton *btn = [UIButton buttonWithType:UIButtonTypeRoundedRect];

    [btn setFrame:CGRectMake(0.0f, 0.0f, 100.0f, 100.0f)];
    [btn setTitle:[NSString stringWithFormat:@"Button %d", i+1] forState:UIControlStateNormal];     
    [btn addTarget:self action:@selector(buttonPressed:) forControlEvents:UIControlEventTouchUpInside];
    btn.titleLabel.frame = ???

Interloper

This is all you need https://mcmap.net/q/175794/-uibutton-titleedgeinsets-duplicate – Norven

Answer 1

//make the buttons content appear in the top-left
[button setContentHorizontalAlignment:UIControlContentHorizontalAlignmentLeft];
[button setContentVerticalAlignment:UIControlContentVerticalAlignmentTop];

//move text 10 pixels down and right
[button setTitleEdgeInsets:UIEdgeInsetsMake(10.0f, 10.0f, 0.0f, 0.0f)];

And in Swift

//make the buttons content appear in the top-left
button.contentHorizontalAlignment = .Left
button.contentVerticalAlignment = .Top

//move text 10 pixels down and right
button.titleEdgeInsets = UIEdgeInsetsMake(10.0, 10.0, 0.0, 0.0)

Swift 5

button.contentHorizontalAlignment = .left
button.contentVerticalAlignment = .top
button.titleEdgeInsets = UIEdgeInsets(top: 10.0, left: 10.0, bottom: 0.0, right: 0.0)

Engleman

I didn't even need the first two lines... setTitleEdgeInsets: was all I found necessary to shift the text around. – Modla

This is definitely correct, but probably easier to accomplish by using the interface builder (as described in my answer). – Sirdar

The first two lines positions your text to the 0,0 (x,y). This can prevent relative positioning; especially if you set the default alignment in the xib. – Monocular

i assgin the the button title from web services and assgin the background image for button. some times the web serivies values become more than 10 letter. in this case it show dot line. i need if web serivies values in increased the button image also want to increased ... how to do? – Cleanup

@Modla : the first 2 lines will come into picture if your button height is more and you need to align as ltr... for normal buttons, yes they are useless... – Labour

Answer 2

The easiest way to do it visually is to use the attribute inspector** (appears when editing a xib/storyboard), setting the "edge" property to title, adjusting it's insets, then setting "edge" property to image, and adjusting accordingly. It's usually better than coding it , since it's easier to maintain and highly visual.

Sirdar

Good tip to change Edge to Title and then adjust inset! – Kloof

For future reference, since Xcode 8, instead of setting the edge property you can adjust the title insets in the Size Inspector. – Rajasthani

Answer 3

Derive from UIButton and implement the following method:

- (CGRect)titleRectForContentRect:(CGRect)contentRect;

Edit:

@interface PositionTitleButton : UIButton
@property (nonatomic) CGPoint titleOrigin;
@end

@implementation PositionTextButton
- (CGRect)titleRectForContentRect:(CGRect)contentRect {
  contentRect.origin = titleOrigin;
  return contentRect;
}
@end

Selfliquidating

Thanks, this is what I actually needed. Automatic centering wasn't enough. – Reyreyes

Answer 4

For my projects I've this extension utility:

extension UIButton {

    func moveTitle(horizontal hOffset: CGFloat, vertical vOffset: CGFloat) {
        self.titleEdgeInsets.left += hOffset
        self.titleEdgeInsets.top += vOffset
    }

}

Intoxicative

Answer 5

This can be done in xib. Select your button, go to "Show the Size Inspector" tab and setup insets.

Polygenesis