Question

我已在UIWidget中开发了自定义PaintCode，我试图将其变成一个交互式UI控件，但我不确定如何实现正确触摸功能

PaintCode（TimeSlider）的输出以NSObject的形式到达。

然后我创建了一个UIView类（TimeSliderView），其成员为TimeSlider。当我在故事板中包含此自定义视图时，它会完美呈现所有内容但是我不确定如何实现触摸功能，以便我可以来回拖动滑块

enter image description here

到目前为止，我还没有正确使用这些内容以及添加触摸/滑动功能需要添加哪些方法或协议？

TimeSliderView

import UIKit

class TimeSliderView: UIView {


    var slider : TimeSlider = TimeSlider()

    var percent : CGFloat = 0.5

    override func drawRect(rect: CGRect) {
        TimeSlider.drawSlider(frame: self.frame, sliderPercent: self.percent)
    }
}

时间滑

//
//  TimeSlider.swift
//  None
//
//  Created by Jeff Stein on 11/25/14.
//  Copyright (c) 2014 CompanyName. All rights reserved.
//
//  Generated by PaintCode (www.paintcodeapp.com)
//



import UIKit

public class TimeSlider : NSObject {

    //// Cache

    private struct Cache {
        static var mitreBlue7691: UIColor = UIColor(red: 0.000, green: 0.294, blue: 0.580, alpha: 1.000)
        static var coolGray9: UIColor = UIColor(red: 0.373, green: 0.388, blue: 0.416, alpha: 1.000)
        static var black: UIColor = UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 1.000)
        static var white: UIColor = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
        static var mitreGreen390: UIColor = UIColor(red: 0.749, green: 0.824, blue: 0.157, alpha: 1.000)
        static var mitreGrey538: UIColor = UIColor(red: 0.812, green: 0.871, blue: 0.918, alpha: 1.000)
        static var mitreBlue312: UIColor = UIColor(red: 0.000, green: 0.702, blue: 0.863, alpha: 1.000)
        static var mitreYellow: UIColor = UIColor(red: 1.000, green: 0.886, blue: 0.235, alpha: 1.000)
        static var mitreRed7599: UIColor = UIColor(red: 0.776, green: 0.251, blue: 0.114, alpha: 1.000)
        static var mitreOrange138: UIColor = UIColor(red: 0.969, green: 0.565, blue: 0.118, alpha: 1.000)
    }

    //// Colors

    public class var mitreBlue7691: UIColor { return Cache.mitreBlue7691 }
    public class var coolGray9: UIColor { return Cache.coolGray9 }
    public class var black: UIColor { return Cache.black }
    public class var white: UIColor { return Cache.white }
    public class var mitreGreen390: UIColor { return Cache.mitreGreen390 }
    public class var mitreGrey538: UIColor { return Cache.mitreGrey538 }
    public class var mitreBlue312: UIColor { return Cache.mitreBlue312 }
    public class var mitreYellow: UIColor { return Cache.mitreYellow }
    public class var mitreRed7599: UIColor { return Cache.mitreRed7599 }
    public class var mitreOrange138: UIColor { return Cache.mitreOrange138 }

    //// Drawing Methods

    public class func drawSlider(#frame: CGRect, sliderPercent: CGFloat) {
        //// General Declarations
        let context = UIGraphicsGetCurrentContext()


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

        //// Variable Declarations
        let sliderLocation = 85 * sliderPercent
        let departureMins = round(5.0 / 85.0 * sliderPercent * 100) * 5
        let textString = "\(Int(round(departureMins)))" + " minutes"

        //// Group 2
        //// Group
        //// Rectangle Drawing
        let rectanglePath = UIBezierPath(roundedRect: CGRectMake(0, 0, 120, 60), cornerRadius: 8)
        TimeSlider.coolGray9.setFill()
        rectanglePath.fill()


        //// Rectangle 2 Drawing
        let rectangle2Path = UIBezierPath(roundedRect: CGRectMake(10, 18, 100, 15), cornerRadius: 5)
        TimeSlider.coolGray9.setFill()
        rectangle2Path.fill()

        ////// Rectangle 2 Inner Shadow
        CGContextSaveGState(context)
        CGContextClipToRect(context, rectangle2Path.bounds)
        CGContextSetShadow(context, CGSizeMake(0, 0), 0)
        CGContextSetAlpha(context, CGColorGetAlpha((shadow as UIColor).CGColor))
        CGContextBeginTransparencyLayer(context, nil)
        let rectangle2OpaqueShadow = (shadow as UIColor).colorWithAlphaComponent(1)
        CGContextSetShadowWithColor(context, shadowOffset, shadowBlurRadius, (rectangle2OpaqueShadow as UIColor).CGColor)
        CGContextSetBlendMode(context, kCGBlendModeSourceOut)
        CGContextBeginTransparencyLayer(context, nil)

        rectangle2OpaqueShadow.setFill()
        rectangle2Path.fill()

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





        //// Oval Drawing
        var ovalPath = UIBezierPath(ovalInRect: CGRectMake((sliderLocation + 10), 18, 15, 15))
        CGContextSaveGState(context)
        CGContextSetShadowWithColor(context, shadowOffset, shadowBlurRadius, (shadow as UIColor).CGColor)
        TimeSlider.mitreBlue312.setFill()
        ovalPath.fill()
        CGContextRestoreGState(context)



        //// Mask Drawing
        var maskPath = UIBezierPath()
        maskPath.moveToPoint(CGPointMake(102.36, 18))
        maskPath.addLineToPoint(CGPointMake(21.32, 18))
        maskPath.addCurveToPoint(CGPointMake(19.84, 18), controlPoint1: CGPointMake(20.79, 18), controlPoint2: CGPointMake(20.3, 18))
        maskPath.addLineToPoint(CGPointMake(14.6, 18.56))
        maskPath.addCurveToPoint(CGPointMake(10, 25.12), controlPoint1: CGPointMake(11.84, 19.57), controlPoint2: CGPointMake(10, 22.19))
        maskPath.addLineToPoint(CGPointMake(10, 25.5))
        maskPath.addCurveToPoint(CGPointMake(10, 25.87), controlPoint1: CGPointMake(10, 25.5), controlPoint2: CGPointMake(10, 25.5))
        maskPath.addCurveToPoint(CGPointMake(14.6, 32.44), controlPoint1: CGPointMake(10, 28.81), controlPoint2: CGPointMake(11.84, 31.43))
        maskPath.addLineToPoint(CGPointMake(14.88, 32.51))
        maskPath.addCurveToPoint(CGPointMake(17.64, 33), controlPoint1: CGPointMake(16.37, 33), controlPoint2: CGPointMake(18.02, 33))
        maskPath.addCurveToPoint(CGPointMake(17.69, 33), controlPoint1: CGPointMake(17.69, 33), controlPoint2: CGPointMake(17.69, 33))
        maskPath.addLineToPoint(CGPointMake(98.68, 33))
        maskPath.addCurveToPoint(CGPointMake(105.4, 32.44), controlPoint1: CGPointMake(101.98, 33), controlPoint2: CGPointMake(103.63, 33))
        maskPath.addCurveToPoint(CGPointMake(110, 25.87), controlPoint1: CGPointMake(108.16, 31.43), controlPoint2: CGPointMake(110, 28.81))
        maskPath.addLineToPoint(CGPointMake(110, 25.5))
        maskPath.addCurveToPoint(CGPointMake(110, 25.13), controlPoint1: CGPointMake(110, 25.5), controlPoint2: CGPointMake(110, 25.5))
        maskPath.addCurveToPoint(CGPointMake(105.4, 18.56), controlPoint1: CGPointMake(110, 22.19), controlPoint2: CGPointMake(108.16, 19.57))
        maskPath.addLineToPoint(CGPointMake(105.12, 18.49))
        maskPath.addCurveToPoint(CGPointMake(102.36, 18), controlPoint1: CGPointMake(103.63, 18), controlPoint2: CGPointMake(101.98, 18))
        maskPath.addCurveToPoint(CGPointMake(102.31, 18), controlPoint1: CGPointMake(102.31, 18), controlPoint2: CGPointMake(102.31, 18))
        maskPath.addLineToPoint(CGPointMake(102.36, 18))
        maskPath.closePath()
        maskPath.moveToPoint(CGPointMake(114.64, 0.52))
        maskPath.addLineToPoint(CGPointMake(114.95, 0.6))
        maskPath.addCurveToPoint(CGPointMake(119.4, 5.05), controlPoint1: CGPointMake(117.02, 1.35), controlPoint2: CGPointMake(118.65, 2.98))
        maskPath.addCurveToPoint(CGPointMake(120, 12.23), controlPoint1: CGPointMake(120, 6.95), controlPoint2: CGPointMake(120, 8.71))
        maskPath.addLineToPoint(CGPointMake(120, 47.77))
        maskPath.addCurveToPoint(CGPointMake(119.48, 54.64), controlPoint1: CGPointMake(120, 51.29), controlPoint2: CGPointMake(120, 53.05))
        maskPath.addLineToPoint(CGPointMake(119.4, 54.95))
        maskPath.addCurveToPoint(CGPointMake(114.95, 59.4), controlPoint1: CGPointMake(118.65, 57.02), controlPoint2: CGPointMake(117.02, 58.65))
        maskPath.addCurveToPoint(CGPointMake(107.77, 60), controlPoint1: CGPointMake(113.05, 60), controlPoint2: CGPointMake(111.29, 60))
        maskPath.addLineToPoint(CGPointMake(12.23, 60))
        maskPath.addCurveToPoint(CGPointMake(5.36, 59.48), controlPoint1: CGPointMake(8.71, 60), controlPoint2: CGPointMake(6.95, 60))
        maskPath.addLineToPoint(CGPointMake(5.05, 59.4))
        maskPath.addCurveToPoint(CGPointMake(0.6, 54.95), controlPoint1: CGPointMake(2.98, 58.65), controlPoint2: CGPointMake(1.35, 57.02))
        maskPath.addCurveToPoint(CGPointMake(0, 47.77), controlPoint1: CGPointMake(0, 53.05), controlPoint2: CGPointMake(0, 51.29))
        maskPath.addLineToPoint(CGPointMake(0, 12.23))
        maskPath.addCurveToPoint(CGPointMake(0.52, 5.36), controlPoint1: CGPointMake(0, 8.71), controlPoint2: CGPointMake(-0, 6.95))
        maskPath.addLineToPoint(CGPointMake(0.6, 5.05))
        maskPath.addCurveToPoint(CGPointMake(5.05, 0.6), controlPoint1: CGPointMake(1.35, 2.98), controlPoint2: CGPointMake(2.98, 1.35))
        maskPath.addCurveToPoint(CGPointMake(12.23, 0), controlPoint1: CGPointMake(6.95, 0), controlPoint2: CGPointMake(8.71, 0))
        maskPath.addLineToPoint(CGPointMake(107.77, 0))
        maskPath.addCurveToPoint(CGPointMake(114.64, 0.52), controlPoint1: CGPointMake(111.29, 0), controlPoint2: CGPointMake(113.05, 0))
        maskPath.closePath()
        TimeSlider.mitreBlue7691.setFill()
        maskPath.fill()


        //// Text 2 Drawing
        CGContextSaveGState(context)
        CGContextTranslateCTM(context, 59.87, 1.73)

        let text2Rect = CGRectMake(-59.87, -1.73, 120, 52)
        let text2Style = NSMutableParagraphStyle.defaultParagraphStyle().mutableCopy() as NSMutableParagraphStyle
        text2Style.alignment = NSTextAlignment.Center

        let text2FontAttributes = [NSFontAttributeName: UIFont.boldSystemFontOfSize(9), NSForegroundColorAttributeName: TimeSlider.white, NSParagraphStyleAttributeName: text2Style]

        let text2TextHeight: CGFloat = NSString(string: textString).boundingRectWithSize(CGSizeMake(text2Rect.width, CGFloat.infinity), options: NSStringDrawingOptions.UsesLineFragmentOrigin, attributes: text2FontAttributes, context: nil).size.height
        CGContextSaveGState(context)
        CGContextClipToRect(context, text2Rect);
        NSString(string: textString).drawInRect(CGRectMake(text2Rect.minX, text2Rect.minY + text2Rect.height - text2TextHeight, text2Rect.width, text2TextHeight), withAttributes: text2FontAttributes)
        CGContextRestoreGState(context)

        CGContextRestoreGState(context)
    }

}

@objc protocol StyleKitSettableImage {
    func setImage(image: UIImage!)
}

@objc protocol StyleKitSettableSelectedImage {
    func setSelectedImage(image: UIImage!)
}

Answer 1

看起来这样做了伎俩

 override public func continueTrackingWithTouch(touch: UITouch, withEvent event: UIEvent) -> Bool {

        super.continueTrackingWithTouch(touch, withEvent: event)

        var x  = touch.locationInView(self).x


        if (x > self.frame.width) {
            x = self.frame.width
        }
        if (x < 0) { x = 0 }

        percent = x / self.frame.width

        println(percent)

        self.sendActionsForControlEvents(UIControlEvents.ValueChanged)
        setNeedsDisplay()

        delegate?.valueMinutesDidChange(self.minutes)

        return true;
    }

在Swift中创建自定义滑块

TimeSliderView

时间滑

1 个答案: