在keyboard上面增加toolbar提供便捷操作－保持keyboard

 

在keyboard上面增加toolbar提供便捷操作－保持keyboard

分类： iOS 2012-04-20 09:45  305人阅读  评论(0)  收藏  举报

keyboard uiview object iphone 工具 flex

Building an iPhone keyboard toolbar

有各种理由让你想做到把UIToolbar 悬浮于 keyboard ：比如你希望键盘的return是用作换行，而需要另外一个iaaction来触发dismiss keyboard；当然有些时候，这个键未必要出现在keyboard上方，很可能程序就为你提供了，例如在邮件编辑程序中按下上角的send按钮 ，keyboard就消失了

还有一个有用的地方是 聊天的程序，你希望keyboard一直在，方便快速输入：这个在iPhone Messages app就如此的 

mobile Safari app 使用带有toolbar的keyboard 用于各种功能切换 fields 以及 autofilling, 当然也有“done”来隐藏 keyboard:

虽然没有内置的选项用于添加键盘上方的 UIToolbar，但可以很容易地实现。

个人喜欢做 的方式是，把uitoolbar工具栏放在屏幕外，然后键盘上方的正确地进行动画处理。我觉得这看起来更加无缝的用户体验。所以，我将 UIToolbar 添加到视图的控制器，并放置在屏幕的底部以下。在一个正常的竖立面向的 iPhone 应用程序具有状态栏，所以Y 值将在 460。我也喜欢使工具栏部分透明 （约 0.60 的 alpha），以便用户可以看到"下方"工具栏。

视图控制器出现时，我们要响应键盘事件通知使我们可以显示工具栏出现和消失 ：

／／比较重要的代码就是：

[cpp]  view plain copy

1. [[NSNotificationCenter defaultCenter] <span style="color:#ff0000;">addObserver:self</span> selector:@selector(keyboardWillHide:) <span style="color:#ff0000;">name:UIKeyboardWillHideNotification</span> object:nil];  

[cpp]  view plain copy

1. ／／  

[cpp]  view plain copy

1. - (void)viewWillAppear:(BOOL)animated {  
2.     [super viewWillAppear:animated];  
3.    
4.     [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(keyboardWillShow:) name:UIKeyboardWillShowNotification object:nil];  
5.     [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(keyboardWillHide:) name:UIKeyboardWillHideNotification object:nil];  
6. }  
7.    
8. - (void)viewWillDisappear:(BOOL)animated {  
9.     [super viewWillDisappear:animated];  
10.    
11.     [[NSNotificationCenter defaultCenter] removeObserver:self name:UIKeyboardWillShowNotification object:nil];  
12.     [[NSNotificationCenter defaultCenter] removeObserver:self name:UIKeyboardWillHideNotification object:nil];  
13. }  

接下来就是动画出现和消失：

[cpp]  view plain copy

1. - (void)keyboardWillShow:(NSNotification *)notification {  
2.     [UIView beginAnimations:nil context:NULL];  
3.     [UIView setAnimationDuration:0.3];  
4.    
5.     CGRect frame = self.keyboardToolbar.frame;  
6.     frame.origin.y = self.view.frame.size.height - 260.0;  
7.     self.keyboardToolbar.frame = frame;  
8.    
9.     [UIView commitAnimations];  

我发现 0.3 秒相当匹配了键盘出现 所需的时间量。 IPhone 上的键盘的高度是 260 点，所以我们从视图高度减去，并于该位置工具栏添加动画效果。

[cpp]  view plain copy

1. - (void)keyboardWillHide:(NSNotification *)notification {  
2.     [UIView beginAnimations:nil context:NULL];  
3.     [UIView setAnimationDuration:0.3];  
4.    
5.     CGRect frame = self.keyboardToolbar.frame;  
6.     frame.origin.y = <span style="color:#cc0000;">self.view.frame.size.height</span>; ／／self。view。frame。。。。。  
7.     self.keyboardToolbar.frame = frame;  
8.    
9.     [UIView commitAnimations];  
10. }  

这是另外一个用法：

 

重点还是订阅 UIWindow notifications UIKeyboardWillShowNotification andUIKeyboardWillHideNotification

这些通知能告知键盘的外观、 大小、 位置和动画的详细信息。使用此信息，我们可以到正确的位置与键盘外观，设计动画同步 我们的工具栏。

[cpp]  view plain copy

1. <span style="color:#888888;">    if(nil == keyboardToolbar) {  
2.       keyboardToolbar = [[UIToolbar alloc] initWithFrame:CGRectMake(0,0,self.view.bounds.size.width,44)];  
3.       keyboardToolbar.barStyle = UIBarStyleBlackTranslucent;  
4.       keyboardToolbar.tintColor = [UIColor darkGrayColor];  
5. ／／／／／／／／  
6.       UIBarButtonItem *barButtonItem = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemDone target:self action:@selector(</span><span style="color:#ff0000;">dismissKeyboard</span><span style="color:#888888;">:)];</span>  

[cpp]  view plain copy

1. <span style="color:#888888;">／／适当的空白区域  
2.       UIBarButtonItem *flex = [[UIBarButtonItem alloc] </span><span style="color:#cc0000;">initWithBarButtonSystemItem:UIBarButtonSystemItemFlexibleSpace</span><span style="color:#888888;"> target:nil action:nil];  
3.   
4.       </span><span style="color:#ff0000;">UISegmentedControl</span><span style="color:#888888;"> *control = [[UISegmentedControl alloc] initWithItems:[NSArray arrayWithObjects:  
5.                                            NSLocalizedString(@"Previous",@"Previous form field"),  
6.                                            NSLocalizedString(@"Next",@"Next form field"),                                           
7.                                            nil]];  
8.       control.segmentedControlStyle = UISegmentedControlStyleBar;  
9.       control.tintColor = [UIColor darkGrayColor];  
10.       control.momentary = YES;  
11.       [control addTarget:self action:@selector(</span><span style="color:#ff0000;">nextPrevious</span><span style="color:#888888;">:) forControlEvents:UIControlEventValueChanged];       
12.   
13.       UIBarButtonItem *controlItem = [[UIBarButtonItem alloc] initWithCustomView:control];  
14.   
15.       self.nextPreviousControl = </span><span style="color:#ff0000;">control</span><span style="color:#888888;">;  
16.   
17.   
18.       NSArray *items = [[NSArray alloc] initWithObjects:controlItem, flex, barButtonItem, nil];  
19.       [keyboardToolbar setItems:items];  
20.       [control release];  
21.       [barButtonItem release];  
22.       [flex release];  
23.       [items release];        
24.   
25.       keyboardToolbar.frame = CGRectMake(beginCentre.x - (keyboardBounds.size.width/2),   
26.                          beginCentre.y - (keyboardBounds.size.height/2) - keyboardToolbar.frame.size.height,   
27.                          keyboardToolbar.frame.size.width,   
28.                          keyboardToolbar.frame.size.height);          
29.   
30.       [self.view addSubview:keyboardToolbar];     
31.     }     
32.   }     
33.   
34.   [UIView beginAnimations:@"RS_showKeyboardAnimation" context:nil];   
35.   [UIView setAnimationCurve:animationCurve];  
36.   [UIView setAnimationDuration:animationDuration];  
37.   
38.   keyboardToolbar.alpha = 1.0;    
39.   keyboardToolbar.frame = CGRectMake(endCentre.x - (keyboardBounds.size.width/2),   
40.                      endCentre.y - (keyboardBounds.size.height/2) - keyboardToolbar.frame.size.height - self.view.frame.origin.y,   
41.                      keyboardToolbar.frame.size.width,   
42.                      keyboardToolbar.frame.size.height);  
43.   
44.   [UIView commitAnimations];      
45. </span>  

接下来就是根据当前control，寻找下一个，然后[(UITextField *) becomeFirstResponder:]

[cpp]  view plain copy

1. //Asks the delegate if the text field should process the pressing of the return button.  
2.   
3. - (BOOL)textFieldShouldReturn:(UITextField *)textField  
4. {  
5.     if (textField == textField1) {  
6.         [textField2 becomeFirstResponder];  
7.     } else if (textField == textField2) {  
8.         [textField3 becomeFirstResponder];  
9.     } else if (textField == textField3) {  
10.         [textField1 becomeFirstResponder];  
11.     }         
12.     return NO;  
13. }  

以上是为了解决：

当文本框之间切换，编程方式或通过用户敲击，notification仍 接收到键盘隐藏/显示通知。 这里我们保持纪录，当从一个输入文本框移动到另一个的时候我们要避免无谓的toolbar的动画。

程序下载： TFTest

last hint：sample／UIToolbar-Keyboard；sample／Toolbar For keboardTest