天天看點

ios鍵盤通知和自定義鍵盤

一.鍵盤通知

當文本View(如UITextField,UITextView, UIWebView内的輸入框)進入編輯模式成為first responder時,系統會自動顯示鍵盤。成為firstresponder可能由使用者點選觸發,也可向文本View發送becomeFirstResponder消息觸發。當文本視圖退出first responder時,鍵盤會消失。文本View退出first responder可能由使用者點選鍵盤上的Done或Return鍵結束輸入觸發,也可向文本View發送resignFirstResponder消息觸發。

當鍵盤顯示或消失時,系統會發送相關的通知:

UIKeyboardWillShowNotification

UIKeyboardDidShowNotification

UIKeyboardWillHideNotification

UIKeyboardDidHideNotification

通知消息 NSNotification中的 userInfo字典中包含鍵盤的位置和大小資訊,對應的key為

UIKeyboardFrameBeginUserInfoKey

UIKeyboardFrameEndUserInfoKey

UIKeyboardAnimationDurationUserInfoKey

UIKeyboardAnimationCurveUserInfoKey

UIKeyboardFrameBeginUserInfoKey,UIKeyboardFrameEndUserInfoKey對應的Value是個NSValue對象,内部包含CGRect結構,分别為鍵盤起始時和終止時的位置資訊。

UIKeyboardAnimationCurveUserInfoKey對應的Value是NSNumber對象,内部為UIViewAnimationCurve類型的資料,表示鍵盤顯示或消失的動畫類型。

UIKeyboardAnimationDurationUserInfoKey對應的Value也是NSNumber對象,内部為double類型的資料,表示鍵盤h顯示或消失時動畫的持續時間。

例如,在UIKeyboardWillShowNotification,UIKeyboardDidShowNotification通知中的userInfo内容為

userInfo = {
    UIKeyboardAnimationCurveUserInfoKey = 0;
    UIKeyboardAnimationDurationUserInfoKey = "0.25";
    UIKeyboardBoundsUserInfoKey = "NSRect: {{0, 0}, {320, 216}}";
    UIKeyboardCenterBeginUserInfoKey = "NSPoint: {160, 588}";
    UIKeyboardCenterEndUserInfoKey = "NSPoint: {160, 372}";
    UIKeyboardFrameBeginUserInfoKey = "NSRect: {{0, 480}, {320, 216}}";
    UIKeyboardFrameChangedByUserInteraction = 0;
    UIKeyboardFrameEndUserInfoKey = "NSRect: {{0, 264}, {320, 216}}";
}
           

在UIKeyboardWillHideNotification,UIKeyboardDidHideNotification通知中的

userInfo内容為:

userInfo = {
    UIKeyboardAnimationCurveUserInfoKey = 0;
    UIKeyboardAnimationDurationUserInfoKey = "0.25";
    UIKeyboardBoundsUserInfoKey = "NSRect: {{0, 0}, {320, 216}}";
    UIKeyboardCenterBeginUserInfoKey = "NSPoint: {160, 372}";
    UIKeyboardCenterEndUserInfoKey = "NSPoint: {160, 588}";
    UIKeyboardFrameBeginUserInfoKey = "NSRect: {{0, 264}, {320, 216}}";
    UIKeyboardFrameChangedByUserInteraction = 0;
    UIKeyboardFrameEndUserInfoKey = "NSRect: {{0, 480}, {320, 216}}";
}
           

在Text,Web, and Editing Programming Guide for iOS中,有如下描述Note: The rectangle contained in the UIKeyboardFrameBeginUserInfoKey and UIKeyboardFrameEndUserInfoKey properties of the userInfo dictionary should be used only for the size information it contains. Do not use the origin of the rectangle (which is always {0.0, 0.0}) in rectangle-intersection operations. Because the keyboard is animated into position, the actual bounding rectangle of the keyboard changes over time.

但從實際擷取的資訊來看,矩形的origin并不為{0.0, 0.0},這裡應該不準确。

二.文本對象與WebView鍵盤設定

UITextFiled和 UITextView都遵循 UITextInputTraits協定,在UITextInputTraits協定中定義了設定鍵盤的屬性,有

1. keyboardType:鍵盤類型,如UIKeyboardTypeDefault,UIKeyboardTypeURL,UIKeyboardTypeEmailAddress,UIKeyboardTypePhonePad等

ios鍵盤通知和自定義鍵盤

2. returnKeyType:鍵盤Return鍵顯示的文本,預設為”Return”,其他可選擇的包括Go,Next,Done,Send,Google等。

3. keyboardAppearance:鍵盤外觀,預設為 UIKeyboardAppearanceDefault,即上圖中的淺蘭色不透明背景,另外還有一種為 UIKeyboardAppearanceAlert,

鍵盤背景為黑色半透明,用于在警告框輸入時顯示,例如appStore中輸入密碼時:

ios鍵盤通知和自定義鍵盤

若想顯示黑色鍵盤又不想透明露出底部視圖,可以将鍵盤配置成Alert類型的,然後監聽鍵盤顯示的廣播通知,在顯示鍵盤時在鍵盤底部增加一不透明黑色背景視圖。

注:在蘋果的鍵盤示例程式 KeyboardAccessory中,将UITextView鍵盤類型更改為UIKeyboardAppearanceAlert,在iPad模拟器中運作鍵盤并沒有出現黑色透明的效果,不知為何? 在iPhone中UIKeyboardAppearanceAlert設定有效。

4.autocapitalizationType:文本大小寫樣式,見 UITextAutocapitalizationType。

5.autocorrectionType:是否自動更正,見 UITextAutocorrectionType。

6.spellCheckingType:拼寫檢查設定,見UITextSpellCheckingType。

7. enablesReturnKeyAutomatically:是否在無文本時禁用Return鍵,預設為NO。若為YES,則使用者至少輸入一個字元後Return鍵才被激活。 

8. secureTextEntry:若輸入的是密碼,可設定此類型為YES,輸入字元時可顯示最後一個字元,其他字元顯示為點。

UIWebView本身不直接遵循 UITextInputTraits協定,但同樣可設定其内部輸入部件的鍵盤屬性。如Configuring the Keyboard for Web Views中所述。

設定autocorrect, auto-capitalization屬性。

<input type="text" size="30" autocorrect="off" autocapitalization="on">
           

設定鍵盤類型:

Text: <input type="text"></input>Telephone: <input type="tel"></input>URL: <input type="url"></input>Email: <input type="email"></input>Zip code: <input type="text" pattern="[0-9]*"></input>

           

三. 使用鍵盤通知調整文本視圖位置

當文本視圖成為First Responser時在視窗底部會顯示出鍵盤,顯示的鍵盤很可能會将文本視圖蓋住進而無法看到編輯的效果。鍵盤通知的一大用途即在鍵盤顯示或隐藏時擷取到鍵盤的位置資訊,進而可以調整視窗中的文本視圖位置或大小,使其可以在鍵盤上方顯示。

Text, Web, and Editing Programming Guide for iOS中的Moving

Content That Is Located Under the Keyboard節在鍵盤顯示和消失通知中,通過調整内容UIScrollView視圖的 contentInset和 contentOffset來保證編輯的文本視圖不會被鍵盤蓋住。

其流程為

1.在初始化( viewDidLoad或viewWillAppear)時,注冊處理鍵盤通知的方法。

- (void)registerForKeyboardNotifications
{
    [[NSNotificationCenter defaultCenter] addObserver:self
            selector:@selector(keyboardWasShown:)
            name:UIKeyboardDidShowNotification object:nil];

   [[NSNotificationCenter defaultCenter] addObserver:self
             selector:@selector(keyboardWillBeHidden:)
             name:UIKeyboardWillHideNotification object:nil];

}
           

2.在鍵盤顯示的通知事件進行中擷取到即将顯示鍵盤的大小,将 UIScrollView的contentInset設定為鍵盤的frame區域,同樣設定scrollIndicatorInsets保證滾動條不會被鍵盤蓋住。擷取到編輯文本視圖的原點位置,與鍵盤顯示區域比較,若會被鍵盤覆寫,則調整 contentOffset以使其在鍵盤上方

// Called when the UIKeyboardDidShowNotification is sent.
- (void)keyboardWasShown:(NSNotification*)aNotification
{
    NSDictionary* info = [aNotification userInfo];
    CGSize kbSize = [[info objectForKey:UIKeyboardFrameBeginUserInfoKey] CGRectValue].size;

    UIEdgeInsets contentInsets = UIEdgeInsetsMake(0.0, 0.0, kbSize.height, 0.0);
    scrollView.contentInset = contentInsets;
    scrollView.scrollIndicatorInsets = contentInsets;

    // If active text field is hidden by keyboard, scroll it so it's visible
    // Your application might not need or want this behavior.
    CGRect aRect = self.view.frame;
    aRect.size.height -= kbSize.height;
    if (!CGRectContainsPoint(aRect, activeField.frame.origin) ) {
        CGPoint scrollPoint = CGPointMake(0.0, activeField.frame.origin.y-kbSize.height);
        [scrollView setContentOffset:scrollPoint animated:YES];
    }
}
           

3.在鍵盤消失的通知處理事件中,簡單的将UIScrollView恢複即可

// Called when the UIKeyboardWillHideNotification is sent
- (void)keyboardWillBeHidden:(NSNotification*)aNotification
{
    UIEdgeInsets contentInsets = UIEdgeInsetsZero;
    scrollView.contentInset = contentInsets;
    scrollView.scrollIndicatorInsets = contentInsets;
}
           

在蘋果的 KeyboardAccessory示例程式中同樣示範了使用鍵盤通知來調整文本視圖位置的代碼,其中使用了鍵盤通知中的鍵盤動畫時間,進而使文本視圖移動的動畫與鍵盤的顯示和消失同步。

- (void)keyboardWillShow:(NSNotification *)notification {

    /*
     Reduce the size of the text view so that it's not obscured by the keyboard.
     Animate the resize so that it's in sync with the appearance of the keyboard.
     */

    NSDictionary *userInfo = [notification userInfo];

    // Get the origin of the keyboard when it's displayed.
    NSValue* aValue = [userInfo objectForKey:UIKeyboardFrameEndUserInfoKey];

    // Get the top of the keyboard as the y coordinate of its origin in self's view's coordinate system. The bottom of the text view's frame should align with the top of the keyboard's final position.
    CGRect keyboardRect = [aValue CGRectValue];
    keyboardRect = [self.view convertRect:keyboardRect fromView:nil];
    CGFloat keyboardTop = keyboardRect.origin.y;
    CGRect newTextViewFrame = self.view.bounds;
    newTextViewFrame.size.height = keyboardTop - self.view.bounds.origin.y;

    // Get the duration of the animation.
    NSValue *animationDurationValue = [userInfo objectForKey:UIKeyboardAnimationDurationUserInfoKey];
    NSTimeInterval animationDuration;
    [animationDurationValue getValue:&animationDuration];

    // Animate the resize of the text view's frame in sync with the keyboard's appearance.
    [UIView beginAnimations:nil context:NULL];
    [UIView setAnimationDuration:animationDuration];

    textView.frame = newTextViewFrame;

    [UIView commitAnimations];
}

- (void)keyboardWillHide:(NSNotification *)notification {

    NSDictionary* userInfo = [notification userInfo];

    /*
     Restore the size of the text view (fill self's view).
     Animate the resize so that it's in sync with the disappearance of the keyboard.
     */
    NSValue *animationDurationValue = [userInfo objectForKey:UIKeyboardAnimationDurationUserInfoKey];
    NSTimeInterval animationDuration;
    [animationDurationValue getValue:&animationDuration];

    [UIView beginAnimations:nil context:NULL];
    [UIView setAnimationDuration:animationDuration];

    textView.frame = self.view.bounds;

    [UIView commitAnimations];
}
           

關于調整文本視圖大小的代碼,還可以參考Different way to show keyboard and resize UIView with text field。

還可以在鍵盤通知中實作自定義鍵盤,例如UIKEYBOARDTYPENUMBERPAD AND THE MISSING “RETURN” KEY中使用鍵盤通知在數字鍵盤中增加Return鍵,還可參考UIKeyboardTypeNumberPad鍵盤增加Return鍵

注:若在同一視窗中有兩個UITextField,當第一個UITextField成為First Responser時,開始顯示鍵盤并接收到UIKeyboardWillShowNotification,UIKeyboardDidShowNotification通知,當First Responser轉移到第二個UITextField時,鍵盤會一直顯示,此時不會收到WillShow和DidShow的通知。

四.使用inputAccessoryView與inputView定制輸入視圖

inputAccessoryView和 inputView屬性在 UIResponder中定義,為readonly的屬性,但在UITextFiled和 UITextView中重新定義為了readwrite的屬性,可以由使用者指派。若 inputView的不為nil,則當文本視圖成為first responder時,不會顯示系統鍵盤,而是顯示自定義的inputView;若inputAccessoryView不

為nil,則inputAccessoryView會顯示在系統鍵盤或定制inputView的上方。當使用inputView時,仍然會有WillShow,DidShow,WillHide,DidHide的鍵盤通知,通知中的BeginFrame與EndFrame為系統鍵盤(或inputView)與inputAccessoryView一起的frame。

自定義inputAccessoryView非常常見,如編輯短信時的輸入框

ios鍵盤通知和自定義鍵盤

Web頁面輸入鍵盤

ios鍵盤通知和自定義鍵盤

新浪微網誌評論界面

ios鍵盤通知和自定義鍵盤

若想在輸入時不使用系統鍵盤,而使用自定義的鍵盤,則可以設定inputView,如随手記中的金額輸入時的鍵盤

ios鍵盤通知和自定義鍵盤

若不想使用鍵盤輸入,想從UIPickerView或UIDatePicker中選擇,可設定inputView為對應的Picker視圖,如圖

ios鍵盤通知和自定義鍵盤

蘋果鍵盤示例程式 KeyboardAccessory示範了inputAccessoryView的使用方法。

 iOS,Want a “button” above a UIPicker or Keyboard, inputView,inputAccessoryView示範了在UIPickerView之上添加Toolbar的代碼。

在标準視圖中隻有UITextField和UITextView将inputView和inputAccessoryView重新定義為了readwrite類型,若想在自定義視圖中使用,需要在自定義視圖中重新定義inputView和inputAccessoryView屬性。見Input Views and Input Accessory Views。

參考:

Text, Web, and Editing Programming Guide for iOS – Managing the Keyboard

Text,Web, and Editing Programming Guide for iOS – Input Views and Input Accessory Views

UITextView Class Reference

UITextField Class Reference

UIResponder Class Reference

UIWindow Class Reference

UITextInputTraits Protocol Reference

KeyboardAccessory Demo

Different way to show keyboard and resize UIView with text field

iOS, Want a “button” above a UIPicker or Keyboard, inputView, inputAccessoryView

UIKeyboardFrameBeginUserInfoKey UIKeyboardFrameEndUserInfoKey

UIKeyboard鍵盤相關知識點-IOS開發

Change UISearchBar/Keyboard Search Button Title

iOS Human Interface Guidelines Keyboards and Input Views

How change keyboard background color in iOS?

Favorites UI design

本文出自 清風徐來,水波不興 的部落格.

本文永久連結: http://www.winddisk.com/2012/07/19/iphone_keyboard_notification_custom_keyboard/