2

I have two questions regarding accessibility and UICollectionViews that I'm hoping to get some expert help with. The other question, regarding section headers, can be found here. I've created a sample project demonstrating both issues.

I have a UICollectionView using UICollectionViewFlowLayout that contains items of variable height. UIFlowLayout centers the elements on each row vertically. Unfortunately, when Voice Over is enabled, it seems to favor elements that are placed higher vertically, causing it to read items out of order.

You can pull this example project, run it, enable voice over, and swipe through the items to see the issue. It creates cells with random heights, so it will very likely read the cells out of order.

Is there a way I can make the collection view advance through the items sequentially? I feel like that is the only way that makes sense, but I can't find a way to enforce that behavior. Setting the collection view to group child views doesn't seem to help. Any help would be greatly appreciated.

Community
  • 1
  • 1
Jose Ibanez
  • 3,325
  • 3
  • 28
  • 33

1 Answers1

4

Taken from Accessibility for iOS, VoiceOver read order issue

The quickest way to achieve this for your example is to place the three labels in a transparent UIView subclass to serve as a container for your labels. This subclass will have to be properly setup to let VoiceOver know how to interpret it. If your deployment target is iOS6 then you can simply answer the "should group accessibility children" question in this subclass.

-(BOOL)shouldGroupAccessibilityChildren{
     return YES;
 }

For below iOS6 it would be more complicated, except that your UIView container subclass would contain only UILabels which are accessibility elements. You could implement it like this:

 -(BOOL)isAccessibilityElement{
     return NO;
  }
  -(NSInteger)accessibilityElementCount{
       return self.subviews.count;
  }
  -(id)accessibilityElementAtIndex:(NSInteger)index{
      return [self.subviews objectAtIndex:index];
  }
  -(NSInteger)indexOfAccessibilityElement:(id)element{
      return [self.subviews indexOfObject:element];
  }

I have tested this example code and it does what you are looking for, if you need any clarification please add a comment. Always happy to help make things more accessible.

Community
  • 1
  • 1
Ponja
  • 663
  • 1
  • 8
  • 15