Associated Text

A control should get its accessible name from a nearby label available for assistive technologies such as VoiceOver and Voice Control.

Impact

People using VoiceOver are most impacted. A control that is visually tied to a descriptive element must also convey that relationship through text for assistive technology.

Confirmation

1. Turn on VoiceOver
2. Focus on the control
3. One of the following will happen:
   • Inaccessible: It will not announce the associated label as the control's name, only its role and value if present.
   • Accessible: It will announce the associated label as the control's name with VoiceOver.

How to Fix

UIKit

To fix an issue found by this rule, add an accessibilityLabel to the control with the neighboring descriptor.

toggle.accessibilityLabel = label.text
label.isAccessibilityElement = false

SwiftUI

To fix an issue found by this rule, add an accessibilityLabel to the control with the neighboring descriptor.

@State private var payment: CGFloat = 0
private let sliderLabel = "Payment"
var body: some View {
    VStack {
        Text("\(Int(payment)) \(sliderLabel)")
        Slider(value: $payment, in: 0...20).accessibility(label: Text(sliderLabel))
    }
}