IOS：如何在 4 侧（顶部、右侧、底部和左侧）为 UIView 制作阴影

Question

我正在使用下面的代码为我的ImageView制作阴影

UIBezierPath *shadowPath = [UIBezierPath bezierPathWithRect:self.avatarImageView.bounds];
self.avatarImageView.layer.masksToBounds = NO;
self.avatarImageView.layer.shadowColor = [UIColor blackColor].CGColor;
self.avatarImageView.layer.shadowOffset = CGSizeMake(5.0f, 5.0f);
self.avatarImageView.layer.shadowOpacity = 0.8f;
self.avatarImageView.layer.shadowPath = shadowPath.CGPath;

它会像这张图片一样在右侧和底部投下阴影。

现在我想让我的ImageView在顶部和左侧也有一个阴影。 我应该在代码中更改什么？ 是否可以仅通过代码中的配置使视图在顶部、右侧、底部、左侧包含阴影，或者我需要为阴影创建其他布局视图？ 任何帮助将不胜感激。

这是我想要实现的目标

更新
感谢@Dipen Panchasara 提供了一个简单的解决方案。 关注@Dipen Panchasara（阴影颜色为黑色）我会有这样的阴影图像

Answer 1

只有以下代码才能满足您的要求，您无需为阴影路径创建UIBezierPath 。

// *** Set masks bounds to NO to display shadow visible ***
self.avatarImageView.layer.masksToBounds = NO;
// *** Set light gray color as shown in sample ***
self.avatarImageView.layer.shadowColor = [UIColor lightGrayColor].CGColor;
// *** *** Use following to add Shadow top, left ***
self.avatarImageView.layer.shadowOffset = CGSizeMake(-5.0f, -5.0f);

// *** Use following to add Shadow bottom, right ***
//self.avatarImageView.layer.shadowOffset = CGSizeMake(5.0f, 5.0f);

// *** Use following to add Shadow top, left, bottom, right ***
// avatarImageView.layer.shadowOffset = CGSizeZero;
// avatarImageView.layer.shadowRadius = 5.0f;

// *** Set shadowOpacity to full (1) ***
self.avatarImageView.layer.shadowOpacity = 1.0f;

Answer 2

像这样：

float shadowSize = 10.0f;
UIBezierPath *shadowPath = [UIBezierPath bezierPathWithRect:CGRectMake(self.avatarImageView.frame.origin.x - shadowSize / 2,
                                                                       self.avatarImageView.frame.origin.y - shadowSize / 2,
                                                                       self.avatarImageView.frame.size.width + shadowSize,
                                                                       self.avatarImageView.frame.size.height + shadowSize)];
self.avatarImageView.layer.masksToBounds = NO;
self.avatarImageView.layer.shadowColor = [UIColor blackColor].CGColor;
self.avatarImageView.layer.shadowOffset = CGSizeMake(0.0f, 0.0f);
self.avatarImageView.layer.shadowOpacity = 0.8f;
self.avatarImageView.layer.shadowPath = shadowPath.CGPath;

斯威夫特 3版本：

    let shadowSize : CGFloat = 5.0
    let shadowPath = UIBezierPath(rect: CGRect(x: -shadowSize / 2,
                                               y: -shadowSize / 2,
                                               width: self.avatarImageView.frame.size.width + shadowSize,
                                               height: self.avatarImageView.frame.size.height + shadowSize))
    self.avatarImageView.layer.masksToBounds = false
    self.avatarImageView.layer.shadowColor = UIColor.black.cgColor
    self.avatarImageView.layer.shadowOffset = CGSize(width: 0.0, height: 0.0)
    self.avatarImageView.layer.shadowOpacity = 0.5
    self.avatarImageView.layer.shadowPath = shadowPath.cgPath

Answer 3

swift 3 的代码更少：

    view.layer.shadowColor = UIColor.black.cgColor
    view.layer.shadowOpacity = 0.7
    view.layer.shadowOffset = CGSize.zero
    view.layer.shadowRadius = 4
    view.layer.shadowPath = UIBezierPath(rect: planView.bounds).cgPath

Answer 4

同一视图上有圆角阴影的最佳解决方案，无需执行 clipsToBounds 或 maskToBounds

func addShadow(cornerRadius: CGFloat, maskedCorners: CACornerMask, color: UIColor, offset: CGSize, opacity: Float, shadowRadius: CGFloat) {
        self.layer.cornerRadius = cornerRadius
        self.layer.maskedCorners = maskedCorners
        self.layer.shadowColor = color.cgColor
        self.layer.shadowOffset = offset
        self.layer.shadowOpacity = opacity
        self.layer.shadowRadius = shadowRadius
    }

Answer 5

对于 UIView 和添加阴影，请记住为 UIView 设置背景颜色。

如果背景颜色是 clearColor，则不会出现阴影。

Answer 6

不使用 UIBezierPath，CGSize.zero 是这里的关键

yourView.layer.masksToBounds = false
yourView?.layer.shadowColor = UIColor.red.cgColor
yourView?.layer.shadowOffset =  CGSize.zero
yourView?.layer.shadowOpacity = 0.5
yourView?.layer.shadowRadius = 4

Answer 7

//如果你以前试过这个，你就知道会发生什么。 角会变圆，但阴影会丢失。 如果将masksToBounds 设置为false，则会出现阴影，但不会使角变圆。 //获取带有圆角半径的阴影为具有清晰颜色的容器视图添加超级视图并为超级视图应用阴影，为容器视图应用圆角半径。 试试吧。

   //view to apply shadow and corner radius
    containerView.layer.cornerRadius = 3
    containerView.clipsToBounds = true
    //superview of container View for to apply shadow 
    shadowView.layer.shadowOpacity = 0.1
    shadowView.layer.shadowRadius = 2.0
    shadowView.layer.masksToBounds = false
    shadowView.layer.shadowOffset = CGSize.zero

    shadowView.layer.shadowColor = UIColor.Black.cgColor

    shadowView.layer.shadowPath = UIBezierPath(roundedRect:containerView.bounds, cornerRadius: containerView.layer.cornerRadius).cgPath
    shadowView.layer.shouldRasterize = true

Answer 8

如果你仍然没有得到正确的阴影，问题可能是你添加代码的地方。 当您使用 UIBezierPath 时，您应该在viewDidLayoutSubviews 中调用它。 如果你调用 ViewDidLoad，你可能会得到错误的结果，因为视图布局过程可能未完成。

override func viewDidLayoutSubviews() {
    super.viewDidLayoutSubviews()

    //Shadow code here
}

Answer 9

CGRectInset(self.avatarImageView.bounds, -10.0, -10.0)

Answer 10

**in swift 4**

  yourView.clipsToBounds = true
    yourView.layer.cornerRadius = 20
    yourView.layer.shadowPath = UIBezierPath(roundedRect: self.yourView.bounds,
                     cornerRadius: self.DeletConversation.layer.cornerRadius).cgPath
    yourView.layer.shadowColor = UIColor(hexString: "color")?.cgColor
    DeletConversation.layer.shadowOpacity = 1
    DeletConversation.layer.shadowOffset = CGSize(width: 0, height: 1.0)
    DeletConversation.layer.shadowRadius = 1
    DeletConversation.layer.masksToBounds = false

Answer 11

这里有一个非常详细的解释： https : //www.hackingwithswift.com/example-code/uikit/how-to-add-a-shadow-to-a-uiview 。

如果有人在集合视图中没有顶部阴影，那么这可能会有所帮助：

我知道这对某些人来说可能很明显，但是如果您有一个带有标题和单元格的 CollectionView，请确保标题和单元格之间有空间，否则，单元格的顶部阴影将被标题挡住。

要添加空间，只需使用 insetsForSectionAt 部分。

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForSectionAt section: Int) -> UIEdgeInsets {
    return UIEdgeInsets(top: 5, left: 0, bottom: 5, right: 0)

}