I want to perform some animation on secondTextField when the FirstTextfield becomesFirstResponder
After resign first responder the animation should reverse back in second text field. How can I achieve this in swift?
Note: It is different from moving textfield to the top on keyboard appears.
func textFieldShouldBeginEditing(textField: UITextField) -> Bool {
if(textField == firstTextField) {
UIView.animateWithDuration(1.0, animations: {
self.secTextField.frame = CGRectMake(self.secTextField.frame.origin.x + 500, self.secTextField.frame.origin.y, self.secTextField.frame.size.width, self.secTextField.frame.size.height) })
}
return true
}
What I want to do is, when the user types in firstTextField, the secTextField should go and hide out of sight.
What actually happens is the secTextField comes from out of sight to its original position
You can use the delegate methods of UITextField to achieve this. If you explain more about your animation I can help you with that also.
func textFieldDidBeginEditing(textField: UITextField) {
if textField == self.firstTextField {
UIView.animateWithDuration(2, delay: 0, options: nil, animations: { () -> Void in
self.secondTextField.frame = CGRectOffset(self.secondTextField.frame, 500, 0)
}, completion: nil)
}
}
func textFieldShouldReturn(textField: UITextField) -> Bool {
if textField == self.firstTextField {
UIView.animateWithDuration(2, delay: 0, options: nil, animations: { () -> Void in
self.secondTextField.frame = CGRectOffset(self.secondTextField.frame, -500, 0)
}, completion: nil)
}
textField.resignFirstResponder()
return true
}
Don't forget to set delegates on the UITextField objects (on your viewDidLoad)
self.firstTextField.delegate = self
self.secondTextField.delegate = self
You can download the example from here: https://github.com/alextarrago/text-field-test
In my case it works for me. Just use self.view.layoutIfNeeded()
func textFieldShouldBeginEditing(textField: UITextField) -> Bool {
if(textField == firstTextField) {
UIView.animateWithDuration(1.0, animations: {
self.secTextField.frame = CGRectMake(self.secTextField.frame.origin.x + 500, self.secTextField.frame.origin.y, self.secTextField.frame.size.width, self.secTextField.frame.size.height)
self.view.layoutIfNeeded()
})
}
return true
}
I finally found the answer.
I did the following steps.
Clean My project,
Enable and then again disable the Auto-Layouts.
Set the delegate for those textfields both in xib and swift file.
Then the coding:
`self.secTextField.frame.origin.x = self.secTextField.frame.origin.x + 500`
Related
(Swift)
I recently noticed a button on my viewController was not clickable because of the animation that is infinitely assigned to it. However, I really need to be able to click that button.
override func viewDidLoad() {
super.viewDidLoad()
self.startGradientFunction()
}
// Function that changes colors over time
func startGradientFunction() {
UIView.animate(withDuration: 2.5, animations: { () -> Void in
self.view.backgroundColor = self.hexStringToUIColor(hex: "66B8FF")
self.readyBtn.backgroundColor = self.hexStringToUIColor(hex: "3F86C3")
}, completion: { (finished: Bool) in
UIView.animate(withDuration: 2.5, animations: { () -> Void in
self.view.backgroundColor = self.hexStringToUIColor(hex: "57FFC4")
self.readyBtn.backgroundColor = self.hexStringToUIColor(hex: "20CD91")
}, completion: { (finished: Bool) in
UIView.animate(withDuration: 2.5, animations: { () -> Void in
self.view.backgroundColor = self.hexStringToUIColor(hex: "9C49FF")
self.readyBtn.backgroundColor = self.hexStringToUIColor(hex: "7E3BCD")
}, completion: { (finished: Bool) in
self.startGradientFunction()
})
})
})
}
How can I make it selectable again?
I would be glad to know someone can help me.
You need to add user interaction to your animation options:
https://developer.apple.com/documentation/uikit/uiview/animationoptions/1622440-allowuserinteraction
(But you should also fix your way of doing a repeating animation so that you don’t recurse infinitely.)
I have UIProgressView.On begin to text edit for a UITextField I set the value of progress bar to 1 . Before that initially I make it progress to 0.1 .But it is setting progress only once. If I first set progress to 0.1 then after it does not set progress to 1.please tell me what is the issue ?
func textFieldDidBeginEditing(_ textField: UITextField) {
setViewBottomColor()
var view:BottomView?
if textField == textFieldEmail {
view = self.bottomViewFirst
view?.trackTintColor = Constant.AppColor.viewBottom
view?.progressTintColor = Constant.AppColor.purpleViewColor
}
else if textField == textFieldPassword {
view = self.bottomViewSecond
view?.trackTintColor = Constant.AppColor.viewBottom
view?.progressTintColor = Constant.AppColor.purpleViewColor
}
if view != nil {
view?.setProgress(1, animated: true)
UIView.animate(withDuration: 1.0, animations: {
view?.layoutIfNeeded()
}, completion: { (finish) in
})
}
}
func setViewBottomColor() {
self.bottomViewFirst.trackTintColor = Constant.AppColor.viewBottom
self.bottomViewFirst.progressTintColor = Constant.AppColor.purpleViewColor
self.bottomViewFirst?.setProgress(0.1, animated: false)
self.bottomViewFirst?.layoutIfNeeded()
}
Check below code snippet I have used to check. It is working fine.
You may check few things:
All IBOutlets connections must be there.
If you are using custom UIProgressView as BottomView then you must changed both progress view class in xib/storyboard as well.
No Need to have view animation if for progress value change only.
func textFieldDidBeginEditing(_ textField: UITextField) {
resetProgresses()
var view = UIProgressView()
if textField == t1 {
view = self.progressBar
view.trackTintColor = .red
view.progressTintColor = .green
}
else if textField == t2 {
view = self.progressBar2
view.trackTintColor = .green //Constant.AppColor.viewBottom
view.progressTintColor = .red//Constant.AppColor.purpleViewColor
}
if view != nil {
view.setProgress(1, animated: true)
}
}
func resetProgresses() {
self.progressBar?.setProgress(0.1, animated: true)
self.progressBar2?.setProgress(0.1, animated: true)
}
I have searched
here: Move a view up only when the keyboard covers an input field
here: Move textfield when keyboard appears swift
here: How to make a UITextField move up when keyboard is present?
and here: https://developer.apple.com/library/content/documentation/StringsTextFonts/Conceptual/TextAndWebiPhoneOS/KeyboardManagement/KeyboardManagement.html
Unfortunately, all of the links and seemingly everywhere else I can find do not give a good clean solution that I am looking for. They are either outdated with Obj-c code, or plain do not work in the current iteration of Xcode 9 with Swift 4.
How do I manage a keyboard that is covering text fields at the bottom of my view? I want the screen's view to move only when they keyboard is covering the text field view, without using a scroll view, with the ability to animate this to make it look pretty rather than have it just snap, and most importantly I do not want to use an outside library.
CoreAnimation libraries from Apple are great and all, but all of the sample code is outdated and in objective c which is deprecated at this point (I cannot believe that Apple isn't updating their documentation).
If someone could point me in the right direction to updated and current code or a library from Apple I am missing that will specifically address this issue, it would be much appreciated.
You can use IQKeyboardManagerSwift to solve your issue easily and fast.
Use below pod in your pod file Which give support to Swift 4.
pod 'IQKeyboardManagerSwift', '5.0.0'
Here is link to implement IQKeyboardManagerSwift.
https://github.com/hackiftekhar/IQKeyboardManager
Thanks!!!
This code will work, making your textField animating to above keyboard if its frame intersects with that of keyboard and animating back to original position on keyboard hide.
#IBOutlet weak var textField: UITextField!
var offsetY:CGFloat = 0
override func viewWillAppear(_ animated: Bool) {
super.viewWillAppear(animated)
NotificationCenter.default.addObserver(self, selector: #selector(ViewController.keyboardFrameChangeNotification(notification:)), name: NSNotification.Name.UIKeyboardWillChangeFrame, object: nil)
}
func keyboardFrameChangeNotification(notification: Notification) {
if let userInfo = notification.userInfo {
let endFrame = userInfo[UIKeyboardFrameEndUserInfoKey] as? CGRect
let animationDuration = userInfo[UIKeyboardAnimationDurationUserInfoKey] as? Double ?? 0
let animationCurveRawValue = (userInfo[UIKeyboardAnimationCurveUserInfoKey] as? Int) ?? Int(UIViewAnimationOptions.curveEaseInOut.rawValue)
let animationCurve = UIViewAnimationOptions(rawValue: UInt(animationCurveRawValue))
if let _ = endFrame, endFrame!.intersects(self.textField.frame) {
self.offsetY = self.textField.frame.maxY - endFrame!.minY
UIView.animate(withDuration: animationDuration, delay: TimeInterval(0), options: animationCurve, animations: {
self.textField.frame.origin.y = self.textField.frame.origin.y - self.offsetY
}, completion: nil)
} else {
if self.offsetY != 0 {
UIView.animate(withDuration: animationDuration, delay: TimeInterval(0), options: animationCurve, animations: {
self.textField.frame.origin.y = self.textField.frame.origin.y + self.offsetY
self.offsetY = 0
}, completion: nil)
}
}
}
}
This piece of code worked for me.
In case of multiple textfields
I have implemented only for the textfields which are at the bottom (without using notification observer).
If you are using scrollView, this code might be helpful
(scrollViewDidScroll is optional)
func scrollViewDidScroll(_ scrollView: UIScrollView) {
scrollView.contentSize = CGSize(width: self.scrollView.frame.size.width, height: (scrollView.frame.size.height + 300))// To be more specific, I have used multiple textfields so wanted to scroll to the end.So have given the constant 300.
}
func textFieldDidBeginEditing(_ textField:UITextField) {
self.scrollView.setContentOffset(textField.frame.origin, animated: true)
}
and if you want to set the textfields position according to the view,
try this:
func textFieldDidBeginEditing(_ textField:UITextField){
textField.frame.origin.y = textField.frame.origin.y - 150 //(If have not used contentsizing the scroll view then exclude this line)default origin takes the texfield to the top of the view.So to set lower textfields to proper position have used the constant 150.
self.scrollView.setContentOffset(textField.frame.origin, animated: true)
}
To do specifically for textfields at the bottom. Check their tag value textfield.tag in textFieldDidBeginEditing
func textFieldDidBeginEditing(_ textField:UITextField){
if textField.tag = 4 { //tag value of the textfield which are at the bottom
self.scrollView.setContentOffset(textField.frame.origin, animated: true)
}
}
If you implemented textfields in tableView go with notification observer which is explained below.
If there are multiple textfields in a tableView preferably go with Notification Observer
override func viewDidAppear(_ animated: Bool) {
NotificationCenter.default.addObserver(self, selector: #selector(keyboardWillShow(notification:)), name: NSNotification.Name.UIKeyboardDidShow, object: nil)
NotificationCenter.default.addObserver(self, selector: #selector(keyboardWillHide(notification:)), name: NSNotification.Name.UIKeyboardDidHide, object: nil)
}
#objc func keyboardWillShow(notification: NSNotification) {
if let keyboardHeight = (notification.userInfo?[UIKeyboardFrameEndUserInfoKey] as? NSValue)?.cgRectValue.height {
self.tableView.contentInset = UIEdgeInsetsMake(0, 0, keyboardHeight, 0)
}
}
#objc func keyboardWillHide(notification: NSNotification) {
UIView.animate(withDuration: 0.2, animations: {
// For some reason adding inset in keyboardWillShow is animated by itself but removing is not, that's why we have to use animateWithDuration here
self.tableView.contentInset = UIEdgeInsetsMake(0, 0, 0, 0)
})
}
deinit {
print("denit")
NotificationCenter.default.removeObserver(self)
}
worked perfectly for me:
http://www.seemuapps.com/move-uitextfield-when-keyboard-is-presented
If delegates are set right,
func textFieldDidBeginEditing(_ textField: UITextField) {
moveTextField(textField, moveDistance: -250, up: true)
}
// Finish Editing The Text Field
func textFieldDidEndEditing(_ textField: UITextField) {
moveTextField(textField, moveDistance: -250, up: false)
}
// Hide the keyboard when the return key pressed
func textFieldShouldReturn(_ textField: UITextField) -> Bool {
textField.resignFirstResponder()
return true
}
// Move the text field in a pretty animation!
func moveTextField(_ textField: UITextField, moveDistance: Int, up: Bool) {
let moveDuration = 0.3
let movement: CGFloat = CGFloat(up ? moveDistance : -moveDistance)
UIView.beginAnimations("animateTextField", context: nil)
UIView.setAnimationBeginsFromCurrentState(true)
UIView.setAnimationDuration(moveDuration)
self.view.frame = self.view.frame.offsetBy(dx: 0, dy: movement)
UIView.commitAnimations()
}
Add an extensio to Uiview:
import UIKit
//Binding view to keyboard changes
extension UIView {
func bindToKeyboard(){
NotificationCenter.default.addObserver(self, selector: #selector(UIView.keyboardWillChange(_:)), name: NSNotification.Name.UIKeyboardWillChangeFrame, object: nil)
}
#objc func keyboardWillChange(_ notification: NSNotification) {
let duration = notification.userInfo![UIKeyboardAnimationDurationUserInfoKey] as! Double
let curve = notification.userInfo![UIKeyboardAnimationCurveUserInfoKey] as! UInt
let curFrame = (notification.userInfo![UIKeyboardFrameBeginUserInfoKey] as! NSValue).cgRectValue
let targetFrame = (notification.userInfo![UIKeyboardFrameEndUserInfoKey] as! NSValue).cgRectValue
let deltaY = targetFrame.origin.y - curFrame.origin.y
UIView.animateKeyframes(withDuration: duration, delay: 0.0, options: UIViewKeyframeAnimationOptions(rawValue: curve), animations: {
self.frame.origin.y += deltaY
},completion: {(true) in
self.layoutIfNeeded()
})
}
}
I have a UIView EmptyCollectionView, which I display when my UICollectionView is empty. The way I have this working is that I create the UIView and addSubview in viewDidLoad of my ViewController, then change toggle isHidden property of the view (as well as the collectionview) as needed.
I'd like to polish things up a little now I have the core function working, and I wan't to add some subtle animation to the subviews contained in my empty view, such as making the contained imageview bounce on display.
So my question is, what is the best way to detect when the UIView is being shown (i.e. is there a viewDidAppear type callback I could use)?
Supplementary question: I'm new to this... Is adding the empty view and toggling the isHidden property a good way of doing this? Or should I be doing it a different way? (i.e. should I instead be creating and destroying the view as needed, rather than keeping it around)
Thanks
The best way in my opinion is to extend UIView
extension UIView {
func fadeIn(_ duration: TimeInterval = 0.2, onCompletion: (() -> Void)? = nil) {
self.alpha = 0
self.isHidden = false
UIView.animate(withDuration: duration,
animations: { self.alpha = 1 },
completion: { (value: Bool) in
if let complete = onCompletion { complete() }
}
)
}
func fadeOut(_ duration: TimeInterval = 0.2, onCompletion: (() -> Void)? = nil) {
UIView.animate(withDuration: duration,
animations: { self.alpha = 0 },
completion: { (value: Bool) in
self.isHidden = true
if let complete = onCompletion { complete() }
}
)
}
}
So you just have to call view.fadeIn() for a default 0.2 sec animation, or view.fadeIn(1) to make it last one second.
You can even add a completion event:
view.fadeOut(0.5, onCompletion: {
print("Animation completed, do whatever you want")
})
This works, I hope it can help you. To hide view:
UIView.animate(withDuration: 0.3/*Animation Duration second*/, animations: {
self.EmptyCollectionView.alpha = 0
}, completion: {
(value: Bool) in
self.EmptyCollectionView.isHidden = true
})
To show view:
self.EmptyCollectionView.isHidden = false
UIView.animate(withDuration: 0.3, animations: {
self.EmptyCollectionView.alpha = 1
}, completion: nil)
Swift 4.2 extension to allow animation when setting isHidden on any UIView class:
extension UIView {
func setIsHidden(_ hidden: Bool, animated: Bool) {
if animated {
if self.isHidden && !hidden {
self.alpha = 0.0
self.isHidden = false
}
UIView.animate(withDuration: 0.25, animations: {
self.alpha = hidden ? 0.0 : 1.0
}) { (complete) in
self.isHidden = hidden
}
} else {
self.isHidden = hidden
}
}
}
You can animate the alpha property of EmptyCollectionView to either 0 to hide or 1 to show
UIView.animate(withDuration: 0.5) {
self.EmptyCollectionView.alpha = 0
}
Also make sure that isOpaque property is set to False to enable Transparency of the view
Swift 5
import UIKit
extension UIView {
func animateSetHidden(_ hidden: Bool, duration: CGFloat = CATransaction.animationDuration(), completion: #escaping (Bool)->() = { _ in}) {
if duration > 0 {
if self.isHidden && !hidden {
self.alpha = 0
self.isHidden = false
}
UIView.animate(withDuration: duration, delay:0, options: .beginFromCurrentState) {
self.alpha = hidden ? 0 : 1
} completion: { c in
if c {
self.isHidden = hidden
}
completion(c)
}
} else {
self.isHidden = hidden
self.alpha = hidden ? 0 : 1
completion(true)
}
}
}
I'm trying to create a basic animation. I need to touch on a button to hide or show.
I wrote this code to tap on the screen:
func visibleControlButton(_ sender: UITapGestureRecognizer) {
if (backButton!.isHidden) {
_UIButtonHiddenAnimation.hiddenAnimation(button: self.backButton!, hide: false)
} else {
_UIButtonHiddenAnimation.hiddenAnimation(button: self.backButton!, hide: true)
}
}
Definition _UIButtonHiddenAnimation:
class _UIButtonHiddenAnimation {
class func hiddenAnimation(button: UIButton, hide: Bool) {
UIView.animate(withDuration: 0.2,
animations: {
hide ? (button.alpha = 0) : (button.alpha = 1.0)
},
completion: {
finished in hide ? (button.isHidden = true) : (button.isHidden = false)
})
}
}
Animates just hide the button. How to make an animated appearance of a button?
The problem is that if the button is hidden, you are animating the alpha to 1 but we cannot see that — because the button is hidden! Then you set isHidden to false and the button jumps into view.
The solution: forget all about isHidden and change only the alpha — and then change your if test to match what you are doing with the button, i.e. simply test against its alpha value. Thus (neatening things up as we go):
class _UIButtonHiddenAnimation {
class func hiddenAnimation(button: UIButton, hide: Bool) {
UIView.animate(withDuration: 0.2, animations: {
button.alpha = hide ? 0 : 1.0
})
}
}
func visibleControlButton(_ sender: UITapGestureRecognizer) {
_UIButtonHiddenAnimation.hiddenAnimation(
button: self.backButton!, hide: backButton!.alpha > 0.1)
}