This code was working beautifully in ios 7. However, with ios8 and xcode 6.0.1 it has stopped working. When a user clicked on a text field to enter text, the field animated to float just above the top of the keyboard so they can see what they are typing. Any thoughts on why this fails to work now. I can see it start to animate for a split second, but then the textfield disappears. Frustrating.
- (void)textFieldDidBeginEditing:(UITextField *)textField {
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDelegate:self];
[UIView setAnimationDuration:0.4];
[UIView setAnimationBeginsFromCurrentState:YES];
textField.frame = CGRectMake(textField.frame.origin.x, (textField.frame.origin.y - 200.0),
textField.frame.size.width, textField.frame.size.height);
_searchBtn.frame = CGRectMake(_searchBtn.frame.origin.x, (_searchBtn.frame.origin.y - 200.0),
_searchBtn.frame.size.width, _searchBtn.frame.size.height);
[UIView commitAnimations];
textField.alpha = .75;
}
The problem is that your code adjusts your TextField's position by a fixed value of 200.0
This was probably great for iOS7 but things have changed in iOS8 for two reasons:
The system keyboard has an additional view for showing predicted words while typing
Custom keyboards can be as high as the developer chooses
You need to change your approach move moving the location of your TextField whenever the keyboard is shown or hidden using the following two notifications:
UIKeyboardWillShowNotification
UIKeyboardWillHideNotification
In the following thread I explain the problems that can arise and how to properly move your views around as the keyboard opens:
can't get correct value of keyboard height in iOS8
EDIT 1:
Assuming the textbox has an outlet called "yourTextBox", the code to modify the position of your textbox could look something like:
CGFloat screenHeight = [[UIScreen mainScreen] bounds].size.height;
CGFloat keyboardHeight = <<calculated keyboard height as previously discussed>>;
CGFloat textBoxHeight = _yourTextBox.frame.size.height;
// Change the current frame of your textbox in order to reposition it
CGFrame textBoxFrame = _yourTextBox.frame;
textBoxFrame.origin.y = screenHeight - keyboardHeight - textBoxHeight;
_yourTextBox.frame = textBoxFrame;
Note: If you are using AutoLayout constraints to position your subviews you will need to avoid modifying the frame and change your constraints instead. Post if you are having problems in this area because it can get tricky.
Related
I have a screen within an iPhone app that consist of a UITextView. This text view is contained within a UIScrollView. The purpose of the screen is for the user to type in text, and to optionally attach an image to what he is writing. Therefore, the screen also has a UIToolbar with a camera button at the bottom of the screen. The structure of the screen is as follows:
-View
--UIScrollView
---UITextView
--UIToolbar
---UIButton
When the user navigates to this screen, the viewDidAppear method assigns first responder to the uitextview element, so the keyboard shows up, which hides the toolbar and the camera button.
I would like the entire toolbar to re-draw itself right above the keyboard, and to position itself again at the bottom of the screen when the keyboard hides.
I have found related posts on SO (like this one). However, such methods introduce undesired behaviours. For example, implementing the solution in the article above, the toolbar does move with the keyboard, but the UIScrollView gets its frame.origin.y coordinate shifted way above the top of the screen, so it's impossible for the user to see what he is typing.
I have also tried to reset the frame of the toolbar, by adding it as an IBOutlet and using cgrectmake to reposition it. However, after several tries, the toolbar remains stuck at the bottom of the screen and hidden by the keyboard:
- (void) liftMainViewWhenKeybordAppears:(NSNotification*)aNotification{
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDelegate:self];
[UIView setAnimationDuration:0.3];
[UIView setAnimationCurve:<#(UIViewAnimationCurve)#>]
CGRect frame = self.keyboardToolbar.frame;
frame.origin.y = self.keyboardToolbar.frame.origin.y - 280;
self.keyboardToolbar.frame = frame;
[UIView commitAnimations];
}
I have tried several iterations similar to the code above and they all fail at repositioning the toolbar.
So in short, what is the right way to float a toolbar right on top of a keyboard in a screen whose space is completely utilised by a uitextview element?
Thanks to RoryMcKinnel for the pointer. As the article referenced is in Swift, I thought I might paste the solution that worked for be on ObjC
- (void)keyboardWillShowNotification:(NSNotification *)notification{
NSDictionary *userInfo = notification.userInfo;
double animationDuration = [userInfo[UIKeyboardAnimationDurationUserInfoKey] doubleValue];
CGRect keyboardEndFrame = [userInfo[UIKeyboardFrameEndUserInfoKey] CGRectValue];
CGRect convertedKeyboardFrame = [self.view convertRect:keyboardEndFrame fromView:self.view.window];
UIViewAnimationOptions rawAnimationCurve = (UIViewAnimationOptions)[userInfo[UIKeyboardAnimationCurveUserInfoKey] unsignedIntegerValue] << 16;
_toolBarBottomGuide.constant = CGRectGetMaxY(self.view.bounds) - CGRectGetMinY(convertedKeyboardFrame);
[UIView animateWithDuration:animationDuration delay:0.0 options:rawAnimationCurve animations:^{
[self.view layoutIfNeeded];
} completion:nil];
}
Bear in mind, this code did make the toolbar move as required, but the toolbar was not visible at all. It turned out that it was being hidden behind the UIScrollView. This was easily fixed by shifting the order between the scroll view and the toolbar element in the IB hierarchy.
The method above works for the keyboardWillShow event. You'll need to add the corresponding one for when the keyboard hides, like this:
- (void)keyboardWillHideNotification:(NSNotification *)notification{
NSDictionary *userInfo = notification.userInfo;
double animationDuration = [userInfo[UIKeyboardAnimationDurationUserInfoKey] doubleValue];
CGRect keyboardEndFrame = [userInfo[UIKeyboardFrameEndUserInfoKey] CGRectValue];
UIViewAnimationOptions rawAnimationCurve = (UIViewAnimationOptions)[userInfo[UIKeyboardAnimationCurveUserInfoKey] unsignedIntegerValue] << 16;
_toolBarBottomGuide.constant = 0.0f;
[UIView animateWithDuration:animationDuration delay:0.0 options:rawAnimationCurve animations:^{
[self.view layoutIfNeeded];
} completion:nil];
}
In my app I've this login screen:
Above the first test field I've an image, the configuration in Interface Builder is the follow:
Now when I tap on the UITextField they should move up otherwise in iPhone 4/4s the field will be covered by keyboard.
Now I'm using the following code:
-(void)textFieldDidBeginEditing:(UITextField *)textField {
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.35f];
CGRect frameView = self.view.frame;
CGRect frameImage = self.imageViewLogo.frame;
CGRect frameTextFieldUsername = self.textFieldUsername.frame;
CGRect frameTextFieldPassword = self.textFieldPassword.frame;
CGRect frameButtonLogin = self.buttonLogin.frame;
frameView.origin.y = -100;
frameImage.origin.y = -100;
frameTextFieldUsername.origin.y = -100;
frameTextFieldPassword.origin.y = -100;
frameButtonLogin.origin.y = -100;
[self.view setFrame:frameView];
[self.imageViewLogo setFrame:frameImage];
[self.textFieldUsername setFrame:frameTextFieldUsername];
[self.textFieldPassword setFrame:frameTextFieldPassword];
[self.buttonLogin setFrame:frameButtonLogin];
[UIView commitAnimations];
}
When I try to run the app in simulator or on a real device the view scrolls up of 100 but the image, the text fields and button doesn't scrolls up... I thought that the problem depend on the constraints, can you help me to fix this issue?
Thank you
The way in which you are trying to do this will get you in trouble. As you are giving hardcoded values of frame.
Try to use keyboard avoiding library it's the better and safer way of doing it.
-(void)textFieldDidBeginEditing:(UITextField *)textField {
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.35f];
CGRect frameView = self.view.frame;
CGRect frameImage = self.imageViewLogo.frame;
CGRect frameTextFieldUsername = self.textFieldUsername.frame;
CGRect frameTextFieldPassword = self.textFieldPassword.frame;
CGRect frameButtonLogin = self.buttonLogin.frame;
frameView.origin.y = -100;
// no need of changing frames of TextFields inside the View, Just change the y-padding of View
[self.view setFrame:frameView];
[UIView commitAnimations];
}
reduce the y-padding to -120 and check
Hope this helps thanks
If your views are set up to use AutoLayout, changing frame will do nothing.
You should subscribe to UIKeyboardWillChangeFrameNotification and perform your changes there. In case of constraints you would update the constrains constants here and the call -setNeedsUpdateConstraints on the superview.
You have to figure out if the keyboards is appearing or disappearing at all if you want to support external keyboard.
Otherwise you can listen for UIKeyboardWillShowNotification and UIKeyboardWillHideNotification
For auto up the textFields while keyboard comes not need to use the thirdParty Classes.
Create a static tableView and design each textFields and button in each static cells.
TableView automatically handle the auto up textFields while keyboard comes.
Hi the simple and easy trick for doing it is :-
Take outlet of top constraint of username or email id textfield in your class and on textfield did begin editing delegate decrease the constraint's constant value so it will goes up when u select the textfield and at textField did end editing delegate again set constraint's constant value to previous one so it will reset on previous position.
eg:-Assuming you set Top Constraint value in Storyboard is 150
-(void)textFieldDidBeginEditing:(UITextField *)textField {
_topConstraint.constant = 10.00;
[UIView animateWithDuration:0.5f animations:^{
[self.view layoutIfNeeded];
}];
}
-(void)textFieldDidEndEditing:(UITextField *)textField {
_topConstraint.constant = 150.00;
[UIView animateWithDuration:0.5f animations:^{
[self.view layoutIfNeeded];
}];
}
Hope it will help you.
I followed the instructions here to adjust my view with the iOS keyboard.
https://developer.apple.com/library/ios/documentation/StringsTextFonts/Conceptual/TextAndWebiPhoneOS/KeyboardManagement/KeyboardManagement.html
This doesn't work with a hardware keyboard. When a text view is active the iOS keyboard is not shown but the example code still returns the full height of the keyboard. In my case just the input accessory view is shown on the screen.
How do I detect this case and adjust my view for only the input accessory view?
You can intersect the keyboard's frame with the current window as in my answer here https://stackoverflow.com/a/36553555/1049134.
Came across the same issue.
Looks like the iOS keyboard is completely instantiated and just moved out of the view partial when a hardware keyboard is attached. Therefore the size of the keyboard is right. It is just not completely shown.
After examining the notifications I solved it with calculating the visible keyboard height myself.
In my example I am listening to UIKeyboardWillShowNotification, UIKeyboardWillChangeFrameNotification and UIKeyboardWillHideNotification.
-(void)keyboardMessage:(NSNotification*)notification {
NSDictionary *userInfo = notification.userInfo;
CGFloat duration = [userInfo[#"UIKeyboardAnimationDurationUserInfoKey"] floatValue];
NSValue *value = userInfo[#"UIKeyboardFrameEndUserInfoKey"];
CGRect frame = [value CGRectValue];
[UIView animateWithDuration:duration animations:^{
self.lowerContraint.constant = self.view.frame.size.height - frame.origin.y;;
[self.view needsUpdateConstraints];
[self.view layoutIfNeeded];
}];
}
I am using following code to animate view's position according to keyboard movement. The code works fine under iOS 7, however it causes strange behaviour under iOS 8:
[[NSNotificationCenter defaultCenter] addObserver:self selector:#selector(keyboardWillShow:) name:UIKeyboardWillShowNotification object:nil];
- (void) keyboardWillShow:(NSNotification*) aNotification {
NSDictionary* keyboardInfo = [aNotification userInfo];
NSTimeInterval time = [keyboardInfo[UIKeyboardAnimationDurationUserInfoKey] doubleValue];
UIViewAnimationCurve curve = [keyboardInfo[UIKeyboardAnimationCurveUserInfoKey] intValue];
CGRect keyboardFrameEnd = [[keyboardInfo valueForKey:UIKeyboardFrameEndUserInfoKey] CGRectValue];
double offset = keyboardFrameEnd.size.width > keyboardFrameEnd.size.height ? keyboardFrameEnd.size.height : keyboardFrameEnd.size.width;
[UIView beginAnimations:#"moveWindow" context:nil];
[UIView setAnimationBeginsFromCurrentState:YES];
[UIView setAnimationCurve:curve];
[UIView setAnimationDuration:time];
self.frame = CGRectMake(self.frame.origin.x, self.frame.origin.y + offset, self.frame.size.width, self.frame.size.height);
[UIView commitAnimations];
}
Unfortunately, the answers mentioned in Is there a change to the behaviour of UIKeyboardWillShowNotification in iOS 8? and iOS8: What's going on with moving views during keyboard transitions? are out of the question:
The source code base is very large and old and use neither storyboard nor Auto Layout features.
I don't want to use UIKeyboardDidShowNotification event because the keyboard is already visible and the animation looks terrible (however, the problem is gone when using this type of notification).
Oddly enough, I found out that the problem is gone when the feature is used in the very first screen of the application. Further tests showed that removing MKMapView from one of the previous screens solves this issue. I triple checked that MKMapView is used and disposed correctly. Every allocated instance is gone way before the above code is executed.
After hours of testing and debugging I noticed in a visual hierarchy debugger (How do I inspect the view hierarchy in iOS?) that there are constraints added under UILayoutContainerView and UINavigationTransitionView. These constraints are not present when the MKMapView control is removed from the previous screen. I tried playing with every possible combination of setTranslatesAutoresizingMaskIntoConstraints: setup and could not find any resolution yet. Is it some sort of bug in iOS 8 itself or is there another way to animate view along with the keyboard?
I'm not sure about the code itself but from the documentation about those animation methods...
Use of this method is discouraged in iOS 4.0 and later. You should use the block-based animation methods to specify your animations instead.
The correct way to animate you view is...
[UIView animateWithDuration:time
delay:0
options:UIViewAnimationOptionBeginFromCurrentState
animations:^{
self.frame = CGRectMake(self.frame.origin.x, self.frame.origin.y + offset, self.frame.size.width, self.frame.size.height);
}
completion:nil];
Edit
OK, it's not AutoLayout (I think) but I'll leave this here anyway as you need to change it and I'll wait for more information in the question.
How do I go about creating a custom keyboard/keypad that will show up when some one taps on a UITextField? I would like to display a keypad with a, b, c, 1, 2, 3 and an enter button, nothing else. The keypad should work and behave like the standard keyboard does (in behavior) but it will definitely look different.
I can't find any example and the best I've found is to filter characters with existing keyboard which is an unacceptable solution.
I think you're looking for the "Text, Web, and Editing Programming Guide for iOS"
The UIKit framework includes support for custom input views and input accessory views. Your application can substitute its own input view for the system keyboard when users edit text or other forms of data in a view. For example, an application could use a custom input view to enter characters from a runic alphabet. You may also attach an input accessory view to the system keyboard or to a custom input view; this accessory view runs along the top of the main input view and can contain, for example, controls that affect the text in some way or labels that display some information about the text.
To get this feature if your application is using UITextView and UITextField objects for text editing, simply assign custom views to the inputView and inputAccessoryView properties. Those custom views are shown when the text object becomes first responder...
This might serve as a good introduction: customizing the iOS keyboard
You can use Custom-iOS-Keyboards library on Github.
First of all create a view (I did it in a separate nib file and loaded it this way):
NSArray *views = [[NSBundle mainBundle] loadNibNamed:#"ReducedNumericKeyboardView"
owner:self
options:nil];
keyBView = (ReducedNumericKeyboardView*)[views objectAtIndex:0];
After it, I set it as input view for the text field where i want to use it (and actually, this is the short answer to your question ;) ):
[self.propertyEditor setInputView:keyBView];
When clicking into the field i do scroll the view pup (if necessary) to not cover the field:
CGRect textFieldRect = [self.tableViewController.view.window convertRect:propertyEditor.bounds fromView:propertyEditor];
CGRect viewRect = [self.tableViewController.view.window convertRect:self.tableViewController.view.bounds fromView:self.tableViewController.view];
CGFloat midLine = textFieldRect.origin.y+.5*textFieldRect.size.height;
CGFloat numerator = midLine - viewRect.origin.y - MINIMUM_SCROLL_FRACTION*viewRect.size.height;
CGFloat denominator = (MAXIMUM_SCROLL_FRACTION - MINIMUM_SCROLL_FRACTION)*viewRect.size.height;
CGFloat heightFraction = MIN(1, MAX(0, numerator/denominator));
animateDistance = floor(PORTRAIT_USER_INPUT_VIEW_HEIGHT*heightFraction);
CGRect viewFrame = self.tableViewController.view.frame;
viewFrame.origin.y -= animateDistance;
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationBeginsFromCurrentState:YES];
[UIView setAnimationDuration:USER_INPUT_ANIMATION_DURATION];
[self.tableViewController.view setFrame:viewFrame];
[UIView commitAnimations];
When editing is finished, I do scroll the view down:
CGRect viewFrame = self.tableViewController.view.frame;
viewFrame.origin.y += animateDistance;
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationBeginsFromCurrentState:YES];
[UIView setAnimationDuration:USER_INPUT_ANIMATION_DURATION];
[self.tableViewController.view setFrame:viewFrame];
[UIView commitAnimations];
The constraints I use are set as follows:
static const CGFloat USER_INPUT_ANIMATION_DURATION = 0.3;
static const CGFloat PORTRAIT_USER_INPUT_VIEW_HEIGHT = 180;
static const CGFloat MINIMUM_SCROLL_FRACTION = 0.1;
static const CGFloat MAXIMUM_SCROLL_FRACTION = 0.2;
You want to set the value for
inputView
on your UITextField. You will need to fully implement a new keyboard or input mechanism in the view you provide.
Alternately,
inputAccessoryView
can be used to add a small amount of functionality. The view will be placed above the system keyboard and will arrive and be dismissed with it.
Unfortunately, the "Text, Web, and Editing Programming Guide for iOS" referenced above doesn't give any information on what to do with the character once you press a key. This is by far the hard part when implementing a keyboard in iOS.
I have created a full working example of a hex numberpad which can easily be customized with like you need.
Specific details are at my other answer on this subject: https://stackoverflow.com/a/13351686/937822