Dree
Dree

Reputation: 722

How to move view at the center of visible frame when keyboard appears?

I have a standard UIView (containing an image view, two textfield and a button) embedded in a root scroll view. I'm using AutoLayout to put the UIView at the center of the scroll view, like is shown in the screenshot below.

Login Screenshot

I am trying to write a method that moves up the UIView when the keyboard appears, so that this view will appear at the center of the smaller visible frame. To achieve this, I calculated some heights.

- (void)keyboardWillShow:(NSNotification *)notification {
    // Determines the size of the keyboard frame
    CGSize keyboardSize = [[[notification userInfo] objectForKey:UIKeyboardFrameBeginUserInfoKey] CGRectValue].size;

    [UIView animateWithDuration:0.3 animations:^{
        // Gets the root 'UIView' frame and stores it in a variable
        CGRect viewFrame = self.itemsView.frame;
        // This is the height of the visible frame once the keyboard appears
        double visibleFrameHeight = (self.view.frame.size.height - keyboardSize.height);
        // How much the 'UIView' should move up
        double offset = ((visibleFrameHeight - viewFrame.size.height / 2);
        // Moves up the 'UIView'
        viewFrame.origin.y = -offset;
        self.itemsView.frame = viewFrame;
    }];
}

The problem is that the UIView is moved too up, like shown below.

Login Screenshot with keyboard on screen

Why is this happening and how can I fix it?

Upvotes: 0

Views: 1351

Answers (3)

Vrasidas
Vrasidas

Reputation: 2085

I would suggest using https://github.com/hackiftekhar/IQKeyboardManager, it's easy to use and works throughout your app (no need to calculate keyboard heights manually ever again)

Upvotes: 0

John Martin
John Martin

Reputation: 1502

If your view is already embedded in a UIScrollView then you can just adjust the scrollview's contentOffset to move the view (then you get the animation for free).

Assuming the scrollview is available on an outlet called scrollView, and that you want to keep the view centered, you could just shift the content offset by 1/2 the keyboard height. Also - probably safer to use the UIKeyboardFrameEndUserInfoKey to get the final frame of the keyboard:

- (void)keyboardWillShow:(NSNotification *)notification {
    // Determines the size of the keyboard frame
    CGSize keyboardSize = [[[notification userInfo] objectForKey:UIKeyboardFrameEndUserInfoKey] CGRectValue].size;
    self.scrollView.contentOffset = CGPointMake(0, keyboardSize.height / 2);
}

- (void)keyboardWillHide:(NSNotification *)notification {
    self.scrollView.contentOffset = CGPointZero;
}

Upvotes: 2

Sandy Patel
Sandy Patel

Reputation: 768

you have to set one IBOutlet for UIScrollView in .h file like this: IBOutlet UIScrollView *scrLogin;

then after in Your xib file set delegate for UIScrollview and all UiTextfield.

then after set this code in your .m file

You have set all design like UIimageview, UItextfield, & UIButton & every thing in UIScrollView.

- (void)viewDidLoad {
          [scrLogin setContentSize:CGSizeMake(320, 790)];
          [scrLogin setContentOffset:CGPointMake(0, 0) animated:YES];
    }
 #pragma mark - Textfield Delegate
 - (BOOL)textFieldShouldReturn:(UITextField *)textField {
                if (textField==txtUserName) {
                    [txtUserName resignFirstResponder];
                    [txtPsw becomeFirstResponder];
                }else{
                    [txtPsw resignFirstResponder];
                    [scrLogin setContentOffset:CGPointMake(0, -60) animated:NO];
                    //[self btnLoginTapped:self];
                }
                return YES;
            }
- (void)textFieldDidBeginEditing:(UITextField *)textField{
  if(textField==txtUserName){
        if (IS_IPHONE_4s) {
           [scrLogin setContentOffset:CGPointMake(0, 20) animated:true];
        }else{
           [scrLogin setContentOffset:CGPointMake(0, 0) animated:true];
        }
 }else if(textField==txtPsw){
    [scrLogin setContentOffset:CGPointMake(0, 40) animated:true];
 }

}

I hope it's help you. if you have any problem then tell me.

Upvotes: 0

Related Questions