0

I created a button on top of my mapView. In order to make that Button more visible I added a blur view below that button. I don't like the sharp edges of my blur view. How do I make the blur fade out slowly transitioning into the mapView?

EDIT: To be more specific. I mean a fading blurred gradient with round corners.

enter image description here

Reinier Melian
  • 20,519
  • 3
  • 38
  • 55

2 Answers2

2

I think this can help you, first you need subclass your button and add this code in drawRect and replace UIColor.blueColor().CGColor by yourColor.CGColor

class UICustomBackgroundButton: UIButton {

    override func draw(_ rect: CGRect) {
        // Drawing code
        super.draw(rect)
        let ctx = UIGraphicsGetCurrentContext();

        let path = CGPath(roundedRect: rect.insetBy(dx: self.frame.size.height/4, dy: self.frame.size.height/4) , cornerWidth: self.frame.size.height/8, cornerHeight: self.frame.size.height/8, transform: nil)

        ctx?.setShadow(offset: CGSize.zero, blur: self.frame.size.height/4, color: UIColor.blue.cgColor);
        ctx?.setFillColor(UIColor.blue.cgColor);

        //if number of cicles is our glow is darker
        for _ in 0..<6
        {
        ctx?.addPath(path);
        ctx?.fillPath();
        }
    }

}

I Hope this helps you.

and this is how it look enter image description here

Reinier Melian
  • 20,519
  • 3
  • 38
  • 55
  • I get this error trying to run your code: Assertion failed: (corner_height >= 0 && 2 * corner_height <= CGRectGetHeight(rect)), function CGPathCreateWithRoundedRect, file /BuildRoot/Library/Caches/com.apple.xbs/Sources/Quartz2D_Sim/Quartz2D-1033.1/CoreGraphics/Paths/CGPath.cc, line 190. –  Jun 11 '16 at 10:26
  • @mike I had edited my code, this error happens because values are statics, so now my code make adjustments according your button height, I hope this helps you! – Reinier Melian Jun 11 '16 at 16:04
0

Have you tried the cornerRadius property? That should remove the sharp edges

Rajeev Bhatia
  • 2,974
  • 1
  • 21
  • 29