Anpassa tillgänglighetstext i Swift baserat på fokusriktning

Förbättra VoiceOver-tillgänglighet för dynamiska UI-element

När utvecklare skapar en inkluderande iOS-app möter utvecklare ofta unika utmaningar med VoiceOver-funktionalitet. En vanlig fråga är om tillgänglighetstexten i en UIView dynamiskt kan anpassas utifrån fokusrörelsens riktning. 🧭

Föreställ dig en layout med en Toppetikett, en samlingsvy som fungerar som ett rutnät av celler och en Bottom Label. Varje cell i samlingsvyn är oberoende tillgänglig, vilket ger en strömlinjeformad upplevelse för skärmläsaranvändare. Men ibland uppfyller standardtillgänglighetsbeteendet inte helt användarens behov.

Till exempel, när en användare navigerar från Toppetiketten till den första cellen i samlingsvyn kan det vara användbart att tillhandahålla ytterligare sammanhang som "Tabell med n rader och kolumner." Detta förbättrar tydlighet och användbarhet, särskilt för rutnät eller komplexa datastrukturer.

Å andra sidan, när du navigerar baklänges, från bottenetiketten tillbaka till den sista cellen, kan anpassning av texten göra att interaktioner känns mer intuitiva och sömlösa. Låt oss dyka in i hur denna dynamiska justering kan uppnås i Swift med hjälp av verkliga exempel. 🚀

Optimera tillgänglighetsetiketter med dynamiskt fokus

I det första skriptexemplet använder vi metoden `didUpdateFocusIn` från protokollet UICollectionViewDelegate för att spåra när VoiceOver-fokus flyttas mellan element. Denna metod tillåter utvecklare att upptäcka både den tidigare fokuserade vyn och nästa, vilket gör den idealisk för sammanhangsmedvetna justeringar. Genom att kontrollera om nästa fokuserade vy är en UICollectionViewCell, uppdaterar skriptet dynamiskt egenskapen accessibilityLabel med relevant sammanhang. Till exempel, när vi flyttar fokus från den översta etiketten till en samlingscell, lägger vi till information som "tabell med n rader och kolumner," ger ytterligare klarhet för användare som förlitar sig på hjälpmedel. 🧑‍💻

Det andra skriptet tar ett bredare tillvägagångssätt med hjälp av NotificationCenter, och lyssnar efter `UIAccessibility.elementFocusedNotification`. Den här aviseringen sänder ändringar i VoiceOver-fokus i appen. Genom att hantera det här meddelandet avgör skriptet dynamiskt vilket element som har fokus och uppdaterar dess accessibilityLabel i enlighet med detta. Detta tillvägagångssätt är särskilt användbart när flera komponenter i ett komplext användargränssnitt behöver liknande fokusmedvetna uppdateringar. Föreställ dig till exempel ett rutnät med interaktiva kort där varje kort ändrar sin beskrivning baserat på fokusriktningen – detta hanteras effektivt med aviseringar.

Båda metoderna är modulära och återanvändbara. Det första skriptet är tätt integrerat med UICollectionView, vilket gör det till en idealisk lösning för användargränssnitt som är starkt baserade på samlingsvyer. Å andra sidan är det aviseringsbaserade skriptet mer flexibelt och fungerar bra över olika layouter, som rutnät kombinerat med etiketter och knappar. Användningen av anpassade egenskaper som "customAccessibilityLabel" säkerställer att uppdateringar av tillgänglighetstext inte stör basfunktionaliteten för UI-element. Till exempel, i en reseapp, när fokus flyttas till ett destinationskort, kan kortets detaljer dynamiskt inkludera om det är en del av en utvald lista eller rekommendationer, vilket berikar användarupplevelsen. ✈️

Nyckeln till dessa implementeringar är att se till att accessibilityLabel är kortfattad men ändå beskrivande. Att lägga till riktningskontext när fokus skiftar kan förhindra förvirring för användare som navigerar i komplexa gränssnitt. Genom att till exempel ange "Toppetikett till cell 1, tabell" kan användare förstå både sin position i användargränssnittet och strukturen de interagerar med. Denna genomtänkta integration av tillgänglighetsfunktioner uppfyller inte bara WCAG-riktlinjerna utan skapar också en intuitiv, användarcentrerad upplevelse. Båda lösningarna säkerställer att tillgänglighet förblir en förstklassig medborgare i iOS-apputveckling.

// Approach 1: Using Accessibility Focus Delegates
import UIKit
class AccessibleCollectionViewCell: UICollectionViewCell {
    override var accessibilityLabel: String? {
        get {
            return customAccessibilityLabel
        }
        set {
            customAccessibilityLabel = newValue
        }
    }
    private var customAccessibilityLabel: String?
}
class ViewController: UIViewController, UICollectionViewDelegate {
    @IBOutlet weak var topLabel: UILabel!
    @IBOutlet weak var collectionView: UICollectionView!
    @IBOutlet weak var bottomLabel: UILabel!
    override func viewDidLoad() {
        super.viewDidLoad()
        collectionView.delegate = self
    }
    func collectionView(_ collectionView: UICollectionView,
                        didUpdateFocusIn context: UICollectionViewFocusUpdateContext,
                        with coordinator: UIFocusAnimationCoordinator) {
        if let nextFocusedCell = context.nextFocusedView as? AccessibleCollectionViewCell {
            let direction = context.previouslyFocusedView is UILabel ? "table with n Rows, n Columns" : ""
            nextFocusedCell.accessibilityLabel = "\(nextFocusedCell.customAccessibilityLabel ?? ""), \(direction)"
        }
    }
}

// Approach 2: Using Notification Center
import UIKit
class ViewController: UIViewController {
    @IBOutlet weak var collectionView: UICollectionView!
    private var lastFocusedElement: UIView?
    override func viewDidLoad() {
        super.viewDidLoad()
        NotificationCenter.default.addObserver(self,
                                               selector: #selector(handleFocusChange),
                                               name: UIAccessibility.elementFocusedNotification,
                                               object: nil)
    }
    @objc private func handleFocusChange(notification: Notification) {
        guard let userInfo = notification.userInfo,
              let focusedElement = userInfo[UIAccessibility.focusedElementUserInfoKey] as? UIView else { return }
        if let cell = focusedElement as? UICollectionViewCell,
           lastFocusedElement is UILabel {
            cell.accessibilityLabel = "\(cell.accessibilityLabel ?? ""), table with n Rows, n Columns"
        }
        lastFocusedElement = focusedElement
    }
}

Skapa dynamiska och kontextuella tillgänglighetsupplevelser

Tillgänglighet är en hörnsten i modern apputveckling, särskilt för plattformar som iOS där hjälpverktyg som VoiceOver spelar en central roll. En nyanserad men ofta förbisedd aspekt är förmågan att tillhandahålla ett dynamiskt sammanhang baserat på navigeringens fokusriktning. Genom att implementera logik som spårar om fokus flyttas från topp till botten eller vice versa, kan utvecklare lägga till meningsfulla detaljer till tillgänglighetstexten för element, vilket berikar användarupplevelsen. Till exempel, i en rutnätsbaserad galleriapp kan celler beskriva sin plats och sitt sammanhang när fokus skiftar från en rubrik till rutnätet, vilket hjälper användarna att förstå sin plats i strukturen. 🔍

En annan viktig punkt är att denna dynamiska justering inte är begränsad till UICollectionView. Det kan också tillämpas på andra element som UITableView, stackar eller anpassade vyer. Om en användare till exempel navigerar i en tabell med flera sektioner, kan rubriker lägga till sammanhang om raderna under dem när fokus går in i eller lämnar avsnittet. Detta säkerställer att användare som navigerar med VoiceOver kan få rumslig och hierarkisk medvetenhet om gränssnittet utan ytterligare ansträngning, vilket främjar användbarhet och överensstämmelse med WCAG-standarder. 🎯

Utöver grundläggande användningsfall stöder denna teknik även avancerade interaktionsmönster. Till exempel, i en utbildningsapp, när en frågesportsfråga får fokus, kan den meddela detaljer som frågenummer, totalt antal frågor som återstår eller till och med tips om ämnet. Sådana detaljer ökar engagemanget och minskar kognitiv belastning för användare som förlitar sig på hjälpmedelsteknik. Utvecklare måste prioritera dessa dynamiska förbättringar för att säkerställa att deras appar tjänar olika målgrupper effektivt och inkluderande. 🌍