Adding a custom row to the keyboard

Question

I've seen some apps add a custom row to the keyboard. The row may include for example arrows, modifiers, copy and paste etc. I'd like to add one of these in my own app, but what are they really? Are they just toolbars with buttons that is hidden when the keyboard is hidden, or is there a framework/feature made especially for adding rows to the keyboard?

Answer 1

All is simple. You just need assign yours custom row view to UITextField's inputAccessoryView. The most convenient way is to use UIToolBar as inputAccessoryView.

Read Custom Views for Data Input for more details.

Answer 2

Why need a library for it?

You can create a custom view and pin its movement to the keyboard show/hide notification to make it act like part of keyboard.

Answer 3

My code:

UIToolbar* numberToolbar = [[UIToolbar alloc]initWithFrame:CGRectMake(0, 0, 320, 50)];
numberToolbar.barStyle = UIBarStyleBlackTranslucent;
numberToolbar.items = [NSArray arrayWithObjects:
                        [[UIBarButtonItem alloc]initWithTitle:@"Cancel" style:UIBarButtonItemStyleBordered target:self action:@selector(cancelNumberPad)],
                        [[UIBarButtonItem alloc]initWithBarButtonSystemItem:UIBarButtonSystemItemFlexibleSpace target:nil action:nil],
                        [[UIBarButtonItem alloc]initWithTitle:@"Apply" style:UIBarButtonItemStyleDone target:self action:@selector(doneWithNumberPad)],
                       nil];
[numberToolbar sizeToFit];
self.textField.inputAccessoryView = numberToolbar;

Answer 4

Add this when textfield begins editing:

UIButton *doneBtn = [UIButton buttonWithType:UIButtonTypeCustom];
[doneBtn setBackgroundImage:[UIImage imageNamed:@"TextViewDone.png"] forState:UIControlStateNormal];

[doneBtn addTarget:self action:@selector(closeKeyboard) forControlEvents:UIControlEventTouchUpInside];
doneBtn.frame = CGRectMake(self.view.frame.size.width-70,6,64,30);


headerBarView = [[UIView alloc]initWithFrame:CGRectMake(0,headerY,self.view.frame.size.width,40)];
headerBarView.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"TextViewBar.png"]];
[headerBarView addSubview:doneBtn];
[self.view addSubview:headerBarView];

And this when textfield ends editing:

// Action for close keyboard of header bar for UITextView *****
- (void) closeKeyboard
{
    [headerBarView removeFromSuperview];
}