Swift KeyBoard 鍵盤小事情(V1.2)

keyboard看似沒什麼特別的元件,但是總是帶來許多不便。

圖片來源:https://www.idownloadblog.com/2019/04/15/haptickeys/
奇妙仙子沒有走丟,只是很Q,看一下

。return鍵,收鍵盤

1.先注意,在設計textField鍵盤時,是否有將鍵盤鈕設定為default(return鍵)

這樣會比較符合以下預計操作

Main.Storyboard
Default值

2. 我們要透過內建的delegate,來控制這件事情,

所以我們要將textField與controller連線

如果10個textField都想做這件事情,10個都要連線

3. 並遵從UITextFieldDelegate去實現

4.透過textFieldShouldReturn(_:),讓點擊return鍵,觸發事件(兩種寫法)

— 讓畫面觸發endEditing方法

func textFieldShouldReturn(_ textField: UITextField) -> Bool {   self.view.endEditing(true)   return true}

— 讓該textField離開響應

func textFieldShouldReturn(_ textField: UITextField) -> Bool {    textField.resignFirstResponder() //要求離開我們的Responder    return true}

— Demo畫面:

。點畫面任意位置,收鍵盤

  1. 透過內建func touchesBegan(_:with:) ,

當偵測開始點擊時,去觸發事件

使用endEditing方法

//當點擊view任何喔一處鍵盤收起override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {    self.view.endEditing(true)}

— Demo畫面:

此方法比較不建議textfield放在tableview時,很容勿誤判成點擊cell

。點擊Next時,可以自動換下個textField

  1. 透過textFieldShouldReturn(_:),讓點擊Next鍵,觸發事件

— 方法一:先判斷傳入的textField是哪位,再決定下一個響應者是哪位。

@IBOutlet weak var accountTextField: UITextField!@IBOutlet weak var passwordTextField: UITextField!

func textFieldShouldReturn(_ textField: UITextField) -> Bool {
if textField == accountTextField { passwordTextField.becomeFirstResponder() }else { textField.endEditing(true) } return true}

— 方法二:

給予每個textField不同的tag標記,當進入此func時,

去尋找SuperView同層的tag,下一個tag者成為下一個響應者

(如果同時有其他類型元件具有一樣的tag值,不會因為一樣的tag而觸發其他類型元件)

func textFieldShouldReturn(_ textField: UITextField) -> Bool {  let nextTag = textField.tag+1  if let nextResponder = textField.superview?.viewWithTag(nextTag) {     nextResponder.becomeFirstResponder()  } else {    textField.resignFirstResponder()  }  return true}

— Demo畫面

On my GitHub

。鍵盤上的小幫手

  1. 先~生成上方toolbar,寬:為view寬,高:個人喜好
  2. 若未加上空白處,按鈕會被放在左邊,故需要生成flexibleSpace補白,其事件皆為nil
  3. 在生成想製作得按鈕用途,在此為收回鍵盤,觸發func doneButtonAction()
  4. 將以上兩種元件加入toolBar 中,並sizeToFit(),讓加入的元件可以fit

sizeToFit()官方文件

if you want a given view to size itself to its parent view, you should add it to the parent view before calling this method.

5. 想運用的textField欄位皆需inputAccessoryView = toolBar

var toolBarHeight:CGFloat = 30//製作鍵盤上方幫手
let toolBar = UIToolbar(frame: CGRect(x: 0, y: 0, width: self.view.frame.width, height: toolBarHeight))
//左邊空白處
let flexSpace: UIBarButtonItem = UIBarButtonItem(barButtonSystemItem: .flexibleSpace, target: nil, action: nil)
//想製作的按鈕及用途
let doneBotton: UIBarButtonItem = UIBarButtonItem(title: “完成”, style: .done, target: self, action: #selector(doneButtonAction))
toolBar.setItems([flexSpace,doneBotton], animated: false)toolBar.sizeToFit()accountTextField.inputAccessoryView = toolBar
@objc func doneButtonAction() {  self.view.endEditing(true)}
//小幫手的字體、顏色
doneBotton.setTitleTextAttributes([
NSAttributedStringKey.font: UIFont(name: "Helvetica-Bold", size: 26.0)!,NSAttributedStringKey.foregroundColor: UIColor.green],for: .normal)NSAttributedStringKey.font: UIFont(name: "Helvetica-Bold", size: 26.0)!,NSAttributedStringKey.foregroundColor: UIColor.green],for: .highlighted)

__________________________________________________________

。鍵盤推推的事

鍵盤出來時,textField再怎麼樣的位置,才是最佳的呢?

當然是置中,這個部分我日後再補上,先休眠了~

--

--

奇妙仙子
彼得潘的 Swift iOS / Flutter App 開發教室

When you want something, all the universe conspires in helping you to achieve it.