Question

我正在构建自定义键盘，但是找不到有关该主题的任何教程或文章。
我想做的是添加一个工具栏，如下面的屏幕快照所示。作为参考，您甚至可以使用iPhone中的建议单词工具栏。
我正在处理xib文件，如果我向其中添加工具栏，则在运行我的应用程序时它不会显示。
我发现的所有解决方案仅用于在用户在您的应用程序中使用默认键盘时对其进行编辑。我的是自定义键盘。
抱歉，如果我没有添加任何参考代码，但是由于我正在处理一个xib文件，并且我不需要任何功能性，但只需要外观，我就没有必要...

我需要工具栏总是不仅仅显示在我的应用程序之内。

Answer 1

这是解决您的问题的方法，该方法如何创建自定义UIToolBar并向其中添加自定义元素，例如UIButton等：

#Swift 5

   class ViewController: UIViewController, UITextFieldDelegate {


   // will be added later to our custom ToolBar)
   let dragButton = UIButton()

   // the toolbar will appear above a keyboard of the UITextField
   // it can be an outlet from a storyboard also
   let someTextField = UITextField()


  // here is our didLoad method)
  override func viewDidLoad() {
      super.viewDidLoad()

      someTextField.delegate = self
    
   //For exemple here we call our function what does all the toolbar setups
    setupToolBar()
    
 }

   //setup toolbar
   func setupToolBar(){

    // to add a target for our drag button
    // the target is below the setupToolBar function)
    dragButton.addTarget(self, action:#selector(dragClicked), for: .touchDown)
    dragButton.backgroundColor = .red
    dragButton.frame = CGRect(x: 0, y: 0, width: 80, height: 4)
    dragButton.contentMode = .scaleAspectFit
    dragButton.setBackgroundImage(UIImage(named: "drag"), for: .normal)
    

     // So here we do some stuff with the toolBar
    let toolBar = UIToolbar(frame: CGRect(x: 0, y: 0, width: self.view.frame.size.width, height: 100))
    toolBar.barTintColor = .clear
    toolBar.setBackgroundImage(UIImage(), forToolbarPosition: UIBarPosition.any, barMetrics: UIBarMetrics.default)
    toolBar.setShadowImage(UIImage(), forToolbarPosition: UIBarPosition.any)
    toolBar.backgroundColor = .white
    toolBar.isOpaque = false

    //The flexible space helps to arrange things inside the toolBar
    let flexibleSpace = UIBarButtonItem(barButtonSystemItem: UIBarButtonItem.SystemItem.flexibleSpace, target: nil, action: nil)

    let ourButton = UIBarButtonItem.init(customView: dragButton)

    // we added 2 flexible spaces to keep are button at the center of the toolBar
      toolBar.setItems([flexibleSpace, hideButton, flexibleSpace], animated: true)
    // and we add our toolBar with our UIButton above our someTextField keyboard)        
    someTextField.inputAccessoryView = toolBar
    }


   // Ok, here is our selector for dragButton in toolBar 

   @objc private func dragClicked(){
    
      // here we can put some code what our button should perform
        self.someTextField.endEditing(true)

      }

     }

您还可以在类下方的某个位置创建UITextField的扩展，并在那里创建自定义工具栏

Answer 2

实际上，代码非常简单。在您的视图控制器中：

//Create an IBOutlet for the text field you would like to use the extension on your storyboard
@IBOutlet weak var textField: UITextField!

override func viewDidLoad() {
    super.viewDidLoad()
    
    //Create or initiate an instance of the custom view you would like to use on top of the keyboard. 
    //The code below simply creates a green plain bar, but you can go ahead and add any buttons and other elements you need.
    let customView = UIView(frame: CGRect(x: 0, y: 0, width: 10, height: 45))
    customView.backgroundColor = UIColor.green
    
    //Set the inputAccessoryView of the text field to be equal to the customView
    textField.inputAccessoryView = customView
}

我要做的是为自定义视图创建.xib文件，这可以使您更轻松地使用所有所需的按钮和其他UI进行设计。（如果您不知道如何使用xib，则可以在此处或在YouTube上搜索，它们会派上用场）

或者有一些CocoaPods可以满足您的需求，例如，看看以下内容：

https://github.com/ruddfawcett/RFKeyboardToolbar

如何将工具栏添加到键盘扩展中？

2 个答案: