Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

There's a shadow on my button

i'm creating a button programmaticly for an iPad application. when i see the button, there looks to be a shadow type thing below it. what is it and how can i get rid of it?

shadow button

here is the code that creates it:

UIButton *myButton = [UIButton buttonWithType:UIButtonTypeRoundedRect];
myButton.titleLabel.font = [UIFont fontWithName:@"Trebuchet MS" size:12];
[myButton setTitle:@"test" forState:UIControlStateNormal];
myButton.frame = CGRectMake(0, 0, self.leftScrollView.frame.size.width, 50);

UIImageView *myImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"gear12.png"]];

[myButton addSubview:myImageView];
[self.leftScrollView addSubview:myButton];

UPDATE:

ok, i notice i only get that effect when its in my scrollview. if i add it to the view, no shadow effect.

the top test button, the button is a subview of the view. the bottom button is a subview of the scrollview which is a subview of the view (button/view vs button/scrollview/view).

white section is the view, grey is the scrollview/view.

shadow effect 2

UPDATE 2:

as pointed out by robmayor, UIButtons always have that double line effect, just not noticeble when the background color is white. the blue is a view and the grey is the subview scrollview.

enter image description here

like image 522
Padin215 Avatar asked Nov 29 '11 19:11

Padin215


2 Answers

This question is old (6 months) but i'have found a solution to delete/mask this bad effect of double lines.

[yourButton.layer setBackgroundColor: [[UIColor blackColor]CGColor]];
[yourButton.layer setBorderWidth:1.0f];
[yourButton.layer setBorderColor:[[UIColor blackColor]CGColor]];
[yourButton.layer setShadowOpacity:0.1f];
[yourButton.layer setCornerRadius:10];

UIColor selected is depending of the current background of your view.

Result : enter image description here

like image 190
user1226119 Avatar answered Sep 28 '22 19:09

user1226119


On iPads, a rounded-rect UIButton always draws a white line along its bottom edge. You can't see that white line if the button's superview is white, but it's still there.

You have a few options:

  • Make the superview white. This is the easiest but you might not like the way it looks.

  • Make some rounded rect images in your favorite image editor. Set the button type to custom and set your rounded rect images as the button's images.

  • Make a subclass of UIButton and override its drawRect: method.

  • Set the button type to custom and use the button's layer properties (button.layer.backgroundColor, button.layer.borderColor, button.layer.borderWidth, button.layer.cornerRadius) to give the button a rounded rect appearance. You'll have to update button.layer.backgroundColor when the button is touched if you want it to turn blue like a normal one does. (Actually a normal one uses a blue gradient.)

like image 21
rob mayoff Avatar answered Sep 28 '22 19:09

rob mayoff