Menu

Success Criteria:

Name Name describes the purpose of the control (opens menu or closes menu)
Role Identifies itself as a button or menu button
Grouping Visible label, if any, is grouped with the menu button in a single swipe
State State options: disabled/dimmed, expands/collapses, if opens/closes is not in name
Focus Focused by swipe or touch. Screen reader focus is confined within the menu
Actions Double tap

External Keyboard Support

space bar or enter key Activates menu on iOS
down/up arrow or tab Navigate through menu on iOS
Android: keyboard mapping to menu or navigation bar is limited. If accessible with keyboard, actions are the same as iOS

Native Element

  • A menu is a container for a list of items

Name

  • Name describes the purpose of the control (Ex: opens menu or closes menu), with additional label description if needed
  • iOS Options
    • Set a label in Interface Builder in the Identity Inspector
    • setTitle( ) method
    • If no visible text label, use accessibilityLabel
    • Hint is used only if the results of interacting with it are not obvious from the control's label.
  • Android Options
    • android:text XML attribute
    • Optional: use contentDescription for a more descriptive name, depending on type of view and for elements without a visible label.
    • contentDescription overrides android:text

Role

  • iOS
    • UIMenu
  • Android
    • android.view.Menu

Groupings

  • Group visible label, if any, is grouped with the menu button in a single swipe
  • iOS
    • accessibilityFrame
    • accessibilityFrameInContainerSpace
    • GroupView
    • Only the container class is an accessible element
  • Android
    • ViewGroup
    • Set the container object's android:screenReaderFocusable attribute to true, and each inner object's android:focusable attribute to false. In doing so, accessibility services can present the inner elements' content descriptions/names, one after the other, in a single announcement.

State

  • Expandable menus
    • Values are the future state - "expands"/"collapses"
    • If "opens" or "closes" is not included in the name, the expands/collapses state must be announced
  • iOS
    • UIControlState, UIAccessibilityTraitEnabled
    • Disabled: UIAccessibilityTraitNotEnabled. Announced as "dimmed"
  • Android
    • Active: android:enabled=true
    • Disabled: android:enabled=false. Announced as: "disabled"

Focus

Screen reader focus must be confined within the menu, which can include the button that opened it. Focus can remain on the button or moved to the first item in the menu. Swipe to navigate within the menu.

    • iOS Options
      • accessibilityElementIsFocused
      • isAccessibilityElement - Yes, if the element can respond to user input
      • To move screen reader focus to newly revealed content: UIAccessibilityLayoutChangedNotification
      • To NOT move focus, but announce new content: UIAccessibilityAnnouncementNotification
    • Android Options
      • android:focusable=true
      • android=clickable=true
      • Implement an onClick( ) event handler for keyboard, not onTouch( )
      • nextFocusDown
      • nextFocusUp
      • nextFocusRight
      • nextFocusLeft
      • accessibilityTraversalBefore (or after)
      • To move screen reader focus to newly revealed content: Type_View_Focused
      • To NOT move focus, but announce new content: accessibilityLiveRegion
      • To hide controls: Important_For _Accessibility_NO

Actions

  • Double tap to activate the menu