Hy,
I'm trying to implement a custom UISlider from scratch based on UIGestureRecognizer because I have to make the thumb view a custom one with a clean design.
The UIGestureRecognizer usage is a request from technical lead.
What I have until now it's a sample where I made tests:
func setupSlider() {
let panGesture = UIPanGestureRecognizer(target: self, action: #selector(dragged(gestureRecognizer:)))
sliderView.isUserInteractionEnabled = true
sliderView.addGestureRecognizer(panGesture)
}
#objc func dragged(gestureRecognizer: UIPanGestureRecognizer) {
if gestureRecognizer.state == UIGestureRecognizer.State.began || gestureRecognizer.state == UIGestureRecognizer.State.changed {
let translation = gestureRecognizer.translation(in: self.sliderContainer)
gestureRecognizer.view!.center = CGPoint(x: gestureRecognizer.view!.center.x + translation.x, y: gestureRecognizer.view!.center.y + translation.y)
gestureRecognizer.setTranslation(CGPoint(x: 0, y: 0), in: self.view)
}
}
In this point I have twoproblems:
to keep the slider view in the middle of container
to be able to get "curent value" of the slider based on the min and max value of the interval
Can you help with any suggestion, please ?
Kind regards.
Not technically an answer to your question but....
I'm trying to implement a custom UISlider from scratch based on UIGestureRecognizer because I have to make the thumb view a custom one with a clean design.
Are you aware that you can customize the thumb image?
See for example this article:
https://zeitschlag.net/customizing-uislider/
This is the API: setThumbImage(_:for:)
The UIGestureRecognizer usage is a request from technical lead.
If you can manage to get the result by using UISlider after all, I am sure your lead will welcome it.
Related
Is there any way to detect when the user swipe across SCNNode?
I ve already tried UISwipeGestureReconizer but it didn't work for me. Any ideas?
Try adding a pan gesture recognizer
let panRecognizer = UIPanGestureRecognizer(target: self, action: #selector(panGesture))
panRecognizer?.delegate = self
view.addGestureRecognizer(panRecognizer!)
Depending if you want to know which direction you'll have to check out the translation of the view.
#objc func panGesture(sender: UIPanGestureRecognizer){
let translation = sender.translation(in: sender.view)
print(translation.x, translation.y)
}
}
Make sure you have you add the delegate - UIGestureRecognizerDelegate
Hope that gives you a good start
I have a UIView with a swipe gesture .
let swipeUpGesture = UISwipeGestureRecognizer(target: self, action: #selector(NextStepCaptureVC.handleSwipeUp(gesture:)))
swipeUpGesture.direction = .up
view.addGestureRecognizer(swipeUpGesture)
func handleSwipeUp(gesture: UISwipeGestureRecognizer) {
print("Swipe Up")
heightSlider.setValue(20, animated: true)
}
When I try to change the value it works but the value jump from 0 to 20. I want the value to change continuously while swiping. How can I do it?
Judging from your code, it looks like you are trying to make 'panning up and down' on the screen translate to the UISlider value changing.
As already mentioned by others, first thing is to change your UISwipeGestureRecognizer to a UIPanGestureRecognizer
let pan = UIPanGestureRecognizer(target: self, action: #selector(pan(gesture:)))
view.addGestureRecognizer(pan)
Then in your pan function, you need to update the slider value based on how much the user has panned.
func pan(gesture: UIPanGestureRecognizer) {
// The amount of movement up/down since last change in slider
let yTranslation = gesture.translation(in: gesture.view).y
// The slide distance needed to equal one value in the slider
let tolerance: CGFloat = 5
if abs(yTranslation) >= tolerance {
let newValue = heightSlider.value + Float(yTranslation / tolerance)
heightSlider.setValue(newValue, animated: true)
// Reset the overall translation within the view
gesture.setTranslation(.zero, in: gesture.view)
}
}
Simply adjust the tolerance variable to make the user swipe more/less in order to adjust the slider value.
You don't want a UISwipeGestureRecognizer, you want a UIPanGestureRecognizer. A swipe is a one-time gesture.
Apple's documentation says "A swipe is a discrete gesture, and thus the associated action message is sent only once per gesture."
You set up a main action from your gesture recognizer to your code (You can use interface builder for that)
#IBAction func handlePan(recognizer:UIPanGestureRecognizer) {
if recognizer.state == UIGestureRecognizerState.Began {
} else if recognizer.state == UIGestureRecognizerState.Ended {
} else if recognizer.state == UIGestureRecognizerState.Changed {
}
}
Good luck! =]
I have been trying to implement a Snapchat-like edit text on an image.
What I did so far is implement a UILabel in the center of the UIImageView and I added 3 gestures to this UILabel: UIPanGestureRecognizer, UIPinchGestureRecognizer & UIRotationGestureRecognizer.
I have managed to implement the Pan method, but I am having hard time to make the Pinch + Rotation as smooth as they do, I get horrible results T_T
How do you guys think this was made? which components are involved in this & if you have any reading / watching material I could use to accomplish this.
Thanks :)
EDIT:
These are the methods I implemented to handle Pinch & Rotation:
func handlePinch(recognizer: UIPinchGestureRecognizer) {
if let view = recognizer.view as? UILabel {
view.transform = CGAffineTransformScale(view.transform, recognizer.scale, recognizer.scale)
}
}
func handleRotate(recognizer: UIRotationGestureRecognizer) {
if let view = recognizer.view as? UILabel {
view.transform = CGAffineTransformRotate(view.transform, recognizer.rotation)
}
}
Preview video of how the pinch I implemented works:
https://drive.google.com/file/d/0B-AVM51jxsvUY2RUUHdWbGo5QlU/view?usp=sharing
Found a solution, apparently all I needed to do in the Rotation & Pinch is to always reset the view's rotation / scale.
For instance, setting my recognizer.scale to 1.0 and recognizer.rotation to 0.0.
Here is an example of my code:
func handlePan(recognizer: UIPanGestureRecognizer) {
let translation = recognizer.translationInView(view)
if let view = recognizer.view {
view.center = CGPoint(x:view.center.x + translation.x,
y:view.center.y + translation.y)
}
recognizer.setTranslation(CGPointZero, inView: view)
}
func handlePinch(recognizer: UIPinchGestureRecognizer) {
if let view = recognizer.view as? UILabel {
let pinchScale: CGFloat = recognizer.scale
view.transform = CGAffineTransformScale(view.transform, pinchScale, pinchScale)
recognizer.scale = 1.0
}
}
func handleRotate(recognizer: UIRotationGestureRecognizer) {
if let view = recognizer.view as? UILabel {
let rotation: CGFloat = recognizer.rotation
view.transform = CGAffineTransformRotate(view.transform, rotation)
recognizer.rotation = 0.0
}
}
For "it scales up / down way too much in a very aggressive way":
You need to handle the pinch gesture scale value according to your need.
From your recogniser method, you get the scale value as:
var pinchScale: CGFloat = recogniser.scale
You need to modify this value either like decrease it by /10 or /100 as per your need, and use this value in the label transformation instead of using the pangesture scale.
The issue you have is that your code takes the current transform and adds another transform based on the current "movement", so you accumulate changes (compound them, really) as you move during a single gesture.
Keep instance variables for rotation, scale, and movement, update the relevant one in each of your gesture recognizer's actions (you'll also need to store the state of each at the beginning of each gesture, so you can apply the delta to the initial state), and create the transform from scratch using those three variables. The transform creating should of course be factorized in a separate function, since you're going to use it several times.
I'm not sure if this is exactly what you're looking for (I've never used snapchat), but this could give you some ideas
https://github.com/danielinoa/DIImageView
I'm not sure this one has a pinch gesture, but I'm not entirely sure how you mean it to be used anyway.
Here is a demo of that project:
https://www.cocoacontrols.com/controls/diimageview
In general, I recommend checking cocoacontrols every time you venture to implement something like this. There are usually solid examples to get you started, and sometimes, you'll find exactly what you need.
Good day.
This is my last option — to ask here.
The problem is: I am building multiply view app. On the first screen I have UIImageView that I can move with UIPanGestureRecognizer function:
#IBAction func movement(recognizer: UIPanGestureRecognizer) {
let translation = recognizer.translationInView(self.view)
if let view = recognizer.view {
view.center = CGPoint(x:view.center.x + translation.x, y:view.center.y + translation.y)
}
recognizer.setTranslation(CGPointZero, inView: self.view)
}
It's a usual code to move things around, I took at raywenderlich.com
So what I want is to save position of the UIImageView element after interaction with it and after segue.
I believe that I need to return CGPoint from this function and segue it like so:
override func prepareForSegue(segue: UIStoryboardSegue, sender: AnyObject?) {
if segue.identifier == "showPlaylistDetail" {
let playlistDetailController = segue.destinationViewController as! PlaylistDetailViewController
playlistDetailController.image2.center = image1.center
}
}
So my question(s) is(are):
Do I use right code to move an object with Pan Gesture Recognizer?
How would you return CGPoint from this function and how would you read it?
How would I save UIImageView's position in process of segue and after?
huh... This little bug is killing me. I bet, it is easy to solve, but as far as I am beginner I have no idea how :(
From your description there are several solutions, my would be.
maintain a property currentCenter in the firstViewController
var currentCenter:CGPoint
In method movement add the following line after setting view.center
currentCenter.x = view.center.x
currentCenter.y = view.center.y
and then prepareForSegue as you said.
Hope this approach helps!
I'm making an iOS8 app using Swift. I'd like the user to be able to use gestures to reveal certain parts of the interface. So for example, the user slides their finger up and the view they slid their finger up moves out of the way, following their finger to reveal another view underneath.
What I'd like is a gesture to give a result similar to the notification box that you can pull down from the top of the screen. I've been looking at the documentation and I can't seem to find a suitable gesture.
I saw one called UISwipeGestureRecogniser, but the only problem is, it doesn't follow your finger, it simply runs a function when I slide my finger up / down.
Here's the documentation page:
https://developer.apple.com/documentation/uikit/uigesturerecognizer
You're looking for the UIPanGestureRecognizer. You'll find the Apple Documentation here.
Here's a sample handler that will move a view with your finger. In Interface Builder, add a UIPanGestureRecognizer to a view that you want to be able to drag. Set the delegate to your ViewController. Set the action to this action:
Swift 2.X:
#IBAction func handlePan(gestureRecognizer: UIPanGestureRecognizer) {
if gestureRecognizer.state == .Began || gestureRecognizer.state == .Changed {
let translation = gestureRecognizer.translationInView(self.view)
// note: 'view' is optional and need to be unwrapped
gestureRecognizer.view!.center = CGPointMake(gestureRecognizer.view!.center.x + translation.x, gestureRecognizer.view!.center.y + translation.y)
gestureRecognizer.setTranslation(CGPointMake(0,0), inView: self.view)
}
}
Swift 3:
#IBAction func handlePan(_ gestureRecognizer: UIPanGestureRecognizer) {
if gestureRecognizer.state == .began || gestureRecognizer.state == .changed {
let translation = gestureRecognizer.translation(in: self.view)
// 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.view)
}
}
Of course, you can add the UIPanGestureRecognizer programmatically:
In viewDidLoad for your ViewController, create the recognizer and add it to the view you want to be able to drag:
let gestureRecognizer = UIPanGestureRecognizer(target: self, action: #selector(handlePan))
self.someDraggableView.addGestureRecognizer(gestureRecognizer)