#365DaysIOSAccessibility

Day 34

Meaningful accessibilityValue for sliders

21 Jun 2022

accessibilityValueadjustableiOS

By

Dani Devesa Derksen-Staats

UISliders are adjustable, and its default accessibility value is represented in percentages. But that's not always the best format to express a value. Consider a slider to select a distance radius. Miles or km seem a more appropriate unit.

A slider is used to select a distance radius of 5 km. In code, the accessibilityValue property of the slider is updated using a Measurement Formatter to get the value as kilometres when the user interacts with the slider.

Example code in the image:

override var accessibilityValue: String? {
    get {
        let formatter = MeasurementFormatter()
        let measurement = Measurement(
          value: Double(value),
          unit: .kilometers
        )
        formatter.unitStyle = .long
        return formatter.string(from: measurement)
      }
    set {}
}

Some of you have asked me how you can support what I do. This would really help, and would be hugely appreciated:

  • Find these posts useful? Share them at work, on social media, or with anyone that might find them interesting. Let's spread the word!

  • Check out any of my apps or games: Xarra!, RetroRapid!, or Mestre!.

    • A download and a review go a long way. They're free by default. On the App Store, ratings and reviews really help more people discover them.

    • Finding any of them useful? If so, and if you can afford it, purchasing lifetime access to all features or subscribing lets me buy the coffee that keeps me caffeinated. Caffeine keeps me going to maintain the apps, bring in new features that I hope you'll love, and keep writing.

You may also find interesting...

Day 33

Implement accessibilityIncrement and Decrement

With VoiceOver, you can swipe up/down to increase/decrease the value of adjustable components. You need to implement accessibilityIncrement() and accessibilityDecrement() accordingly, and configure an accessibility value that makes sense. Example code in the image: ```swift override func accessibilityIncrement() { guard value < 5 else { return } value += 1 accessibilityValue = "\(value) of 5" sendActions(for: .valueChanged) } override func accessibilityDecrement() { guard value > 1 else { return } value -= 1 accessibilityValue = "\(value) of 5" sendActions(for: .valueChanged) } ``` Links to the official documentation: * accessibilityincrement() * accessibilitydecrement()

Day 164

Inspect labels, traits, and actions

With the Accessibility Inspector you can check the value for the most common accessibility attributes for individual elements, do some basic navigation, and even perform actions if the component is adjustable or if it has custom actions.

Day 200

Don't miss visual cues in accessibility labels

There are details conveying important information that are shown visually with little icons, badges, progress bars, and similar cues that can be missed when they are not added as part of the accessibility label or accessibility value of a UI component.

Content © Daniel Devesa Derksen-Staats on Accessibility up to 11! is licensed under CC BY 4.0. License details

← Day 35
Day 33 →