UIButton 底部阴影 [英] UIButton bottom shadow

问题描述

我有一个与标准 iOS 键盘字母按钮非常相似的 UIButton.

I have a UIButton which is very similar to the standard iOS keyboard alphabet button.

我不确定如何像 iOS 那样只为底层创建阴影.

I am not sure how to create a shadow only for the bottom layer like how iOS have done.

我使用下面的代码，但我看到所有侧面都有阴影，而不仅仅是底部:

I use the below code, but I see a shadow on all the side, not just the bottom:

CALayer *buttonLayer = [[CALayer alloc] init];
buttonLayer.shadowColor = [UIColor grayColor].CGColor;
buttonLayer.shadowOffset = CGSizeMake(0.f,1.f);
buttonLayer.masksToBounds = NO;
buttonLayer.shadowOpacity = 1.f;

你能告诉我如何达到同样的效果吗?提前致谢.

Can you please tell me how to achieve the same effect. Thanks in advance.

推荐答案

可以混合使用cornerRadius 和shadow 属性.我在 iOS 8 上测试过.

You can mix the cornerRadius and shadow properties. I tested it on iOS 8.

目标-C:

[self.globeButton setImage:[UIImage imageNamed:@"Globe"] forState:UIControlStateNormal];
self.globeButton.backgroundColor = [UIColor colorWithRed:171 green:178 blue:186 alpha:1.0f];
// Shadow and Radius
self.globeButton.layer.shadowColor = [[UIColor colorWithRed:0 green:0 blue:0 alpha:0.25f] CGColor];
self.globeButton.layer.shadowOffset = CGSizeMake(0, 2.0f);
self.globeButton.layer.shadowOpacity = 1.0f;
self.globeButton.layer.shadowRadius = 0.0f;
self.globeButton.layer.masksToBounds = NO;
self.globeButton.layer.cornerRadius = 4.0f;

斯威夫特:

globeButton.setImage(UIImage(named: "Globe"), for: .normal)
globeButton.backgroundColor = UIColor(red: 171/255, green: 178/255, blue: 186/255, alpha: 1.0)
// Shadow Color and Radius
globeButton.layer.shadowColor = UIColor(red: 0, green: 0, blue: 0, alpha: 0.25).cgColor
globeButton.layer.shadowOffset = CGSize(width: 0.0, height: 2.0)
globeButton.layer.shadowOpacity = 1.0
globeButton.layer.shadowRadius = 0.0
globeButton.layer.masksToBounds = false
globeButton.layer.cornerRadius = 4.0

结果:

这篇关于UIButton 底部阴影的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！