ios - 使用CoreGraphics发布绘图自定义UIView

我正在尝试用CoreGraphics制作一个自定义垂直开关。我在不同的视图中有切换背景和切换缩略图，但是由于某些原因，我似乎无法将缩略图视图的背景颜色设置为clearcolor。任何帮助都将不胜感激！

![import UIKit
import QuartzCore

class ThumbView:UIView {

    var thumbPath = UIBezierPath()
    init(frame: CGRect) {
        super.init(frame: frame)
       // self.opaque = false
      //  self.backgroundColor = UIColor.clearColor()
    }

    init(coder aDecoder: NSCoder!) {
        super.init(coder: aDecoder)
        self.opaque = false
        self.backgroundColor = UIColor.clearColor()
    }

    override func drawRect(rect: CGRect) {
        let contentFrame = rect
        let context = UIGraphicsGetCurrentContext()

        let bgPath = UIBezierPath(rect: self.frame)
        let bgColor = UIColor.clearColor()
        bgColor.setFill()
        bgPath.fill()

        self.backgroundColor = bgColor;

        let white = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
        let shadowOffset = CGSizeMake(0.1, 3.1)
        let shadowBlurRadius: CGFloat = 5
        let shadow = UIColor.darkGrayColor()

        CGContextSaveGState(context)
        //// thumb Drawing
        thumbPath = UIBezierPath(ovalInRect: CGRectMake(0, 0, rect.size.height, rect.size.width))
        CGContextSaveGState(context)
        CGContextSetShadowWithColor(context, shadowOffset, shadowBlurRadius, shadow.CGColor)
        white.setFill()
        thumbPath.fill()
        CGContextRestoreGState(context)
    }
}

class VerticalSwitch: UIView {

    var switchBackgroundPath = UIBezierPath()
    var thumbView = ThumbView()

    init(frame: CGRect) {
        super.init(frame: frame)
    }

    init(coder aDecoder: NSCoder!) {
        super.init(coder: aDecoder)
        self.clipsToBounds = true
        thumbView = ThumbView()
        NSLog("%@", NSStringFromCGRect(self.frame))
        self.addSubview(thumbView)
    }

    override func layoutSubviews() {
        thumbView.frame = CGRectMake(5, 5, self.frame.size.width - 10, self.frame.size.width - 10)
    }

    // Only override drawRect: if you perform custom drawing.
    // An empty implementation adversely affects performance during animation.
    override func drawRect(rect: CGRect)
    {
        let contentFrame = rect
        //// General Declarations
        let context = UIGraphicsGetCurrentContext()

        //// Color Declarations
        let gDGreen = UIColor(red: 0.157, green: 0.475, blue: 0.153, alpha: 1.000)

        //// Shadow Declarations
        let innerShadow = UIColor.darkGrayColor().colorWithAlphaComponent(0.9)
        let innerShadowOffset = CGSizeMake(0.1, -5.1)
        let innerShadowBlurRadius: CGFloat = 10

        //// switchBackground Drawing
        switchBackgroundPath.moveToPoint(CGPointMake(contentFrame.minX + 85.36, contentFrame.minY + 0.06764 * contentFrame.height))
        switchBackgroundPath.addCurveToPoint(CGPointMake(contentFrame.minX + 100, contentFrame.minY + 0.23095 * contentFrame.height), controlPoint1: CGPointMake(contentFrame.minX + 95.12, contentFrame.minY + 0.11274 * contentFrame.height), controlPoint2: CGPointMake(contentFrame.minX + 100, contentFrame.minY + 0.17184 * contentFrame.height))
        switchBackgroundPath.addLineToPoint(CGPointMake(contentFrame.minX + 100, contentFrame.minY + 0.76905 * contentFrame.height))
        switchBackgroundPath.addCurveToPoint(CGPointMake(contentFrame.minX + 85.36, contentFrame.minY + 0.93236 * contentFrame.height), controlPoint1: CGPointMake(contentFrame.minX + 100, contentFrame.minY + 0.82816 * contentFrame.height), controlPoint2: CGPointMake(contentFrame.minX + 95.12, contentFrame.minY + 0.88726 * contentFrame.height))
        switchBackgroundPath.addCurveToPoint(CGPointMake(contentFrame.minX + 14.64, contentFrame.minY + 0.93236 * contentFrame.height), controlPoint1: CGPointMake(contentFrame.minX + 65.83, contentFrame.minY + 1.02255 * contentFrame.height), controlPoint2: CGPointMake(contentFrame.minX + 34.17, contentFrame.minY + 1.02255 * contentFrame.height))
        switchBackgroundPath.addCurveToPoint(CGPointMake(contentFrame.minX, contentFrame.minY + 0.76905 * contentFrame.height), controlPoint1: CGPointMake(contentFrame.minX + 4.88, contentFrame.minY + 0.88726 * contentFrame.height), controlPoint2: CGPointMake(contentFrame.minX, contentFrame.minY + 0.82816 * contentFrame.height))
        switchBackgroundPath.addLineToPoint(CGPointMake(contentFrame.minX, contentFrame.minY + 0.23095 * contentFrame.height))
        switchBackgroundPath.addCurveToPoint(CGPointMake(contentFrame.minX + 14.64, contentFrame.minY + 0.06764 * contentFrame.height), controlPoint1: CGPointMake(contentFrame.minX, contentFrame.minY + 0.17184 * contentFrame.height), controlPoint2: CGPointMake(contentFrame.minX + 4.88, contentFrame.minY + 0.11274 * contentFrame.height))
        switchBackgroundPath.addCurveToPoint(CGPointMake(contentFrame.minX + 85.36, contentFrame.minY + 0.06764 * contentFrame.height), controlPoint1: CGPointMake(contentFrame.minX + 34.17, contentFrame.minY + -0.02255 * contentFrame.height), controlPoint2: CGPointMake(contentFrame.minX + 65.83, contentFrame.minY + -0.02255 * contentFrame.height))
        switchBackgroundPath.closePath()
        gDGreen.setFill()
        switchBackgroundPath.fill()

        ////// switchBackground Inner Shadow
        CGContextSaveGState(context)
        CGContextClipToRect(context, switchBackgroundPath.bounds)
        CGContextSetShadow(context, CGSizeMake(0, 0), 0)
        CGContextSetAlpha(context, CGColorGetAlpha(innerShadow.CGColor))
        CGContextBeginTransparencyLayer(context, nil)
        let switchBackgroundOpaqueShadow = innerShadow.colorWithAlphaComponent(1)
        CGContextSetShadowWithColor(context, innerShadowOffset, innerShadowBlurRadius, switchBackgroundOpaqueShadow.CGColor)
        CGContextSetBlendMode(context, kCGBlendModeSourceOut)
        CGContextBeginTransparencyLayer(context, nil)

        switchBackgroundOpaqueShadow.setFill()
        switchBackgroundPath.fill()

        CGContextEndTransparencyLayer(context)
        CGContextRestoreGState(context)
    }

    override func touchesBegan(touches: NSSet!, withEvent event: UIEvent!) {

    }
}]

最佳答案

您应该使用带框架参数的构造函数创建thumbView：

thumbView = ThumbView(frame: CGRectMake(0,0, 0, 0))

ThumbViewinit(frame: CGRect)应该是：

init(frame: CGRect) {
    super.init(frame: frame)
    self.opaque = false
    self.backgroundColor = UIColor.clearColor()
}

或者，可以在ThumbView中创建无参数构造，但必须调用super.init(frame:CGRectMake(0,0, 0, 0))并设置不透明和背景属性。
更新：
您还忘记在ThumbViewCGContextRestoreGState方法中调用drawRect:。应该添加到方法的末尾。
在VerticalSwitchCGContextEndTransparencyLayer方法中忘记调用drawRect:。应该在另一个CGContextEndTransparencyLayer方法调用之后立即添加。
模拟器屏幕截图：
所有代码（带修复程序）：

import Foundation
import UIKit
import QuartzCore

class ThumbView:UIView {

    var thumbPath = UIBezierPath()
    init(frame: CGRect) {
        super.init(frame: frame)
         self.opaque = false
          self.backgroundColor = UIColor.clearColor()
    }

    init(coder aDecoder: NSCoder!) {
        super.init(coder: aDecoder)
        self.opaque = false
        self.backgroundColor = UIColor.clearColor()
    }

    override func drawRect(rect: CGRect) {
        let contentFrame = rect
        let context = UIGraphicsGetCurrentContext()

        let bgPath = UIBezierPath(rect: self.frame)
        let bgColor = UIColor.clearColor()
        bgColor.setFill()
        bgPath.fill()

        self.backgroundColor = bgColor;

        let white = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
        let shadowOffset = CGSizeMake(0.1, 3.1)
        let shadowBlurRadius: CGFloat = 5
        let shadow = UIColor.darkGrayColor()

        CGContextSaveGState(context)
        //// thumb Drawing
        thumbPath = UIBezierPath(ovalInRect: CGRectMake(0, 0, rect.size.height, rect.size.width))
        CGContextSaveGState(context)
        CGContextSetShadowWithColor(context, shadowOffset, shadowBlurRadius, shadow.CGColor)
        white.setFill()
        thumbPath.fill()
        CGContextRestoreGState(context)
        CGContextRestoreGState(context)
    }
}

class VerticalSwitch: UIView {

    var switchBackgroundPath = UIBezierPath()
    var thumbView = ThumbView()

    init(frame: CGRect) {
        super.init(frame: frame)
    }

    init(coder aDecoder: NSCoder!) {
        super.init(coder: aDecoder)
        self.clipsToBounds = true
        thumbView = ThumbView(frame: CGRectMake(0,0, 0, 0))
        NSLog("%@", NSStringFromCGRect(self.frame))
        self.addSubview(thumbView)
    }

    override func layoutSubviews() {
        thumbView.frame = CGRectMake(5, 5, self.frame.size.width - 10, self.frame.size.width - 10)
    }

    // Only override drawRect: if you perform custom drawing.
    // An empty implementation adversely affects performance during animation.
    override func drawRect(rect: CGRect)
    {
        let contentFrame = rect
        //// General Declarations
        let context = UIGraphicsGetCurrentContext()

        //// Color Declarations
        let gDGreen = UIColor(red: 0.157, green: 0.475, blue: 0.153, alpha: 1.000)

        //// Shadow Declarations
        let innerShadow = UIColor.darkGrayColor().colorWithAlphaComponent(0.9)
        let innerShadowOffset = CGSizeMake(0.1, -5.1)
        let innerShadowBlurRadius: CGFloat = 10

        //// switchBackground Drawing
        switchBackgroundPath.moveToPoint(CGPointMake(contentFrame.minX + 85.36, contentFrame.minY + 0.06764 * contentFrame.height))
        switchBackgroundPath.addCurveToPoint(CGPointMake(contentFrame.minX + 100, contentFrame.minY + 0.23095 * contentFrame.height), controlPoint1: CGPointMake(contentFrame.minX + 95.12, contentFrame.minY + 0.11274 * contentFrame.height), controlPoint2: CGPointMake(contentFrame.minX + 100, contentFrame.minY + 0.17184 * contentFrame.height))
        switchBackgroundPath.addLineToPoint(CGPointMake(contentFrame.minX + 100, contentFrame.minY + 0.76905 * contentFrame.height))
        switchBackgroundPath.addCurveToPoint(CGPointMake(contentFrame.minX + 85.36, contentFrame.minY + 0.93236 * contentFrame.height), controlPoint1: CGPointMake(contentFrame.minX + 100, contentFrame.minY + 0.82816 * contentFrame.height), controlPoint2: CGPointMake(contentFrame.minX + 95.12, contentFrame.minY + 0.88726 * contentFrame.height))
        switchBackgroundPath.addCurveToPoint(CGPointMake(contentFrame.minX + 14.64, contentFrame.minY + 0.93236 * contentFrame.height), controlPoint1: CGPointMake(contentFrame.minX + 65.83, contentFrame.minY + 1.02255 * contentFrame.height), controlPoint2: CGPointMake(contentFrame.minX + 34.17, contentFrame.minY + 1.02255 * contentFrame.height))
        switchBackgroundPath.addCurveToPoint(CGPointMake(contentFrame.minX, contentFrame.minY + 0.76905 * contentFrame.height), controlPoint1: CGPointMake(contentFrame.minX + 4.88, contentFrame.minY + 0.88726 * contentFrame.height), controlPoint2: CGPointMake(contentFrame.minX, contentFrame.minY + 0.82816 * contentFrame.height))
        switchBackgroundPath.addLineToPoint(CGPointMake(contentFrame.minX, contentFrame.minY + 0.23095 * contentFrame.height))
        switchBackgroundPath.addCurveToPoint(CGPointMake(contentFrame.minX + 14.64, contentFrame.minY + 0.06764 * contentFrame.height), controlPoint1: CGPointMake(contentFrame.minX, contentFrame.minY + 0.17184 * contentFrame.height), controlPoint2: CGPointMake(contentFrame.minX + 4.88, contentFrame.minY + 0.11274 * contentFrame.height))
        switchBackgroundPath.addCurveToPoint(CGPointMake(contentFrame.minX + 85.36, contentFrame.minY + 0.06764 * contentFrame.height), controlPoint1: CGPointMake(contentFrame.minX + 34.17, contentFrame.minY + -0.02255 * contentFrame.height), controlPoint2: CGPointMake(contentFrame.minX + 65.83, contentFrame.minY + -0.02255 * contentFrame.height))
        switchBackgroundPath.closePath()
        gDGreen.setFill()
        switchBackgroundPath.fill()

        ////// switchBackground Inner Shadow
        CGContextSaveGState(context)
        CGContextClipToRect(context, switchBackgroundPath.bounds)
        CGContextSetShadow(context, CGSizeMake(0, 0), 0)
        CGContextSetAlpha(context, CGColorGetAlpha(innerShadow.CGColor))
        CGContextBeginTransparencyLayer(context, nil)
        let switchBackgroundOpaqueShadow = innerShadow.colorWithAlphaComponent(1)
        CGContextSetShadowWithColor(context, innerShadowOffset, innerShadowBlurRadius, switchBackgroundOpaqueShadow.CGColor)
        CGContextSetBlendMode(context, kCGBlendModeSourceOut)
        CGContextBeginTransparencyLayer(context, nil)

        switchBackgroundOpaqueShadow.setFill()
        switchBackgroundPath.fill()

        CGContextEndTransparencyLayer(context)
        CGContextEndTransparencyLayer(context)
        CGContextRestoreGState(context)
    }

    override func touchesBegan(touches: NSSet!, withEvent event: UIEvent!) {

    }
}

关于ios - 使用CoreGraphics发布绘图自定义UIView，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/24809361/