Extension to add up / down button and finish button to UIToolBar

Introduction

I often see some input forms with up / down and finish buttons on the keyboard. I really appreciate that kind of consideration: hugging: This time, I've created an Extension that implements them just by adding a sentence, so I will introduce it.

Image after mounting

Done button only

uitoolbar_done.gif

Up / down button and finish button

uitoolbar_updowndone.gif

How to use

Done button only

override func viewDidLoad() {
    super.viewDidLoad()
    //Set the Done button on the keyboard toolbar when the target text field is active.
    addPreviousNextableDoneButtonOnKeyboard(textFields: [textField1], previousNextable: false)
}

Up / down button and finish button

override func viewDidLoad() {
    super.viewDidLoad()
    //Set the front / back and finish buttons on the keyboard toolbar when the target text field is active.
    addPreviousNextableDoneButtonOnKeyboard(textFields: [textField2, textField3], previousNextable: true)
}

Extension


//
//  ViewController+ToolBar.swift
//  KeyboardUpDownSample
//
//  Created by Miharu Naruse on 2020/11/15.
//

//Reference source site
// - URL:: https://stackoverflow.com/questions/14148276/toolbar-with-previous-and-next-for-keyboard-inputaccessoryview

import Foundation
import UIKit

extension UIViewController {
    ///The process of setting the front / back button and finish button on the keyboard toolbar when the target text field is active.
    /// - Parameters:
    ///   - textFields:Array of text fields you want to set
    ///   - previousNextable:Whether to enable the front and back buttons
    ///
    ///How to use
    /// =============================================
    ///     //Text field keyboard toolbar settings
    ///     addPreviousNextableDoneButtonOnKeyboard(textFields: [textField1], previousNextable: false)
    ///     addPreviousNextableDoneButtonOnKeyboard(textFields: [textField2, textField3], previousNextable: true)
    ///
    func addPreviousNextableDoneButtonOnKeyboard(textFields: [UITextField], previousNextable: Bool = false) {
        for (index, textField) in textFields.enumerated() {
            //Loop processing is performed for each text field.
            let toolBar = UIToolbar(frame: CGRect(x: 0, y: 0, width: UIScreen.main.bounds.width, height: 50))
            toolBar.barStyle = .default
            ///Bar button item
            var items = [UIBarButtonItem]()

            // MARK:Front and back button settings

            if previousNextable {
                //When the front and back buttons are enabled
                ///Up arrow button
                let previousButton = UIBarButtonItem(image: UIImage(systemName: "chevron.up"), style: .plain, target: self, action: nil)
                if textField == textFields.first {
                    //In the array of text fields you want to set, if it is the top text field, deactivate it.
                    previousButton.isEnabled = false
                } else {
                    //Other than the above
                    //Target the previous text field.
                    previousButton.target = textFields[index - 1]
                    //Focus on the target.
                    previousButton.action = #selector(UITextField.becomeFirstResponder)
                }

                ///Fixed space
                let fixedSpace = UIBarButtonItem(barButtonSystemItem: UIBarButtonItem.SystemItem.fixedSpace, target: self, action: nil)
                fixedSpace.width = 8

                ///Down arrow button
                let nextButton = UIBarButtonItem(image: UIImage(systemName: "chevron.down"), style: .plain, target: self, action: nil)
                if textField == textFields.last {
                    //Of the array of text fields you want to set, if it is the bottom text field, deactivate it.
                    nextButton.isEnabled = false
                } else {
                    //Other than the above
                    //Set the next text field as the target.
                    nextButton.target = textFields[index + 1]
                    //Focus on the target.
                    nextButton.action = #selector(UITextField.becomeFirstResponder)
                }

                //Add front and back buttons to bar button items.
                items.append(contentsOf: [previousButton, fixedSpace, nextButton])
            }

            // MARK:Done button settings

            let flexSpace = UIBarButtonItem(barButtonSystemItem: .flexibleSpace, target: nil, action: nil)
            let doneButton = UIBarButtonItem(title: "Done", style: .done, target: view, action: #selector(UIView.endEditing))
            //Add a Done button to the bar button item.
            items.append(contentsOf: [flexSpace, doneButton])

            toolBar.setItems(items, animated: false)
            toolBar.sizeToFit()

            textField.inputAccessoryView = toolBar
        }
    }
}

Reference source site

https://stackoverflow.com/questions/14148276/toolbar-with-previous-and-next-for-keyboard-inputaccessoryview

Recommended Posts

Extension to add up / down button and finish button to UIToolBar
How to set up and use kapt
[Rails] [Memo] When to add = to <%%> and when not
Add spring boot and gradle to eclipse
How to set up and operate jEnv (Mac)
java algorithm Artery Time rounding up and down
[Swift5] How to round off, round down, and round up to the second or third decimal place