如何向 UIButton 添加阴影？

Posted 2023-03-07

【中文标题】如何向 UIButton 添加阴影？

【英文标题】：How to add a drop shadow to a UIButton?

【发布时间】：2010-02-23 00:34:42

【问题描述】：

我想为 UIButton 添加阴影。我尝试使用 self.layer.shadow* 属性。这些属性在 UIView 中有效，但在 UIButton 中的行为不同。如果我能得到任何指示来绘制阴影，我将不胜感激。谢谢！

self.layer.cornerRadius = 8.0f;
self.layer.masksToBounds = YES;
self.layer.borderWidth = 1.0f;

self.layer.shadowColor = [UIColor greenColor].CGColor;
self.layer.shadowOpacity = 0.8;
self.layer.shadowRadius = 12;
self.layer.shadowOffset = CGSizeMake(12.0f, 12.0f);

【问题讨论】：

核心动画指南 developer.apple.com/mac/library/documentation/cocoa/conceptual/… 说：iPhone OS 注意：作为性能考虑，iPhone OS 不支持 shadowColor、shadowOffset、shadowOpacity 和 shadowRadius 属性。当当。

自 ios 3.2 起现在支持此属性。问候，

没有什么能帮到我，只有这个link

【参考方案1】：

问题中只有一个小错误导致阴影不显示：masksToBounds:YES也掩盖了阴影！这是正确的代码：

self.layer.cornerRadius = 8.0f;
self.layer.masksToBounds = NO;
self.layer.borderWidth = 1.0f;

self.layer.shadowColor = [UIColor greenColor].CGColor;
self.layer.shadowOpacity = 0.8;
self.layer.shadowRadius = 12;
self.layer.shadowOffset = CGSizeMake(12.0f, 12.0f);

不幸的是，这意味着我们不能在没有技巧的情况下同时屏蔽内容和阴影。

记得#import <QuartzCore/QuartzCore.h>。

【参考方案2】：

如果您使用UIButton，这是一个简单的解决方案：

#import <QuartzCore/QuartzCore.h>

button.imageView.layer.cornerRadius = 7.0f;
button.layer.shadowRadius = 3.0f;
button.layer.shadowColor = [UIColor blackColor].CGColor;
button.layer.shadowOffset = CGSizeMake(0.0f, 1.0f);
button.layer.shadowOpacity = 0.5f;
button.layer.masksToBounds = NO;

刚刚开始工作，并认为值得发布。希望有帮助！

【讨论】：

非常优雅的解决方案！谢谢！

工作得很好......即使我不导入“”它对我的工作......关于我不认识的其他人。

如果你这样做会导致自定义键盘的辅助触摸滞后

【参考方案3】：

这是一个子类，它不仅会创建投影，而且当您按下按钮时，按钮会向下动画。

//
//  ShadowButton.h

#import <Foundation/Foundation.h>

@interface ShadowButton : UIButton 


@end

//
//  ShadowButton.m

#import "ShadowButton.h"
#import <QuartzCore/QuartzCore.h>

@implementation ShadowButton

-(void)setupView

    self.layer.shadowColor = [UIColor blackColor].CGColor;
    self.layer.shadowOpacity = 0.5;
    self.layer.shadowRadius = 1;
    self.layer.shadowOffset = CGSizeMake(2.0f, 2.0f);



-(id)initWithFrame:(CGRect)frame
    if((self = [super initWithFrame:frame]))
        [self setupView];
    

    return self;


-(id)initWithCoder:(NSCoder *)aDecoder
    if((self = [super initWithCoder:aDecoder]))
        [self setupView];
    

    return self;


-(void) touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
    self.contentEdgeInsets = UIEdgeInsetsMake(1.0,1.0,-1.0,-1.0);
    self.layer.shadowOffset = CGSizeMake(1.0f, 1.0f);
    self.layer.shadowOpacity = 0.8;

    [super touchesBegan:touches withEvent:event];



-(void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event
    self.contentEdgeInsets = UIEdgeInsetsMake(0.0,0.0,0.0,0.0);
    self.layer.shadowOffset = CGSizeMake(2.0f, 2.0f);
    self.layer.shadowOpacity = 0.5;

    [super touchesEnded:touches withEvent:event];



@end

【参考方案4】：

您可以在 Xcode 中创建子类并配置其值

下面是一个例子：

import UIKit
import QuartzCore

@IBDesignable
class CustomButton: UIButton 

@IBInspectable var cornerRadius: CGFloat = 0 
    didSet 
        layer.cornerRadius = cornerRadius
    


@IBInspectable var borderWidth: CGFloat = 0 
    didSet 
        layer.borderWidth = borderWidth
    


@IBInspectable var borderColor: UIColor = UIColor.gray 
    didSet 
        layer.borderColor = borderColor.cgColor
    


@IBInspectable var shadowColor: UIColor = UIColor.gray 
    didSet 
        layer.shadowColor = shadowColor.cgColor
    


@IBInspectable var shadowOpacity: Float = 1.0 
    didSet 
        layer.shadowOpacity = shadowOpacity
    


@IBInspectable var shadowRadius: CGFloat = 1.0 
    didSet 
        layer.shadowRadius = shadowRadius
    


@IBInspectable var masksToBounds: Bool = true 
    didSet 
        layer.masksToBounds = masksToBounds
    


@IBInspectable var shadowOffset: CGSize = CGSize(width: 12, height: 12) 
    didSet 
        layer.shadowOffset = shadowOffset
    



 

【参考方案5】：

您可以继承 UIButton 并覆盖 drawRect: 方法并手动添加阴影。这是更多的工作，您现在应该了解有关石英 2d 的一些信息，但结果正是您想要的。 否则你可以只添加一个图像，但我更喜欢 UIButton 的子类，因为它在按钮大小方面非常灵活，更通用。