iosobjective-cswiftuicontrol

How to implement range slider in Swift


I'm trying to implement Range Slider and I used custom control called NMRangeSlider.

But when I use it, the slider doesn't appear at all. Could it be also because it's all written in Objective-C?

This is how I've currently implemented it:

var rangeSlider = NMRangeSlider(frame: CGRectMake(16, 6, 275, 34))
rangeSlider.lowerValue = 0.54
rangeSlider.upperValue = 0.94
self.view.addSubview(rangeSlider)

Solution

  • UPDATE:

    It did not show to me, because it was all white. So the solution, without using any other framework and sticking with this one - you need to set all the views for all the components and then it will display well:

    enter image description here


    I have tried to import it in Swift as I used it before in Objective-C code, but without any luck. If I set everything properly and add it either in viewDidLoad() or viewDidAppear(), nothing gets displayed. One thing is worth mentioning, though - when I enter View Debug Hierarchy, the slider actually is there on the canvas:

    enter image description here

    But it's simply not rendered with all the colors that I did set before adding in it to the view. For the record - this is the code I used:

    override func viewDidAppear(animated: Bool) {
        var rangeSlider = NMRangeSlider(frame: CGRectMake(50, 50, 275, 34))
        rangeSlider.lowerValue = 0.54
        rangeSlider.upperValue = 0.94
        
        let range = 10.0
        let oneStep = 1.0 / range
        let minRange: Float = 0.05
        rangeSlider.minimumRange = minRange
        
        let bgImage = UIView(frame: rangeSlider.frame)
        bgImage.backgroundColor = .greenColor()
        rangeSlider.trackImage = bgImage.pb_takeSnapshot()
        
        let trackView = UIView(frame: CGRectMake(0, 0, rangeSlider.frame.size.width, 29))
        trackView.backgroundColor = .whiteColor()
        trackView.opaque = false
        trackView.alpha = 0.3
        rangeSlider.trackImage = UIImage(named: "")
        
        let lowerThumb = UIView(frame: CGRectMake(0, 0, 8, 29))
        lowerThumb.backgroundColor = .whiteColor()
        let lowerThumbHigh = UIView(frame: CGRectMake(0, 0, 8, 29))
        lowerThumbHigh.backgroundColor = UIColor.blueColor()
        
        rangeSlider.lowerHandleImageNormal = lowerThumb.pb_takeSnapshot()
        rangeSlider.lowerHandleImageHighlighted = lowerThumbHigh.pb_takeSnapshot()
        rangeSlider.upperHandleImageNormal = lowerThumb.pb_takeSnapshot()
        rangeSlider.upperHandleImageHighlighted = lowerThumbHigh.pb_takeSnapshot()
        
        self.view.addSubview(rangeSlider)
    
        self.view.backgroundColor = .lightGrayColor()
    }
    

    Using the method for capturing the UIView as UIImage mentioned in this question:

    extension UIView {
        func pb_takeSnapshot() -> UIImage {
            UIGraphicsBeginImageContextWithOptions(bounds.size, false, UIScreen.mainScreen().scale)
            drawViewHierarchyInRect(self.bounds, afterScreenUpdates: true)
            let image = UIGraphicsGetImageFromCurrentImageContext()
            UIGraphicsEndImageContext()
            return image
        }
    }
    

    Other solution:

    You can also try sgwilly/RangeSlider instead, it's written in Swift and therefore you won't even need a Bridging Header.