/* syntax highlight */ /* end of syntax highlight */

2010年12月21日 星期二

iphone app 開發 (二十九) 實做 textInput 與鍵盤

Bookmark and Share

image

本範例將會告訴你如何實作螢幕小鍵盤的相關功能

包含了「輸入完成後關閉小鍵盤」與「碰觸背景關閉小鍵盤」

 

第一步驟請先宣告物件

畫面當中我們共用到 2 個 label 與 2 個 textInput ,但是 label 其實沒有任何互動在裡面,所以不需要宣告,故我們只需要宣告 2 個 textInput

我們同時有用到兩個方法,分別是「輸入完成後關閉小鍵盤」與「碰觸背景關閉小鍵盤」,分別命名為 textFieldDoneEditing , hideBackgroud 。所以我們的 header 檔將會長這樣

 

#import <UIKit/UIKit.h>   @interface interfaceViewController : UIViewController {
UITextField *nameField;
UITextField *numberField;
UILabel *sliderLabel;
}  
 
@property (nonatomic, retain) IBOutlet UITextField *nameField;
@property (nonatomic, retain) IBOutlet UITextField *numberField;
@property (nonatomic, retain) IBOutlet UILabel *sliderLabel;
   
-(IBAction)textFieldDoneEditing:(id)sender;
-(IBAction)hideBackgroud:(id)sender;
-(IBAction)sliderChanged:(id)sender;  
 
@end  

 


程式中我們宣告了 2 個 TextField, 分別紀錄 name 與 password


這個範例只有介面, 並不包括真正的登入驗證


再來宣告兩個方法


 


第二步驟:實作邏輯


在 .m 檔實作當中將要記得 synthesize 各個 textField


再來要實作前面宣告的 2 個方法, 靠的是送出訊息給 FirstResponder (指螢幕小鍵盤)


最後也一樣要記得釋放記憶體


 

#import "interfaceViewController.h"    @implementation interfaceViewController 
@synthesize nameField;
@synthesize numberField;   -(IBAction)textFieldDoneEditing:(id)sender{ //入完後按 done 會關閉螢幕鍵盤
    [sender resignFirstResponder]; 
}   -(IBAction)hideBackgroud:(id)sender{
[nameField resignFirstResponder]; //點選背景自動關閉螢幕小鍵盤
     [numberField resignFirstResponder]; 
}   - (void)dealloc { //釋放記憶體
    [nameField release]; 
[numberField release];
[super dealloc];
}

 


第三步驟:設計 UI


此部份我們共用到 2 個 label 與 2 個 textField


label 請直接滑鼠按 2 下改名


textField 則調整成適合的大小,也可以在 placeholder 上面輸入一開始會顯示的字


結果應該會長這樣


螢幕快照 2010-12-21 下午2.44.51


 


設定完 UI 之後,因為我們這裡有設計一個「按下背景就關掉鍵盤」的 Action ,所以我們的 View 類別必須做更改,原本應該會是 UIView ,但現在要改成 UIControl ,因為 UIControl 的子類別的控制項都可以觸發動作,所以只要更改 View 的類別,就可以讓我們的底層有觸發動作 (關掉鍵盤) 的能力。


image


 


 


第四步驟:編譯並執行


我們現在已經完成物件及 Action 的宣告與邏輯,可以試著編譯看看,編譯完成後應該試著將滑鼠移入 textField, 應該會自動跳出螢幕小鍵盤,隨便打幾個字後可以按 “return” 如果正常的話應該會關掉小鍵盤,第二種測試則是在輸入的時候按看看背景區塊,應該也會關掉鍵盤。






image

0 意見:

張貼留言

Related Posts Plugin for WordPress, Blogger...