3.UITextField與UIDatePickrController的簡單使用

廢話少說, 我們直接來主題.

PS: 已更新到Swift 2.0, 支援Xcode7, iOS9

1.搭建界面

PS: 這裡的布局無論使用代碼布局還是用自動布局都是可以的, 個人喜歡.

2.開始之前

在開始之前, 我們需要寫好假資料, 以及關聯好控件:

class ViewController: UIViewController, UIPickerViewDataSource, UIPickerViewDelegate { 
    // 1.關聯控件 
    @IBOutlet var pickerTextField: UITextField! 

    // 2.設定資料源 
    var pickOption = [["白色", "黑色", "紅色", "藍色"], ["奔馳", "大衆", "雪佛蘭", "比亞迪"]] 
}
           

3.實作代碼

1.設定UIDatePickerView的代理

override func viewDidLoad() { 
        super.viewDidLoad()
        // 3.執行個體化pickerView
        let pickerView = UIPickerView()

        // 3.1設定pickerView的代理
        pickerView.delegate = self

        // 3.2設定pickerTextField的輸入對象為pickerView
        pickerTextField.inputView = pickerView 
    }
           

2.實作UIPickerView的代理方法

// 設定UIPickerView的count 
func numberOfComponentsInPickerView(pickerView: UIPickerView) -> Int { 
    return pickOption.count 
} 

// 設定UIPickerView每一組的個數 func pickerView(pickerView: UIPickerView, numberOfRowsInComponent component: Int) -> Int { 
    return pickOption[component].count 
} 

// 設定UIPickerView的第row行的内容 func pickerView(pickerView: UIPickerView, titleForRow row: Int, forComponent component: Int) -> String? { 
    return pickOption[component][row] 
} 

// 設定UIPickerView被選中的内容 func pickerView(pickerView: UIPickerView, didSelectRow row: Int, inComponent component: Int) { 
    // 把UIPickerView第一組的内容賦給了color 
    let color = pickOption[]
    [pickerView.selectedRowInComponent()] 

    // 把UIPickerView第二組的内容賦給了color 
    let model = pickOption[]
    [pickerView.selectedRowInComponent()] 

    // 把選中的内容拼接成字元串賦給了pickerTextField 
    pickerTextField.text = color + " " + model 
}
           

3.細節優化

// 8.細節優化, 重寫單擊手勢 
override func touchesBegan(touches: Set<UITouch>, withEvent event: UIEvent?) { 
    // 8.1點一下空白的地方, 就結束編輯狀态
    self.view.endEditing(true) 
}
           

4.最終效果

好了, 這次就講到這裡, 下次我們繼續

項目工程位址: 連結: http://pan.baidu.com/s/1eQo6ZaM 密碼: 8954