如何控制阴影传播和模糊？ [英] How to control shadow spread and blur?

问题描述

我在草图中设计了UI元素，其中一个具有模糊1和展开0的阴影。我查看了视图图层属性的文档，图层没有任何名为spread或blur的内容，或任何等效的内容（只控制只是shadowOpacity）如何控制模糊和传播等事情？

I have designed UI elements in sketch, and one of them has a shadow with blur 1 and spread 0. I looked at the doc for the views layer property and layer doesnt have anything named spread or blur, or anything equivalent (the only control was merely shadowOpacity) How can control things like blur and spread?

编辑：

这是我的草图中的设置：



¥b $ b这就是我希望我的阴影看起来像：

Here are my settings in Sketch :


And here is what I want my shadow to look like:

<
>
这就是目前的样子：




注意，你必须点击图片才能看到阴影。

And here is what it looks like at the moment:


Note, you have to click on the picture to actually see the shadow.

我的代码如下：

func setupLayer(){
    view.layer.cornerRadius = 2
    view.layer.shadowColor = Colors.Shadow.CGColor
    view.layer.shadowOffset = CGSize(width: 0, height: 1)
    view.layer.shadowOpacity = 0.9
    view.layer.shadowRadius = 5
}

推荐答案

以下是如何将所有6个草图阴影属性应用于附近的UIView图层完美准确度：

Here's how to apply all 6 Sketch shadow properties to a UIView's layer with near perfect accuracy:

extension CALayer {
  func applySketchShadow(
    color: UIColor = .black,
    alpha: Float = 0.5,
    x: CGFloat = 0,
    y: CGFloat = 2,
    blur: CGFloat = 4,
    spread: CGFloat = 0)
  {
    shadowColor = color.cgColor
    shadowOpacity = alpha
    shadowOffset = CGSize(width: x, height: y)
    shadowRadius = blur / 2.0
    if spread == 0 {
      shadowPath = nil
    } else {
      let dx = -spread
      let rect = bounds.insetBy(dx: dx, dy: dx)
      shadowPath = UIBezierPath(rect: rect).cgPath
    }
  }
}

假设我们要代表以下内容：

Say we want to represent the following:

您可以通过以下方式轻松完成此操作：

You can easily do this via:

myView.layer.applySketchShadow(
  color: .black, 
  alpha: 0.5, 
  x: 0, 
  y: 0, 
  blur: 4, 
  spread: 0)

或更简洁：

myView.layer.applySketchShadow(y: 0)

示例：

左：iPhone 8 UIView截图;右：草图矩形。

注意：

• 当使用非零点差时，它根据界限对路径进行硬编码CALayer的。如果图层的边界发生变化，您需要再次调用 applySketchShadow（）方法。

• When using a non-zero spread, it hardcodes a path based on the bounds of the CALayer. If the layer's bounds ever change, you'd want to call the applySketchShadow() method again.

这篇关于如何控制阴影传播和模糊？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！