Formatter — mi ez, beviteli formázók és NSFormatter

Mi az a Formatter iOS-ben?

Formatter iOS-ben egy komponens, amely a nyers felhasználói bevitelt strukturált formátumba alakítja át egy meghatározott sablon szerint. Ellentétben az űrlap elküldése utáni egyszerű érvényesítéssel, a formázó valós időben működik, korrigálva az adatok megjelenítését azok bevitele során.

Az iOS több formázási szintet kínál: rendszer Foundation formázók (NumberFormatter, DateFormatter, ByteCountFormatter) adatok megjelenítéséhez, PhoneNumberKit keretrendszert telefonszámokhoz és harmadik féltől származó InputMask könyvtárakat tetszőleges beviteli maszkokhoz.

Az Apple Human Interface Guidelines szerint a beviteli formázók három feladatot oldanak meg: csökkentik a kognitív terhelést, csökkentik a hibák számát és gyorsítják az űrlapkitöltést.

A formázók különösen fontosak a mobil eszközök számára, ahol az adatbevitel az érintőképernyős billentyűzettel több erőfeszítést igényel, mint a fizikaival.

Beviteli formázók típusai

Beviteli formázók iOS-ben három kategóriába oszlanak: rendszer Foundation formázók, specializált Apple formázók (PhoneNumberKit) és harmadik fél könyvtárai (InputMask, MaskedTextField).

Rendszer Foundation formázók

NumberFormatter numerikus értékeket formáz. DateFormatter dátumokat és időt alakít lokalizált szöveggé.

PhoneNumberKit

PhoneNumberKit — Apple könyvtár telefonszámok nemzeti szabványok szerinti formázásához.

Input Mask könyvtárak

Harmadik fél könyvtárai InputMask univerzális beviteli maszkolási mechanizmust nyújtanak bármilyen formátumhoz: kártyaszámok (0000 0000 0000 0000), dátumok (ÉÉ.HH.NN), adószám (00000000-0-00).

Absztrakt NSFormatter osztály

NSFormatter — egy absztrakt Foundation osztály, amelyből az összes rendszer iOS formázó származik. Két fő metódust határoz meg: string(for:) és getObjectValue(_:for:errorDescription:). Az Apple a meglévő Foundation formázók használatát ajánlja. Az NSFormatter támogatja a hibaüzenetek lokalizálását is.

Input Mask és beviteli maszkolás

Input Mask — egy sablon, amely meghatározza a bevitt adatok formátumát és automatikusan elhelyezi az elválasztókat gépelés közben. A legnépszerűbb iOS könyvtár — InputMask a RedMadRobot-tól. Összetett maszkokat támogat feltételekkel és opcionális blokkokkal.

Telefonszámok formázása

Telefonszámok formázása — a leggyakoribb forgatókönyv a formázók használatára mobilalkalmazásokban. Az iOS 16-tól beépített mechanizmus érhető el az UIContentUnavailableConfiguration segítségével.

Formatter implementálása Swift-ben

Formatter implementálása Swift-ben a választott megközelítéstől függ. A rendszer Foundation formázókhoz az iOS 15-től elérhető formatter tulajdonság használható az UITextField-en.

import PhoneNumberKit

class PhoneViewController: UIViewController {

    let phoneNumberKit = PhoneNumberKit()
    @IBOutlet var phoneField: UITextField!

    override func viewDidLoad() {
        super.viewDidLoad()
        phoneField.delegate = self
    }
}

extension PhoneViewController: UITextFieldDelegate {
    func textField(
        _ textField: UITextField,
        shouldChangeCharactersIn range: NSRange,
        replacementString string: String
    ) -> Bool {
        guard let text = textField.text else { return true }
        let partial = (text as NSString).replacingCharacters(in: range, with: string)
        textField.text = partial.applyPhoneMask()
        return false
    }
}

A NumberFormatter számára iOS 15+-tól elérhető a formatter tulajdonság az UITextField-en, amely automatikusan formázza a beírt számot.

let amountField = UITextField()
let formatter = NumberFormatter()
formatter.numberStyle = .currency
formatter.locale = Locale(identifier: "ru_RU")
amountField.formatter = formatter

A InputMask RedMadRobot konfigurálása a maszk inicializálásával és a delegált alkalmazásával történik.

import InputMask

class CardViewController: UIViewController {
    @IBOutlet var cardField: UITextField!
    var listener: MaskedTextFieldDelegate!

    override func viewDidLoad() {
        super.viewDidLoad()
        listener = MaskedTextFieldDelegate(
            primaryMaskFormat: "[0000] [0000] [0000] [0000]"
        )
        cardField.delegate = listener
    }
}