How to adjust layout for UISearchBar keyboard

See previous post for how to add and hook up a search bar. Setup something like this.

Center the label.

But also give it a custom height.

We are going to calculate the value and turn that constraint ON/OFF depending on whether the keyboard is displayed or not.

Drag out the two constraints from the storyboard.

Calculate the keyboard height

Register yourself for the keyboard, calculate the height, and then set the calculated constraint value while turning the appropriate constraint on/off.

That’s it!

Code

ViewController.h

#import "ViewController.h"

@interface ViewController ()
@property (weak, nonatomic) IBOutlet UISearchBar *searchBar;
@property (weak, nonatomic) IBOutlet UILabel *label;

@property (weak, nonatomic) IBOutlet NSLayoutConstraint *labelYCustomHeightConstraint;
@property (weak, nonatomic) IBOutlet NSLayoutConstraint *labelYCenterContraint;

@end

@implementation ViewController

- (void)viewDidLoad
{
    [super viewDidLoad];
    self.searchBar.delegate = self;

    [self setupKeyboardNotification];
}

// return NO to not become first responder
- (BOOL)searchBarShouldBeginEditing:(UISearchBar *)searchBar
{
    return YES;
}

// called when text starts editing
- (void)searchBarTextDidBeginEditing:(UISearchBar *)searchBar
{
    // adjust layout for keyboard display
}

// return NO to not resign first responder
- (BOOL)searchBarShouldEndEditing:(UISearchBar *)searchBar
{
    // adjust layout for no keyboar

    return YES;
}

// called when text ends editing
- (void)searchBarTextDidEndEditing:(UISearchBar *)searchBar
{
    // turn off adjusted height
    self.labelYCustomHeightConstraint.active = NO;

    // turn on center Y
    self.labelYCenterContraint.active = YES;
}

// called when text changes (including clear)
- (void)searchBar:(UISearchBar *)searchBar textDidChange:(NSString *)searchText
{
    self.label.text = searchText;
}

// called when keyboard search button pressed
- (void)searchBarSearchButtonClicked:(UISearchBar *)searchBar
{
    self.label.text = @"searchButton clicked";
}

// called when cancel button pressed
- (void)searchBarCancelButtonClicked:(UISearchBar *)searchBar
{
    self.label.text = @"cancelButton clicked";

}

- (IBAction)onPressed:(UIButton *)sender
{
    // turn on adjusted height
    self.labelYCustomHeightConstraint.active = YES;

    // turn off center Y
    self.labelYCenterContraint.active = NO;
}

- (IBAction)offPressed:(UIButton *)sender
{
    // turn off adjusted height
    self.labelYCustomHeightConstraint.active = NO;

    // turn on center Y
    self.labelYCenterContraint.active = YES;
}

- (IBAction)dismissPressed:(UIButton *)sender
{
    [self.searchBar resignFirstResponder];
}

#pragma mark - Keyboard notification

- (void)setupKeyboardNotification
{
    [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(keyboardWillShowNotification:) name:UIKeyboardWillShowNotification object:nil];
}

- (void)keyboardWillShowNotification:(NSNotification *)notification
{
    [self updateViewConstraintsForKeyboardNotification:notification];
}

- (void)updateViewConstraintsForKeyboardNotification:(NSNotification *)notification
{
    CGFloat keyboardHeight = [self keyboardHeightForNotification:notification];
    CGFloat viewHeight = self.view.bounds.size.height;
    CGFloat midPointY = (viewHeight - keyboardHeight) / 2;

    // turn on adjusted height
    self.labelYCustomHeightConstraint.constant = midPointY;
    self.labelYCustomHeightConstraint.active = YES;

    // turn off center Y
    self.labelYCenterContraint.active = NO;
}

- (CGFloat)keyboardHeightForNotification:(NSNotification *)notification
{
    NSDictionary *userInfo = [notification userInfo];
    NSValue *keyboardFrameBegin = [userInfo valueForKey:UIKeyboardFrameBeginUserInfoKey];
    CGRect keyboardFrameBeginRect = [keyboardFrameBegin CGRectValue];
    CGFloat keyboardHeight = keyboardFrameBeginRect.size.height;
    return keyboardHeight;
}


@end

Advertisement