accessibility for designed components

This commit is contained in:
Kevin G Christiano 2020-06-03 13:42:26 -04:00
parent 0e6a4ef818
commit 01ad16d9ff
8 changed files with 241 additions and 36 deletions

View File

@ -11,12 +11,17 @@ import Foundation
@objcMembers open class ListRVWheel: TableViewCell {
//--------------------------------------------------
// MARK: - Properties
// MARK: - Outlets
//--------------------------------------------------
let wheel = Wheel()
let leftLabel = Label.createLabelBoldBodySmall(true)
let rightLabel = Label.createLabelRegularBodySmall(true)
//--------------------------------------------------
// MARK: - Properties
//--------------------------------------------------
var stack: Stack<StackModel>
//-----------------------------------------------------
@ -41,9 +46,12 @@ import Foundation
open override func setupView() {
super.setupView()
rightLabel.setContentCompressionResistancePriority(UILayoutPriority(rawValue: 900), for: .horizontal)
addMolecule(stack)
stack.restack()
isAccessibilityElement = true
updateAccessibilityLabel()
}
//-------------------------------------------------
@ -58,6 +66,7 @@ import Foundation
leftLabel.set(with: model.leftLabel, delegateObject, additionalData)
rightLabel.set(with: model.rightLabel, delegateObject, additionalData)
wheel.set(with: model.wheel, delegateObject, additionalData)
updateAccessibilityLabel()
}
open override func reset() {
@ -69,4 +78,27 @@ import Foundation
public override class func estimatedHeight(with model: MoleculeModelProtocol, _ delegateObject: MVMCoreUIDelegateObject?) -> CGFloat? {
return 70
}
//--------------------------------------------------
// MARK: - Accessibility
//--------------------------------------------------
func updateAccessibilityLabel() {
var message = ""
if let leftLabelText = leftLabel.text, !leftLabelText.isEmpty {
message += leftLabelText
}
if let wheelLabel = wheel.accessibilityLabel, !wheelLabel.isEmpty {
message += wheelLabel
}
if let rightLabelText = rightLabel.text, !rightLabelText.isEmpty {
message += rightLabelText
}
accessibilityLabel = message
}
}

View File

@ -14,10 +14,15 @@ import Foundation
// MARK: - Outlets
//-----------------------------------------------------
public var stack: Stack<StackModel>
public let button = PillButton()
public let eyebrowHeadlineBodyLink = EyebrowHeadlineBodyLink()
//-----------------------------------------------------
// MARK: - Properties
//-----------------------------------------------------
public var stack: Stack<StackModel>
//--------------------------------------------------
// MARK: - Initializers
//--------------------------------------------------
@ -39,9 +44,12 @@ import Foundation
override open func setupView() {
super.setupView()
addMolecule(stack)
stack.restack()
updateAccessibilityLabel()
accessibilityValue = button.accessibilityValue
accessibilityHint = button.accessibilityHint
}
//-----------------------------------------------------
@ -70,10 +78,6 @@ import Foundation
var message = ""
if let checkboxLabel = button.accessibilityLabel {
message += checkboxLabel + ", "
}
if let eyebrowLabel = eyebrowHeadlineBodyLink.eyebrow.text {
message += eyebrowLabel + ", "
}
@ -83,7 +87,11 @@ import Foundation
}
if let bodyLabel = eyebrowHeadlineBodyLink.body.text {
message += bodyLabel
message += bodyLabel + ", "
}
if let buttonLabel = button.accessibilityLabel {
message += buttonLabel
}
let linkShowing = eyebrowHeadlineBodyLink.link.titleLabel?.text?.count ?? 0 > 0
@ -111,4 +119,8 @@ import Foundation
accessibilityElements = elements
}
}
open override func accessibilityActivate() -> Bool {
return button.accessibilityActivate()
}
}

View File

@ -41,6 +41,8 @@ import Foundation
rightImage.addSizeConstraintsForAspectRatio = true
addMolecule(stack)
stack.restack()
isAccessibilityElement = true
updateAccessibilityLabel()
}
//----------------------------------------------------
@ -54,6 +56,7 @@ import Foundation
leftLabel.set(with: model.leftLabel, delegateObject, additionalData)
rightImage.set(with: model.image, delegateObject, additionalData)
updateAccessibilityLabel()
}
open override class func estimatedHeight(with model: MoleculeModelProtocol, _ delegateObject: MVMCoreUIDelegateObject?) -> CGFloat? {
@ -64,4 +67,23 @@ import Foundation
super.reset()
leftLabel.styleBoldBodySmall(true)
}
//--------------------------------------------------
// MARK: - Accessibility
//--------------------------------------------------
func updateAccessibilityLabel() {
var message = ""
if let leftLabelText = leftLabel.text, !leftLabelText.isEmpty {
message += leftLabelText + ", "
}
if let rightImageText = rightImage.accessibilityLabel, !rightImageText.isEmpty {
message += rightImageText
}
accessibilityLabel = message
}
}

View File

@ -69,6 +69,7 @@ import Foundation
addMolecule(stack)
stack.restack()
updateAccessibilityLabel()
}
open override func set(with model: MoleculeModelProtocol, _ delegateObject: MVMCoreUIDelegateObject?, _ additionalData: [AnyHashable: Any]?) {
@ -79,6 +80,7 @@ import Foundation
eyebrowHeadlineBodyLink.set(with: model.eyebrowHeadlineBodyLink, delegateObject, additionalData)
rightLabel.set(with: model.rightLabel, delegateObject, additionalData)
arrow.set(with: model.arrow, delegateObject, additionalData)
updateAccessibilityLabel()
}
open override class func estimatedHeight(with model: MoleculeModelProtocol, _ delegateObject: MVMCoreUIDelegateObject?) -> CGFloat? {
@ -91,48 +93,55 @@ import Foundation
func updateAccessibilityLabel() {
var message = ""
checkbox.updateAccessibilityLabel()
if let checkboxLabel = checkbox.accessibilityLabel {
message += checkboxLabel + ", "
}
if let eyebrowLabel = eyebrowHeadlineBodyLink.eyebrow.text {
message += eyebrowLabel + ", "
}
if let headlineLabel = eyebrowHeadlineBodyLink.headline.text {
message += headlineLabel + ", "
}
if let bodyLabel = eyebrowHeadlineBodyLink.body.text {
message += bodyLabel
}
let linkShowing = eyebrowHeadlineBodyLink.link.titleLabel?.text?.count ?? 0 > 0
isAccessibilityElement = !linkShowing
checkbox.isAccessibilityElement = linkShowing
eyebrowHeadlineBodyLink.link.isAccessibilityElement = linkShowing
if !linkShowing {
// Make whole cell focusable if no link.
var message = ""
if let eyebrowLabel = eyebrowHeadlineBodyLink.eyebrow.text {
message += eyebrowLabel + ", "
}
if let headlineLabel = eyebrowHeadlineBodyLink.headline.text {
message += headlineLabel + ", "
}
if let bodyLabel = eyebrowHeadlineBodyLink.body.text {
message += bodyLabel + ", "
}
if let rightLabelText = rightLabel.text {
message += rightLabelText
}
accessibilityLabel = message
} else {
// Allow only radio button and link to be focused on.
checkbox.accessibilityLabel = message
var elements: [UIView] = []
if message.count > 0 {
elements.append(checkbox)
if let eyebrowText = eyebrowHeadlineBodyLink.eyebrow.text, !eyebrowText.isEmpty {
elements.append(eyebrowHeadlineBodyLink.eyebrow)
}
if let headlineText = eyebrowHeadlineBodyLink.headline.text, !headlineText.isEmpty {
elements.append(eyebrowHeadlineBodyLink.headline)
}
if let bodyText = eyebrowHeadlineBodyLink.body.text, !bodyText.isEmpty {
elements.append(eyebrowHeadlineBodyLink.body)
}
if linkShowing {
elements.append(eyebrowHeadlineBodyLink.link)
}
if let rightLabelText = rightLabel.text, !rightLabelText.isEmpty {
elements.append(rightLabel)
}
accessibilityElements = elements
}
}

View File

@ -14,11 +14,16 @@ import Foundation
// MARK: - Outlets
//-----------------------------------------------------
private let stack: Stack<StackModel>
public let headlineBody = HeadlineBody()
public let arrow = Arrow()
public let rightLabel = Label.createLabelRegularBodySmall(true)
//-----------------------------------------------------
// MARK: - Properties
//-----------------------------------------------------
let arrowAndRightLabelStack: Stack<StackModel>
private let stack: Stack<StackModel>
//--------------------------------------------------
// MARK: - Initializers
@ -54,6 +59,8 @@ import Foundation
addMolecule(stack)
stack.restack()
arrowAndRightLabelStack.restack()
isAccessibilityElement = true
updateAccessibilityLabel()
}
//--------------------------------------------------
@ -68,6 +75,7 @@ import Foundation
headlineBody.set(with: model.headlineBody, delegateObject, additionalData)
rightLabel.set(with: model.rightLabel, delegateObject, additionalData)
arrow.set(with: model.arrow, delegateObject, additionalData)
updateAccessibilityLabel()
}
open override class func estimatedHeight(with model: MoleculeModelProtocol, _ delegateObject: MVMCoreUIDelegateObject?) -> CGFloat? {
@ -78,4 +86,27 @@ import Foundation
super.reset()
headlineBody.styleListItem()
}
//--------------------------------------------------
// MARK: - Accessibility
//--------------------------------------------------
func updateAccessibilityLabel() {
var message = ""
if let headlineText = headlineBody.headlineLabel.text, !headlineText.isEmpty {
message += headlineText + ", "
}
if let messageText = headlineBody.messageLabel.text, !messageText.isEmpty {
message += messageText + ", "
}
if let rightLabelText = rightLabel.text, !rightLabelText.isEmpty {
message += rightLabelText
}
accessibilityLabel = message
}
}

View File

@ -14,10 +14,15 @@ import Foundation
// MARK: - Outlets
//--------------------------------------------------
public var stack: Stack<StackModel>
public let link = Link()
public let eyebrowHeadlineBodyLink = EyebrowHeadlineBodyLink()
//--------------------------------------------------
// MARK: - Outlets
//--------------------------------------------------
public var stack: Stack<StackModel>
//--------------------------------------------------
// MARK: - Initializers
//--------------------------------------------------
@ -39,8 +44,10 @@ import Foundation
override open func setupView() {
super.setupView()
addMolecule(stack)
stack.restack()
updateAccessibilityLabel()
}
//--------------------------------------------------
@ -54,9 +61,64 @@ import Foundation
link.set(with: model.link, delegateObject, additionalData)
eyebrowHeadlineBodyLink.set(with: model.eyebrowHeadlineBodyLink, delegateObject, additionalData)
updateAccessibilityLabel()
}
open override class func estimatedHeight(with model: MoleculeModelProtocol, _ delegateObject: MVMCoreUIDelegateObject?) -> CGFloat? {
return 90
}
//--------------------------------------------------
// MARK: - Accessibility
//--------------------------------------------------
func updateAccessibilityLabel() {
var message = ""
if let eyebrowLabel = eyebrowHeadlineBodyLink.eyebrow.text {
message += eyebrowLabel + ", "
}
if let headlineLabel = eyebrowHeadlineBodyLink.headline.text {
message += headlineLabel + ", "
}
if let bodyLabel = eyebrowHeadlineBodyLink.body.text {
message += bodyLabel + ", "
}
if let linkLabel = link.accessibilityLabel {
message += linkLabel
}
let linkShowing = eyebrowHeadlineBodyLink.link.titleLabel?.text?.count ?? 0 > 0
isAccessibilityElement = !linkShowing
link.isAccessibilityElement = linkShowing
eyebrowHeadlineBodyLink.link.isAccessibilityElement = linkShowing
if !linkShowing {
// Make whole cell focusable if no link.
accessibilityLabel = message
} else {
// Allow only radio button and link to be focused on.
link.accessibilityLabel = message
var elements: [UIView] = []
if linkShowing {
elements.append(eyebrowHeadlineBodyLink.link)
}
if !message.isEmpty {
elements.append(link)
}
accessibilityElements = elements
}
}
open override func accessibilityActivate() -> Bool {
return link.accessibilityActivate()
}
}

View File

@ -14,11 +14,16 @@ import Foundation
// MARK: - Outlets
//-----------------------------------------------------
public var stack: Stack<StackModel>
public let leftLabel = Label.createLabelBoldBodySmall(true)
public let rightLabel = Label.createLabelRegularBodySmall(true)
public let bar = Line()
//-----------------------------------------------------
// MARK: - Properties
//-----------------------------------------------------
public var stack: Stack<StackModel>
//-----------------------------------------------------
// MARK: - Initializers
//-----------------------------------------------------
@ -46,6 +51,8 @@ import Foundation
rightLabel.setContentCompressionResistancePriority(UILayoutPriority(rawValue: 900), for: .horizontal)
addMolecule(stack)
stack.restack()
isAccessibilityElement = true
updateAccessibilityLabel()
}
//--------------------------------------------------
@ -60,6 +67,7 @@ import Foundation
leftLabel.set(with: model.leftLabel, delegateObject, additionalData)
rightLabel.set(with: model.rightLabel, delegateObject, additionalData)
bar.set(with: model.bar, delegateObject, additionalData)
updateAccessibilityLabel()
}
open override class func estimatedHeight(with molecule: MoleculeModelProtocol?, _ delegateObject: MVMCoreUIDelegateObject?) -> CGFloat? {
@ -68,8 +76,28 @@ import Foundation
open override func reset() {
super.reset()
leftLabel.styleBoldBodySmall(true)
rightLabel.styleRegularBodySmall(true)
bar.setStyle(.heavy)
}
//--------------------------------------------------
// MARK: - Accessibility
//--------------------------------------------------
func updateAccessibilityLabel() {
var message = ""
if let leftLabelText = leftLabel.text, !leftLabelText.isEmpty {
message += leftLabelText + ", "
}
if let rightLabelText = rightLabel.text, !rightLabelText.isEmpty {
message += rightLabelText
}
accessibilityLabel = message
}
}

View File

@ -117,6 +117,15 @@ public typealias ButtonAction = (Button) -> ()
open func reset() {
backgroundColor = .clear
}
//--------------------------------------------------
// MARK: - Accessibility
//--------------------------------------------------
open override func accessibilityActivate() -> Bool {
buttonAction?(self)
return buttonAction != nil
}
}
// MARK: - MVMCoreViewProtocol