swift 快速绘制阴影到一个uibezier路径

cyvaqqii  于 2023-11-16  发布在  Swift
关注(0)|答案(4)|浏览(104)

我有一个奇怪的问题。尽管我确实阅读了很多关于如何做到这一点的教程,但最终的结果只显示贝塞尔线,而不是任何阴影。我的代码非常简单:

let borderLine = UIBezierPath()
borderLine.moveToPoint(CGPoint(x:0, y: y! - 1))
borderLine.addLineToPoint(CGPoint(x: x!, y: y! - 1))
borderLine.lineWidth = 2
UIColor.blackColor().setStroke()
borderLine.stroke()
        
let shadowLayer = CAShapeLayer()
shadowLayer.shadowOpacity = 1
shadowLayer.shadowOffset = CGSize(width: 0,height: 1)
shadowLayer.shadowColor = UIColor.redColor().CGColor
shadowLayer.shadowRadius = 1
shadowLayer.masksToBounds = false
shadowLayer.shadowPath = borderLine.CGPath

self.layer.addSublayer(shadowLayer)

字符串
我做错了什么,因为我似乎没有看到任何错误,但当然我错了,因为没有阴影出现。函数是drawRect,基本的UIView没有额外的东西在那里,x和y是框架的宽度和高度。
非常感谢提前!

vm0i2vca

vm0i2vca1#

我直接从我的PaintCode应用程序中引用这个例子。希望这对你有帮助。

//// General Declarations
let context = UIGraphicsGetCurrentContext()

//// Shadow Declarations
let shadow = UIColor.blackColor()
let shadowOffset = CGSizeMake(3.1, 3.1)
let shadowBlurRadius: CGFloat = 5

//// Bezier 2 Drawing
var bezier2Path = UIBezierPath()
bezier2Path.moveToPoint(CGPointMake(30.5, 90.5))
bezier2Path.addLineToPoint(CGPointMake(115.5, 90.5))
CGContextSaveGState(context)
CGContextSetShadowWithColor(context, shadowOffset, shadowBlurRadius,  (shadow as UIColor).CGColor)
UIColor.blackColor().setStroke()
bezier2Path.lineWidth = 1
bezier2Path.stroke()
CGContextRestoreGState(context)

字符串

hvvq6cgz

hvvq6cgz2#

我更喜欢增加shadow-sublayer的方式,你可以很容易地使用以下函数(Swift 3.0):

func createShadowLayer() -> CALayer {
    let shadowLayer = CALayer()
    shadowLayer.shadowColor = UIColor.red.cgColor
    shadowLayer.shadowOffset = CGSize.zero
    shadowLayer.shadowRadius = 5.0
    shadowLayer.shadowOpacity = 0.8
    shadowLayer.backgroundColor = UIColor.clear.cgColor
    return shadowLayer
}

字符串
最后,您只需将其添加到您的线路径(CAShapeLayer):

let line = CAShapeLayer()
let path = UIBezierPath()
path.move(to: CGPoint(x: 0, y: 0))
path.addLine(to: CGPoint(x: 50, y: 100))
path.addLine(to: CGPoint(x: 100, y: 50))
line.path = path.cgPath
line.strokeColor = UIColor.blue.cgColor
line.fillColor = UIColor.clear.cgColor
line.lineWidth = 2.0
view.layer.addSublayer(line)

let shadowSubLayer = createShadowLayer()
shadowSubLayer.insertSublayer(line, at: 0)
view.layer.addSublayer(shadowSubLayer)

cczfrluj

cczfrluj3#

我使用shape图层的shadow属性来添加阴影。这种方法的最大优点是我不需要显式地提供路径。阴影跟随图层的路径。我还通过改变路径来动画图层。在这种情况下,阴影也可以无缝地动画,而不需要一行代码。
这是我正在做的事情(Swift 4.2)

shapeLayer.path = curveShapePath(postion: initialPosition)
    shapeLayer.strokeColor = UIColor.clear.cgColor
    shapeLayer.fillColor = shapeBackgroundColor
    self.layer.addSublayer(shapeLayer)

    if shadow {
        shapeLayer.shadowRadius = 5.0
        shapeLayer.shadowColor = UIColor.gray.cgColor
        shapeLayer.shadowOpacity = 0.8
    }

字符串
curveShapePath方法是返回路径的方法,定义如下:

func curveShapePath(postion: CGFloat) -> CGPath {
    let height: CGFloat = 37.0
    let path = UIBezierPath()

    path.move(to: CGPoint(x: 0, y: 0)) // start top left
    path.addLine(to: CGPoint(x: (postion - height * 2), y: 0)) // the beginning of the trough

    // first curve down
    path.addCurve(to: CGPoint(x: postion, y: height),
                  controlPoint1: CGPoint(x: (postion - 30), y: 0), controlPoint2: CGPoint(x: postion - 35, y: height))
    // second curve up
    path.addCurve(to: CGPoint(x: (postion + height * 2), y: 0),
                  controlPoint1: CGPoint(x: postion + 35, y: height), controlPoint2: CGPoint(x: (postion + 30), y: 0))

    // complete the rect
    path.addLine(to: CGPoint(x: self.frame.width, y: 0))
    path.addLine(to: CGPoint(x: self.frame.width, y: self.frame.height))
    path.addLine(to: CGPoint(x: 0, y: self.frame.height))
    path.close()

    return path.cgPath
}


的数据

k75qkfdt

k75qkfdt4#

使用CGGraphicsContext绘制自定义图形时,您仍然可以手动应用阴影:

guard let ctx = UIGraphicsGetCurrentContext() else { return }
ctx.saveGState() // allows us to revert

let offset = CGSize.zero
let blur: CGFloat = 5.0
let color = UIColor.red

ctx.setShadow(offset: offset, blur: blur, color: color.cgColor)
// Shadow will be applied to drawing commands after this point

let path = UIBezierPath(ovalIn: CGRect(x: 0, y: 0, width: 20, height: 20))
UIColor(white: 0, alpha: 0.5).setFill()
path.fill() // drawing command gets a shadow added

self.restoreGState()
// Shadow not applied to drawing commands after this point

字符串

相关问题