Why doesn't my snow fall to the ground? - ios

I am trying to make a application (in swift) where snow falls in the background. The only problem is I have added the gravity animation, however the snow just stays where it is.
Here is my code:
ViewController.swift
import UIKit
#IBDesignable
class ViewController: UIViewController {
#IBInspectable var BgColor:UIColor = UIColor.whiteColor()
override func viewDidLoad() {
super.viewDidLoad()
self.view.backgroundColor = BgColor
/*listSubviewsOfView(self.view)*/ /*Not needed to answer this*/
var snow = Snow(frame: CGRect(x: 0, y: 0, width: 5, height: 5))
snow.opaque = false
self.view.addSubview(snow)
let animator = UIDynamicAnimator(referenceView: self.view)
let gravity = UIGravityBehavior(items: [snow])
let direction = CGVectorMake(0.0, 1.0)
gravity.gravityDirection = direction
animator.addBehavior(gravity)
/*
var snow = Snow(frame: CGRect(x: 0, y: 0, width: 5, height: 5))
snow.opaque = false
snow.viewHeight = UIScreen.mainScreen().bounds.height
snow.addSubview(snow)
let animator = UIDynamicAnimator(referenceView: view)
let gravity = UIGravityBehavior(items: [snow])
animator.addBehavior(gravity)
*/
}
/*Not needed to solve this*/
/*
func listSubviewsOfView(views: UIView) {
var index = 0
let randomNumbers = [Int](1...24).shuffle()
for view in views.subviews
{
if let _ = view.restorationIdentifier
{
view.setValue(String(Int(randomNumbers[index])), forKey: "updateText")
index++
}
if index == randomNumbers.count {
break
}
}
}
*/
}
Snow.swift:
import Foundation
import UIKit
#IBDesignable
class Snow:UIView
{
var viewHeight = CGFloat(0)
/*
required init(coder aDecoder: NSCoder) {
//Initilse UIView
super.init(coder: aDecoder)!
}
*/
override func drawRect(rect: CGRect) {
let path = UIBezierPath(ovalInRect: rect)
UIColor.whiteColor().setFill()
path.fill()
}
}
The question is, why does my snow stay on top of the screen at (0,0) and not fall down even though I have told it to have the gravity affect?

Make animator and gravity properties of your view controller.
import UIKit
#IBDesignable
class ViewController: UIViewController {
#IBInspectable var BgColor:UIColor = UIColor.whiteColor()
var animator: UIDynamicAnimator? = nil;
let gravity = UIGravityBehavior()
override func viewDidLoad() {
super.viewDidLoad()
self.view.backgroundColor = UIColor.blackColor()
let snow = Snow(frame: CGRect(x: 0, y: 0, width: 5, height: 5))
snow.opaque = false
self.view.addSubview(snow)
animator = UIDynamicAnimator(referenceView:self.view);
animator?.addBehavior(gravity)
gravity.addItem(snow)
let direction = CGVectorMake(0.0, 1.0)
gravity.gravityDirection = direction
}
}

Related

How to move an UIimageView random on the screen when you click the image

Can you help me please to move my image random on my View when I click it ?
I need to use UIView Animations (is required) and when the UIImageView is reaching the random destination on the screen it should change the color/image from inside.
Here is my code:
import UIKit
import QuartzCore
// ---- Is required to use UIView Animation ------
class FirstViewController: UIViewController {
#IBOutlet weak var imageView: UIImageView!
override func viewDidLoad() {
super.viewDidLoad()
imageView.image = UIImage(named: "1.png") // the second image is named "2.png"
}
override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {
guard let touch = touches.first else { return }
let touchLocation = touch.location(in: view)
let leftCorner = CGPoint(x: touchLocation.x + 48, y: touchLocation.y + 48)
imageView.center = leftCorner
}
}
Thanks in advance !
Here's my solution:
import UIKit
class ViewController: UIViewController {
let imageViewWidth = CGFloat(100)
let imageViewHeight = CGFloat(100)
let colors = [UIColor.red, UIColor.blue, UIColor.gray, UIColor.brown, UIColor.green]
#IBOutlet weak var imageView: UIImageView!
override func viewDidLoad() {
super.viewDidLoad()
imageView.frame = CGRect(
x: view.bounds.width/2 - imageViewWidth/2,
y: view.bounds.height/2 - imageViewHeight/2,
width: imageViewWidth,
height: imageViewHeight
)
addTapRecognizerToImageView()
}
func addTapRecognizerToImageView() {
let tap = UITapGestureRecognizer(target: self, action: #selector(self.handleTap))
imageView.addGestureRecognizer(tap)
imageView.isUserInteractionEnabled = true
}
#objc func handleTap() {
let maxX = view.frame.maxX-imageViewWidth
let maxY = view.frame.maxY-imageViewHeight
let randomX = arc4random_uniform(UInt32(maxX)) + 0
let randomY = arc4random_uniform(UInt32(maxY)) + 0
UIView.animate(withDuration: 0.5) {
self.imageView.frame = CGRect(
x: CGFloat(randomX),
y: CGFloat(randomY),
width: self.imageViewWidth,
height: self.imageViewHeight
)
}
let randomColor = Int(arc4random_uniform(4) + 0)
imageView.backgroundColor = colors[randomColor]
}
}

Zoom on UIView contained in UIScrollView

I have some trouble handling zoom on UIScrollView that contains many subviews. I already saw many answers on SO, but none of them helped me.
So, basically what I'm doing is simple : I have a class called UIFreeView :
import UIKit
class UIFreeView: UIView, UIScrollViewDelegate {
var mainUIView: UIView!
var scrollView: UIScrollView!
var arrayOfView: [UIView]?
override init(frame: CGRect) {
super.init(frame: frame)
self.setupView()
}
required init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
fileprivate func setupView() {
// MainUiView
self.mainUIView = UIView(frame: self.frame)
self.addSubview(mainUIView)
// ScrollView
self.scrollView = UIScrollView(frame: self.frame)
self.scrollView.delegate = self
self.addSubview(self.scrollView)
}
func reloadViews(postArray:[Post]?) {
if let postArray = postArray {
print("UIFreeView::reloadVIew.postArraySize = \(postArray.count)")
let size: CGFloat = 80.0
let margin: CGFloat = 20.0
scrollView.contentSize.width = (size * CGFloat(postArray.count))+(margin*CGFloat(postArray.count))
scrollView.contentSize.height = (size * CGFloat(postArray.count))+(margin*CGFloat(postArray.count))
for item in postArray {
let view = buildPostView(item)
self.scrollView.addSubview(view)
}
}
}
fileprivate func buildPostView(_ item:Post) -> UIView {
// Const
let size: CGFloat = 80.0
let margin: CGFloat = 5.0
// Var
let view = UIView()
let textView = UITextView()
let backgroundImageView = UIImageView()
// Setup view
let x = CGFloat(UInt64.random(lower: UInt64(0), upper: UInt64(self.scrollView.contentSize.width)))
let y = CGFloat(UInt64.random(lower: UInt64(0), upper: UInt64(self.scrollView.contentSize.height)))
view.frame = CGRect(x: x,
y: y,
width: size,
height: size)
// Setup background view
backgroundImageView.frame = CGRect(x: 0,
y: 0,
width: view.frame.size.width,
height: view.frame.size.height)
var bgName = ""
if (item.isFromCurrentUser) {
bgName = "post-it-orange"
} else {
bgName = "post-it-white"
}
backgroundImageView.contentMode = .scaleAspectFit
backgroundImageView.image = UIImage(named: bgName)
view.addSubview(backgroundImageView)
// Setup text view
textView.frame = CGRect(x: margin,
y: margin,
width: view.frame.size.width - margin*2,
height: view.frame.size.height - margin*2)
textView.backgroundColor = UIColor.clear
textView.text = item.content
textView.isEditable = false
textView.isSelectable = false
textView.isUserInteractionEnabled = false
view.addSubview(textView)
let gestureRecognizer = UIPanGestureRecognizer(target: self, action: #selector(handlePan))
view.addGestureRecognizer(gestureRecognizer)
return view
}
func viewForZooming(in scrollView: UIScrollView) -> UIView? {
return self.scrollView
}
func handlePan(_ gestureRecognizer: UIPanGestureRecognizer) {
if gestureRecognizer.state == .began || gestureRecognizer.state == .changed {
let translation = gestureRecognizer.translation(in: self.scrollView)
// note: 'view' is optional and need to be unwrapped
gestureRecognizer.view!.center = CGPoint(x: gestureRecognizer.view!.center.x + translation.x, y: gestureRecognizer.view!.center.y + translation.y)
gestureRecognizer.setTranslation(CGPoint.zero, in: self.scrollView)
}
}
/*
// Only override draw() if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
override func draw(_ rect: CGRect) {
// Drawing code
}
*/
}
This class is working perfectly, I can scroll through all my views, but I can't zoom-in and zoom-out in order to see less/more views on my screen.
I think the solution is simple, but I can't seem to find a real solution for my problem ..
Thanks !

Slider determines gravity

So far I've created a rectangle that starts from the bottom and moves upward using UiDynamicAnimator. I would like the user to determine the "strength" of the negative gravity. I want the user to determine the value through a slider.
This is my code so far:
import UIKit
class ViewController: UIViewController {
var orangeSquare: UIView?
var animator: UIDynamicAnimator?
override func viewDidLoad() {
super.viewDidLoad()
func sliderChanged(sender: AnyObject) {
var sliderValue = sender.value
}
//Create animation
let dim = CGRectMake(100, 500, 200, 100)
orangeSquare = UIView(frame: dim)
orangeSquare?.backgroundColor = UIColor.orangeColor()
//Add item to the screen
self.view.addSubview(orangeSquare!)
//Initialize the animator
animator = UIDynamicAnimator(referenceView: self.view)
//Add gravity
let gravity = UIGravityBehavior(items: [orangeSquare!])
let direction = CGVectorMake(0.0, sliderValue)
gravity.gravityDirection = direction
//Collision
let boundries = UICollisionBehavior(items: [orangeSquare!])
boundries.translatesReferenceBoundsIntoBoundary = true
//Add animations
animator?.addBehavior(boundries)
animator?.addBehavior(gravity)
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
}
I get two errors:
"Ambiguous use of ´value´" and
"Use of unresolved identifier ´sliderValue´"
How do I convert ´sliderValue´ into a float with just one decimal point?
your code is missing a few things. sliderValue is an unresolved identifier because you have only declared it within sliderChanged but are referring to it in the main body of viewDidLoad. Also, I think that your use of value is ambiguous because you have declared the parameter to the function as AnyObject, whose value could be any one of a number of things!
Your code was missing a mechanism linking a change in the value of the slider with a change in the gravity behaviour. As such, I've implemented this using an explicit target attached to the slider object. I've also thrown in a label showing the magnitude of the gravitational force. This is quite rough but I think it achieves what you were looking to do.
import UIKit
class ViewController: UIViewController {
var dynamicAnimator : UIDynamicAnimator!
var gravityBehaviour : UIGravityBehavior!
var orangeSquare : UIView!
var slider : UISlider!
var sliderLabel : UILabel!
override func viewDidLoad() {
super.viewDidLoad()
// Subviews
self.orangeSquare = {
let oS : UIView = UIView(frame: CGRect(origin: CGPoint(x: (self.view.frame.width / 2) - 100, y: 500), size: CGSize(width: 200, height: 200)))
oS.backgroundColor = UIColor.orange
return oS
}()
self.slider = UISlider(frame: CGRect(origin: CGPoint(x: 100, y: 100), size: CGSize(width: self.view.frame.width - 400, height: 50)))
self.slider.addTarget(self, action: #selector(self.sliderValueDidChange), for: UIControlEvents.allTouchEvents)
self.slider.minimumValue = -5
self.slider.maximumValue = 5
self.slider.value = 0
self.sliderLabel = UILabel(frame: CGRect(origin: CGPoint(x: self.view.frame.width - 100, y: 100), size: CGSize(width : 50, height: 50)))
self.sliderLabel.backgroundColor = UIColor.red
self.sliderLabel.textAlignment = NSTextAlignment.center
self.sliderLabel.textColor = UIColor.white
self.sliderLabel.text = String(self.slider.value)
// Assemble
self.view.addSubview(self.orangeSquare)
self.view.addSubview(self.slider)
self.view.addSubview(self.sliderLabel)
// Configure dynamic behaviours
self.dynamicAnimator = UIDynamicAnimator(referenceView: self.view)
self.gravityBehaviour = UIGravityBehavior(items: [self.orangeSquare])
self.gravityBehaviour.gravityDirection = CGVector(dx: 0, dy: 0)
// Configure boundaries
let boundaries : UICollisionBehavior = UICollisionBehavior(items: [self.orangeSquare])
boundaries.translatesReferenceBoundsIntoBoundary = true
self.dynamicAnimator.addBehavior(self.gravityBehaviour)
self.dynamicAnimator.addBehavior(boundaries)
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
func sliderValueDidChange() {
// When the slider value changes, update the label text and the gravity vector
self.sliderLabel.text = String((round(self.slider.value) * 10) / 10)
self.gravityBehaviour.gravityDirection = CGVector(dx: 0, dy: CGFloat(-1 * self.slider.value))
}
}
Hope that helps. All best!
import UIKit
class ViewController: UIViewController {
var dynamicAnimator : UIDynamicAnimator!
var gravityBehaviour : UIGravityBehavior!
var orangeSquare : UIView!
var slider : UISlider!
var sliderLabel : UILabel!
override func viewDidLoad() {
super.viewDidLoad()
// Subviews
self.orangeSquare = {
let oS : UIView = UIView(frame: CGRect(origin: CGPoint(x: (self.view.frame.width / 2) - 100, y: 500), size: CGSize(width: 200, height: 200)))
oS.backgroundColor = UIColor.orangeColor()
return oS
}()
self.slider = UISlider(frame: CGRect(origin: CGPoint(x: self.view.frame.width - 100, y: 100), size: CGSize(width: self.view.frame.width - 300, height: 150)))
self.slider.addTarget(self, action: #selector(self.sliderValueDidChange), forControlEvents: UIControlEvents.AllTouchEvents)
self.slider.minimumValue = -10
self.slider.maximumValue = 10
self.slider.value = 0
self.sliderLabel = UILabel(frame: CGRect(origin: CGPoint(x: self.view.frame.width - 100, y: 200), size: CGSize(width : 50, height: 50)))
self.sliderLabel.backgroundColor = UIColor.redColor()
self.sliderLabel.textAlignment = NSTextAlignment.Center
self.sliderLabel.textColor = UIColor.whiteColor()
self.sliderLabel.text = String(self.slider.value)
// Assemble
self.view.addSubview(self.orangeSquare)
self.view.addSubview(self.slider)
self.view.addSubview(self.sliderLabel)
// Configure dynamic behaviours
self.dynamicAnimator = UIDynamicAnimator(referenceView: self.view)
self.gravityBehaviour = UIGravityBehavior(items: [self.orangeSquare])
self.gravityBehaviour.gravityDirection = CGVector(dx: 0.0, dy: 0.0)
// Configure boundaries
let boundaries : UICollisionBehavior = UICollisionBehavior(items: [self.orangeSquare])
boundaries.translatesReferenceBoundsIntoBoundary = true
self.dynamicAnimator.addBehavior(self.gravityBehaviour)
self.dynamicAnimator.addBehavior(boundaries)
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
func sliderValueDidChange() {
// When the slider value changes, update the label text and the gravity vector
self.sliderLabel.text = String((round(self.slider.value) * 10) / 10)
self.gravityBehaviour.gravityDirection = CGVector(dx: 0, dy: CGFloat(-1 * self.slider.value))
}
}

Swift Collision Boundary not working

Swift 2.0, xcode 7, Ios 9
Intention: I want the two squares to drop to the bottom and stay at the bottom of the screen.
What is happening now: There is no error preventing the code from running, the gravity works fine but the collision just seems to be ignored. Thus resulting in the two objects falling through the bottom of the screen.
Note: the subclass is UIView not UIViewController and this view is accessed from a segue.
Many Thanks!
Code :
import UIKit
class graphs: UIView {
//create two shapes
var greenSquare: UIView?
var redSquare: UIView?
var animator: UIDynamicAnimator?
override func drawRect(rect: CGRect) {
var dimen = CGRectMake(25, 25, 60, 60)
greenSquare = UIView(frame: dimen)
greenSquare?.backgroundColor = UIColor.greenColor()
dimen = CGRectMake(130, 25, 90, 90)
redSquare = UIView(frame: dimen)
redSquare?.backgroundColor = UIColor.redColor()
//add them to the screen
self.addSubview(greenSquare!)
self.addSubview(redSquare!)
}
#IBAction func startbutton(sender: AnyObject) {
//initialise the animator
animator = UIDynamicAnimator()
//colision
let boundries = UICollisionBehavior(items:[greenSquare!,redSquare!])
boundries.translatesReferenceBoundsIntoBoundary = true
//add gravity
let gravity = UIGravityBehavior(items: [greenSquare!, redSquare!])
let direction = CGVectorMake(0.0, 1.0)
gravity.gravityDirection = direction
animator?.addBehavior(boundries)
animator?.addBehavior(gravity)
}
}
I fixed it by changing the subclass to a UIViewController
why did the previous code not work?
this is the new code:
import UIKit
class DrawView: UIViewController {
//Create two shapes
var greenSquare: UIView?
var redSquare: UIView?
var animator: UIDynamicAnimator?
override func viewDidLoad() {
super.viewDidLoad()
}
#IBAction func startbutton(sender: UIButton) {
//Create the shapes
var dimen = CGRectMake(25, 25, 60, 60)
greenSquare = UIView(frame: dimen)
greenSquare?.backgroundColor = UIColor.greenColor()
dimen = CGRectMake(130, 25, 90, 90)
redSquare = UIView(frame: dimen)
redSquare?.backgroundColor = UIColor.redColor()
//Add them to the screen
self.view.addSubview(greenSquare!)
self.view.addSubview(redSquare!)
//Initialize the animator
animator = UIDynamicAnimator(referenceView: self.view)
//Gravity
let gravity = UIGravityBehavior(items: [greenSquare!, redSquare!] )
let direction = CGVectorMake(0.0, 1.0)
gravity.gravityDirection = direction
//Collision
let boundries = UICollisionBehavior(items: [greenSquare!, redSquare!] )
boundries.translatesReferenceBoundsIntoBoundary = true
//Elasticity
let bounce = UIDynamicItemBehavior(items: [greenSquare!, redSquare!] )
bounce.elasticity = 0.5
animator?.addBehavior(bounce)
animator?.addBehavior(boundries)
animator?.addBehavior(gravity)
}
}

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)
To create a custom Range Slider I found a good solution here: range finder tutorial iOS 8 but I needed this in swift 3 for my project. I updated this for Swift 3 iOS 10 here:
in your main view controller add this to viewDidLayOut to show a range slider.
override func viewDidLayoutSubviews() {
let margin: CGFloat = 20.0
let width = view.bounds.width - 2.0 * margin
rangeSlider.frame = CGRect(x: margin, y: margin + topLayoutGuide.length + 170, width: width, height: 31.0)
}
create the helper function to print slider output below viewDidLayoutSubviews()
func rangeSliderValueChanged() { //rangeSlider: RangeSlider
print("Range slider value changed: \(rangeSlider.lowerValue) \(rangeSlider.upperValue) ")//(\(rangeSlider.lowerValue) \(rangeSlider.upperValue))
}
Create the file RangeSlider.swift and add this to it:
import UIKit
import QuartzCore
class RangeSlider: UIControl {
var minimumValue = 0.0
var maximumValue = 1.0
var lowerValue = 0.2
var upperValue = 0.8
let trackLayer = RangeSliderTrackLayer()//= CALayer() defined in RangeSliderTrackLayer.swift
let lowerThumbLayer = RangeSliderThumbLayer()//CALayer()
let upperThumbLayer = RangeSliderThumbLayer()//CALayer()
var previousLocation = CGPoint()
var trackTintColor = UIColor(white: 0.9, alpha: 1.0)
var trackHighlightTintColor = UIColor(red: 0.0, green: 0.45, blue: 0.94, alpha: 1.0)
var thumbTintColor = UIColor.white
var curvaceousness : CGFloat = 1.0
var thumbWidth: CGFloat {
return CGFloat(bounds.height)
}
override init(frame: CGRect) {
super.init(frame: frame)
trackLayer.rangeSlider = self
trackLayer.contentsScale = UIScreen.main.scale
layer.addSublayer(trackLayer)
lowerThumbLayer.rangeSlider = self
lowerThumbLayer.contentsScale = UIScreen.main.scale
layer.addSublayer(lowerThumbLayer)
upperThumbLayer.rangeSlider = self
upperThumbLayer.contentsScale = UIScreen.main.scale
layer.addSublayer(upperThumbLayer)
}
required init?(coder: NSCoder) {
super.init(coder: coder)
}
func updateLayerFrames() {
trackLayer.frame = bounds.insetBy(dx: 0.0, dy: bounds.height / 3)
trackLayer.setNeedsDisplay()
let lowerThumbCenter = CGFloat(positionForValue(value: lowerValue))
lowerThumbLayer.frame = CGRect(x: lowerThumbCenter - thumbWidth / 2.0, y: 0.0,
width: thumbWidth, height: thumbWidth)
lowerThumbLayer.setNeedsDisplay()
let upperThumbCenter = CGFloat(positionForValue(value: upperValue))
upperThumbLayer.frame = CGRect(x: upperThumbCenter - thumbWidth / 2.0, y: 0.0,
width: thumbWidth, height: thumbWidth)
upperThumbLayer.setNeedsDisplay()
}
func positionForValue(value: Double) -> Double {
return Double(bounds.width - thumbWidth) * (value - minimumValue) /
(maximumValue - minimumValue) + Double(thumbWidth / 2.0)
}
override var frame: CGRect {
didSet {
updateLayerFrames()
}
}
override func beginTracking(_ touch: UITouch, with event: UIEvent?) -> Bool {
previousLocation = touch.location(in: self)
// Hit test the thumb layers
if lowerThumbLayer.frame.contains(previousLocation) {
lowerThumbLayer.highlighted = true
} else if upperThumbLayer.frame.contains(previousLocation) {
upperThumbLayer.highlighted = true
}
return lowerThumbLayer.highlighted || upperThumbLayer.highlighted
}
func boundValue(value: Double, toLowerValue lowerValue: Double, upperValue: Double) -> Double {
return min(max(value, lowerValue), upperValue)
}
override func continueTracking(_ touch: UITouch, with event: UIEvent?) -> Bool {
let location = touch.location(in: self)
// 1. Determine by how much the user has dragged
let deltaLocation = Double(location.x - previousLocation.x)
let deltaValue = (maximumValue - minimumValue) * deltaLocation / Double(bounds.width - thumbWidth)
previousLocation = location
// 2. Update the values
if lowerThumbLayer.highlighted {
lowerValue += deltaValue
lowerValue = boundValue(value: lowerValue, toLowerValue: minimumValue, upperValue: upperValue)
} else if upperThumbLayer.highlighted {
upperValue += deltaValue
upperValue = boundValue(value: upperValue, toLowerValue: lowerValue, upperValue: maximumValue)
}
// 3. Update the UI
CATransaction.begin()
CATransaction.setDisableActions(true)
updateLayerFrames()
CATransaction.commit()
sendActions(for: .valueChanged)
return true
}
override func endTracking(_ touch: UITouch?, with event: UIEvent?) {
lowerThumbLayer.highlighted = false
upperThumbLayer.highlighted = false
}
}
Next add the thumb layer subclass file RangeSliderThumbLayer.swift and add this to it:
import UIKit
class RangeSliderThumbLayer: CALayer {
var highlighted = false
weak var rangeSlider: RangeSlider?
override func draw(in ctx: CGContext) {
if let slider = rangeSlider {
let thumbFrame = bounds.insetBy(dx: 2.0, dy: 2.0)
let cornerRadius = thumbFrame.height * slider.curvaceousness / 2.0
let thumbPath = UIBezierPath(roundedRect: thumbFrame, cornerRadius: cornerRadius)
// Fill - with a subtle shadow
let shadowColor = UIColor.gray
ctx.setShadow(offset: CGSize(width: 0.0, height: 1.0), blur: 1.0, color: shadowColor.cgColor)
ctx.setFillColor(slider.thumbTintColor.cgColor)
ctx.addPath(thumbPath.cgPath)
ctx.fillPath()
// Outline
ctx.setStrokeColor(shadowColor.cgColor)
ctx.setLineWidth(0.5)
ctx.addPath(thumbPath.cgPath)
ctx.strokePath()
if highlighted {
ctx.setFillColor(UIColor(white: 0.0, alpha: 0.1).cgColor)
ctx.addPath(thumbPath.cgPath)
ctx.fillPath()
}
}
}
}
Finally add the track layer subclass file RangeSliderTrackLayer.swift and add the following to it:
import Foundation
import UIKit
import QuartzCore
class RangeSliderTrackLayer: CALayer {
weak var rangeSlider: RangeSlider?
override func draw(in ctx: CGContext) {
if let slider = rangeSlider {
// Clip
let cornerRadius = bounds.height * slider.curvaceousness / 2.0
let path = UIBezierPath(roundedRect: bounds, cornerRadius: cornerRadius)
ctx.addPath(path.cgPath)
// Fill the track
ctx.setFillColor(slider.trackTintColor.cgColor)
ctx.addPath(path.cgPath)
ctx.fillPath()
// Fill the highlighted range
ctx.setFillColor(slider.trackHighlightTintColor.cgColor)
let lowerValuePosition = CGFloat(slider.positionForValue(value: slider.lowerValue))
let upperValuePosition = CGFloat(slider.positionForValue(value: slider.upperValue))
let rect = CGRect(x: lowerValuePosition, y: 0.0, width: upperValuePosition - lowerValuePosition, height: bounds.height)
ctx.fill(rect)
}
}
}
Build Run and Get:
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:
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:
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.
try this code :
override func viewDidLayoutSubviews() {
let margin: CGFloat = 20.0
let width = view.bounds.width - 2.0 * margin
rangeSlider.frame = CGRect(x: margin, y: margin + topLayoutGuide.length,
width: width, height: 31.0)
}
I implemented the range slider using :
https://github.com/Zengzhihui/RangeSlider
In the GZRangeSlider class, there is a method called :
private func setLabelText()
In that method, just put :
leftTextLayer.frame = CGRectMake(leftHandleLayer.frame.minX - 0.5 * (kTextWidth - leftHandleLayer.frame.width), leftHandleLayer.frame.minY - kTextHeight, kTextWidth, kTextHeight)
rightTextLayer.frame = CGRectMake(rightHandleLayer.frame.minX - 0.5 * (kTextWidth - leftHandleLayer.frame.width), leftTextLayer.frame.minY, kTextWidth, kTextHeight)
to animate the lower and upper labels..
This one is working well for me and its in swift.. just try it..

Resources