我們會設計實現壹個簡單的輸入法，可以輸入 點 和 劃，改變了鍵盤結構，刪除字符然後隱藏自己。這個範例通過代碼來生成的用戶界面。當然，我們同樣也可以使用Nib文件來生成界面-這個會在教程的末尾涉及。加載Nib文件會對性能有負面影響。
創建壹個工程
打開Xcode6 ，創建壹個“Single Page Application”，然後選擇Swift為編程語言。
添加壹個文本區域
打開Main.storyboard然後拖拽壹個文本區域從組件庫裏。我們會使用這個來測試我們設計的鍵盤。
將這個文本區域居中，然後添加必要的contraints。
Hint: 如果妳調用 textField.becomeFirstResponder()在viewDidLoad ，這個鍵盤會自動在應用打開時彈出。
添加這個鍵盤擴展
從導航器中選擇這個項目文件，然後通過按+按鈕添加壹個新的target。
選擇Application Extension然後使用Custom Keyboard模板，命名它為MorseCodeKeyboard。
這會創建壹個名為 MorseCodeKeyboard 新文件夾，包括2個文件 KeyboardViewController.swift 和 Info.Plist。
接下來
打開 KeyboardViewController.swift，為了在不同的鍵盤之間進行切換，這個鍵盤模板文件會有壹個按鈕。在 viewDidLoad 方法中放入壹個新的方法，命名為 addNextKeyboardButton。
func addNextKeyboardButton() { self.nextKeyboardButton = UIButton.buttonWithType(.System) as UIButton ?... ?var nextKeyboardButtonBottomConstraint = NSLayoutConstraint(item: self.nextKeyboardButton, attribute: .Bottom, relatedBy: .Equal, toItem: self.view, attribute: .Bottom, multiplier: 1.0, constant: -10.0) self.view.addConstraints([nextKeyboardButtonLeftSideConstraint, nextKeyboardButtonBottomConstraint]) }
為了更好的梳理代碼的結構，創建壹個新的方法名為addKeyboardButtons，然後在 viewDidLoad 中調用它。雖然這裏只有幾個按鈕，但是在真實項目中，將會有更多的按鈕。在 addKeyboardButtons 中調用 addNextKeyboardButton。
class KeyboardViewController: UIInputViewController { ?... ?override func viewDidLoad() { super.viewDidLoad() ?addKeyboardButtons() } ?func addKeyboardButtons() { addNextKeyboardButton() } ?... ?}
點
現在我們來添加點按鈕，創建壹個UIButton!類型的dotButton屬性。
class KeyboardViewController: UIInputViewController { ?var nextKeyboardButton: UIButton! var dotButton: UIButton! ?... }
增加壹個名為 addDot 的方法。使用系統按鈕來初始化名為 dotButton 的屬性。增加壹個 TouchUpInside 事件回調函數。設置壹個大字體然後增加圓角，同時增加約束來限制它距離水平中心50個points，垂直居中。這個代碼應該和下面nextKeyboardButton部分類似。
func addDot() { // initialize the button dotButton = UIButton.buttonWithType(.System) as UIButton dotButton.setTitle(".", forState: .Normal) dotButton.sizeToFit() dotButton.setTranslatesAutoresizingMaskIntoConstraints(false) ?// adding a callback dotButton.addTarget(self, action: "didTapDot", forControlEvents: .TouchUpInside) ?// make the font bigger dotButton.titleLabel.font = UIFont.systemFontOfSize(32) ?// add rounded corners dotButton.backgroundColor = UIColor(white: 0.9, alpha: 1) dotButton.layer.cornerRadius = 5 ?view.addSubview(dotButton) ?// makes the vertical centers equa; var dotCenterYConstraint = NSLayoutConstraint(item: dotButton, attribute: .CenterY, relatedBy: .Equal, toItem: view, attribute: .CenterY, multiplier: 1.0, constant: 0) ?// set the button 50 points to the left (-) of the horizontal center var dotCenterXConstraint = NSLayoutConstraint(item: dotButton, attribute: .CenterX, relatedBy: .Equal, toItem: view, attribute: .CenterX, multiplier: 1.0, constant: -50) ?view.addConstraints([dotCenterXConstraint, dotCenterYConstraint]) }
接下來對於dash，delete 和 hideKeyboard，這個過程都比較類似。這個deleteButton會從proxy使用deleteBackward方法，然後hideKeyboardButton會通過KeyboardViewController使用dismissKeyboard方法。
劃
與dash相關的代碼幾乎和dotButton代碼壹致。為了將dashButton按鈕在水平方向與 點 按鈕對稱，只要將水平約束中的常量改變壹下符號即可。
func addDash() { ... ?// set the button 50 points to the left (-) of the horizontal center var dotCenterXConstraint = NSLayoutConstraint(item: dotButton, attribute: .CenterX, relatedBy: .Equal, toItem: view, attribute: .CenterX, multiplier: 1.0, constant: -50) ?view.addConstraints([dashCenterXConstraint, dashCenterYConstraint])
回刪
當被按下時，這個刪除按鈕會通過textDocumentProxy，使用deleteBackword刪除字符。這個布局約束會和nextKeyboardButton對稱(.Left -> .Right, .Bottom->.Top)
func addDelete() { deleteButton = UIButton.buttonWithType(.System) as UIButton deleteButton.setTitle(" Delete ", forState: .Normal) deleteButton.sizeToFit() deleteButton.setTranslatesAutoresizingMaskIntoConstraints(false) deleteButton.addTarget(self, action: "didTapDelete", forControlEvents: .TouchUpInside) ?deleteButton.backgroundColor = UIColor(white: 0.9, alpha: 1) deleteButton.layer.cornerRadius = 5 ?view.addSubview(deleteButton) ?var rightSideConstraint = NSLayoutConstraint(item: deleteButton, attribute: .Right, relatedBy: .Equal, toItem: view, attribute: .Right, multiplier: 1.0, constant: -10.0) ?var topConstraint = NSLayoutConstraint(item: deleteButton, attribute: .Top, relatedBy: .Equal, toItem: view, attribute: .Top, multiplier: 1.0, constant: +10.0) ?view.addConstraints([rightSideConstraint, topConstraint])
隱藏鍵盤
當被按下時，這個hideKeyboardButton會在KeyboardViewController上調用dismissKeyboard。
func addHideKeyboardButton() { hideKeyboardButton = UIButton.buttonWithType(.System) as UIButton ?hideKeyboardButton.setTitle("Hide Keyboard", forState: .Normal) hideKeyboardButton.sizeToFit() hideKeyboardButton.setTranslatesAutoresizingMaskIntoConstraints(false) ?hideKeyboardButton.addTarget(self, action: "dismissKeyboard", forControlEvents: .TouchUpInside) ?view.addSubview(hideKeyboardButton) ?var rightSideConstraint = NSLayoutConstraint(item: hideKeyboardButton, attribute: .Right, relatedBy: .Equal, toItem: view, attribute: .Right, multiplier: 1.0, constant: -10.0) ?var bottomConstraint = NSLayoutConstraint(item: hideKeyboardButton, attribute: .Bottom, relatedBy: .Equal, toItem: view, attribute: .Bottom, multiplier: 1.0, constant: -10.0) ?view.addConstraints([rightSideConstraint, bottomConstraint]) }
使用Nib文件
如果寫約束並非妳擅長的方式，妳可以創建壹個界面文件，然後將它添加到妳的inputView。
創建壹個界面文件
右擊MorseCodeKeyboard文件組，然後選擇創建新文件。
選擇User Interface，然後View Template，命名為CustomKeyboardInterface。