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?
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];
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.
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.
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.)
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.
Replace [UIButton buttonWithType:UIButtonTypeRoundedRect] with:
UIButton *myButton = [UIButton new];
UIButton *myButton = [UIButton buttonWithType:UIButtonTypeCustom];
You want to have your customized button. You can still make it with rounded corners if needed.