ricky3350
ricky3350

Reputation: 1738

Shadow on UIButton text only (not background)

I have a set of UIButtons with background colors. when the user taps one, I want only the button's text to have a shadow all around it (to show that it has been selected). However, when I add the shadow, the shadow appears over the whole button (background and all), and not just the text. Is there an easier workaround to this than just adding a UILabel over a blank button?

UIButton *button = [UIButton buttonWithType:UIButtonTypeSystem];
...
[button setBackgroundColor:[UIColor blueColor]];

[button.layer setShadowRadius:8.0];
[button.layer setShadowColor:[[UIColor orangeColor] CGColor]];
[button.layer setShadowOpacity:0];
...

Upvotes: 4

Views: 3572

Answers (4)

Userich
Userich

Reputation: 316

Here is the simple way to add shadow to the button title with shadow radius property available in Objective-C:

#import <QuartzCore/QuartzCore.h>    

button.titleLabel.layer.shadowOffset = CGSizeMake(2.0, 2.0);
button.titleLabel.layer.shadowColor = [UIColor colorWithWhite:0.1 alpha:0.7].CGColor;
button.titleLabel.layer.shadowRadius = 2.0;
button.titleLabel.layer.shadowOpacity = 1.0;
button.titleLabel.layer.masksToBounds = NO;

Swift ..

Say you override the UIButton class ..

    titleLabel!.layer.shadowColor = UIColor.black.cgColor
    titleLabel!.layer.shadowOffset = CGSize(width: -0.5, height: 0.5)
    titleLabel!.layer.shadowOpacity = 1.0
    titleLabel!.layer.shadowRadius = 0
    titleLabel!.layer.masksToBounds = false

Upvotes: 5

Jef
Jef

Reputation: 4728

Just set the shadow on the titleLabel property of the UIButton rather than what you're doing now.

eg

button.titleLabel.shadowColor = ((selectionState) ?[UIColor orangeColor] : [UIColor clearColor] );
button.titleLabel.shadowOffset = CGSizeMake (1.5,1.5);

For 2018

This does not work. Use the answer of @Userich

Upvotes: 2

Sachin Kadam
Sachin Kadam

Reputation: 46

You need to use setTitleShadowColor: forState: and shadowOffset property of UIButton. below code will add shadow only to button label whenever user tap on button.

UIButton *button = [UIButton buttonWithType:UIButtonTypeSystem];

[button setBackgroundColor:[UIColor blueColor]];

button.frame = CGRectMake(50, 70, 200, 100);

[button setTitle:@"Test Button" forState:UIControlStateNormal];

[button.titleLabel setFont:[UIFont systemFontOfSize:45]];

[button setTitleShadowColor:[UIColor redColor] forState:UIControlStateHighlighted];

[button.titleLabel setShadowOffset:CGSizeMake(2.0, 2.0)];

Hope this will help.

Upvotes: 2

rdelmar
rdelmar

Reputation: 104082

One way to do this is to use attributed strings for the normal and highlighted titles. You can create an NSShadow object, and assign that as the value for the NSShadowAttributeName. This gives you control over the properties of the shadow. To keep the title from dimming, you should set the button type to Custom instead of System.

- (void)viewDidLoad {
    [super viewDidLoad];

    NSShadow *shadow = [[NSShadow alloc] init];
    shadow.shadowColor = [UIColor darkGrayColor];
    shadow.shadowOffset = CGSizeMake(2, 2);
    shadow.shadowBlurRadius = 2;

    NSString *titleString = @"Title";
    NSAttributedString *normalTitle = [[NSAttributedString alloc] initWithString:titleString];
    NSAttributedString *highlightedTitle = [[NSAttributedString alloc] initWithString:titleString attributes:@{NSShadowAttributeName:shadow}];

    [self.button setAttributedTitle:normalTitle forState:UIControlStateNormal];
    [self.button setAttributedTitle:highlightedTitle forState:UIControlStateHighlighted];
}

Upvotes: 1

Related Questions