A11y Considerations

[devandanger]

Links or buttons are recommended to have hit targets of 44x44.

Additionally to support this larger hit targets, I need to make a custom AttributedLabel hitTest method for the View to accept hit tests and forward them on to the DetectAreaButton.

I have these implemented as opt-in only, so they shouldn't have any effect on the existing code. @psharanda would you be interested in these A11y enhancements?

There are a couple voiceover improvements that I'm looking at as well.

[psharanda]

Hi @devandanger Thanks for your interest! Unfortunately I don't see any way, how we can increase hit area without introducing intersection problem, hit area is already at max size But I definitely would like to see your voice over improvements.

[devandanger]

RE:Hit Area. The enhancement would have to be opt-in. And I wouldn't suggest using it in a scenario where you are feeding content in from an external source (like twitter in maybe this case).

If you have a controlled amount of text which you wanted attributed with styles you could opt-in to it by doing the following.

//super simple example of growing it out 20 each way, there are smarter ways but just a gist
detailDescriptionLabel.buttonSizingClosure = { (label, detection, rect) in
             return rect.insetBy(dx: -20, dy: -20)
 }

As you pointed out this would be problematic for the following copy.

Which as UX advocates we'll have to avoid this, but it improves the other scenarios where you only have one hit target in there. We use this attributed text a lot as headers to certain form element fields. Links allow us to to give additional context of what we are asking, this is typically ancillary behavior but we are trying to be as inclusive as possible per the WCAG.

Thoughts?

Further code implementation in layoutSubviews of AttributedLabel

            highlightableDetections.forEach { detection in
                let nsrange = NSRange(detection.range, in: attributedText.string)
                textView.layoutManager.enumerateEnclosingRects(forGlyphRange: nsrange, withinSelectedGlyphRange: NSRange(location: NSNotFound, length: 0), in: textView.textContainer, using: { (rect, stop) in
                    if let buttonSizingClosure = self.buttonSizingClosure {
                        let newRect = buttonSizingClosure(self, detection, rect)
                        self.addDetectionAreaButton(frame: newRect, detection: detection, text: String(attributedText.string[detection.range]))
                    } else {
                        self.addDetectionAreaButton(frame: rect, detection: detection, text: String(attributedText.string[detection.range]))
                    }
                })
            }

Outside the frame lines reguired additional hitTest opt-ins on the AttributedText, but I'm looking at different approaches for those.

[psharanda]

Looks good, I like it 👍 Do you want to create a PR?