mbrucedogs/vds_ios
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'mbruce/bugfixes' into 'develop'

Browse Source 
added logic for added/removing the accessibilityTrait .notEnabled based off the dissbled state

See merge request BPHV_MIPS/vds_ios!92
This commit is contained in:
Bruce, Matt R 2023-07-19 18:49:07 +00:00
commit 838a68348a
20 changed files with 498 additions and 235 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
VDS.xcodeproj/project.pbxproj
View File

@ -12,6 +12,7 @@
44604AD729CE196600E62B51 /* Line.swift in Sources */ = {isa = PBXBuildFile; fileRef = 44604AD629CE196600E62B51 /* Line.swift */; };
5F21D7BF28DCEB3D003E7CD6 /* Useable.swift in Sources */ = {isa = PBXBuildFile; fileRef = 5F21D7BE28DCEB3D003E7CD6 /* Useable.swift */; };
5FC35BE328D51405004EBEAC /* Button.swift in Sources */ = {isa = PBXBuildFile; fileRef = 5FC35BE228D51405004EBEAC /* Button.swift */; };
EA0D1C372A681CCE00E5C127 /* ToggleView.swift in Sources */ = {isa = PBXBuildFile; fileRef = EA0D1C362A681CCE00E5C127 /* ToggleView.swift */; };
EA0FC2C62914222900DF80B4 /* ButtonGroup.swift in Sources */ = {isa = PBXBuildFile; fileRef = EA0FC2C52914222900DF80B4 /* ButtonGroup.swift */; };
EA1DA1CB2A2E36DC001C51D2 /* SelectorBase.swift in Sources */ = {isa = PBXBuildFile; fileRef = EA1DA1CA2A2E36DC001C51D2 /* SelectorBase.swift */; };
EA1F266528B945070033E859 /* RadioSwatch.swift in Sources */ = {isa = PBXBuildFile; fileRef = EA1F266128B945070033E859 /* RadioSwatch.swift */; };
@ -148,6 +149,7 @@
44604AD629CE196600E62B51 /* Line.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = Line.swift; sourceTree = "<group>"; };
5F21D7BE28DCEB3D003E7CD6 /* Useable.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = Useable.swift; sourceTree = "<group>"; };
5FC35BE228D51405004EBEAC /* Button.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = Button.swift; sourceTree = "<group>"; };
EA0D1C362A681CCE00E5C127 /* ToggleView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ToggleView.swift; sourceTree = "<group>"; };
EA0FC2C52914222900DF80B4 /* ButtonGroup.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ButtonGroup.swift; sourceTree = "<group>"; };
EA1DA1CA2A2E36DC001C51D2 /* SelectorBase.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = SelectorBase.swift; sourceTree = "<group>"; };
EA1F266128B945070033E859 /* RadioSwatch.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = RadioSwatch.swift; sourceTree = "<group>"; };
@ -432,6 +434,7 @@
EA3361A0288B1E6F0071C351 /* Toggle */ = {
isa = PBXGroup;
children = (
EA0D1C362A681CCE00E5C127 /* ToggleView.swift */,
EA3361C228902D960071C351 /* Toggle.swift */,
);
path = Toggle;
@ -928,6 +931,7 @@
EA89200628B526D6006B9984 /* CheckboxGroup.swift in Sources */,
44604AD429CE186A00E62B51 /* NotificationButtonModel.swift in Sources */,
EAD8D2C128BFDE8B006EB6A6 /* UIGestureRecognizer+Publisher.swift in Sources */,
EA0D1C372A681CCE00E5C127 /* ToggleView.swift in Sources */,
EAF7F0B9289C139800B287F5 /* ColorConfiguration.swift in Sources */,
EA3361BD288B2C760071C351 /* TypeAlias.swift in Sources */,
EAB1D2CF28ABEF2B00DAE764 /* Typography.swift in Sources */,

24
VDS/Classes/Control.swift
View File

@ -44,17 +44,12 @@ open class Control: UIControl, Handlerable, ViewProtocol, Resettable, UserInfoab
open var surface: Surface = .light { didSet { setNeedsUpdate() } }
/// Control is disabled or not
open var disabled: Bool = false { didSet { setNeedsUpdate(); isUserInteractionEnabled = !disabled } }
open override var state: UIControl.State {
get {
var state = super.state
if disabled {
state.insert(.disabled)
} else {
state.remove(.disabled)
open var disabled: Bool {
get { !isEnabled }
set {
if !isEnabled != newValue {
isEnabled = !newValue
}
return state
}
}
@ -85,14 +80,7 @@ open class Control: UIControl, Handlerable, ViewProtocol, Resettable, UserInfoab
}
/// Override to deal with setNeedsUpdate()
open override var isEnabled: Bool {
get { !disabled }
set {
if disabled != !newValue {
disabled = !newValue
}
}
}
open override var isEnabled: Bool { didSet { setNeedsUpdate(); isUserInteractionEnabled = isEnabled } }
//--------------------------------------------------
// MARK: - Initializers

43
VDS/Classes/SelectorBase.swift
View File

@ -58,12 +58,10 @@ open class SelectorBase: Control, SelectorControlable {
open var selectorColorConfiguration = ControlColorConfiguration() { didSet { setNeedsUpdate() }}
private var selectorView = View()
//--------------------------------------------------
// MARK: - Constraints
//--------------------------------------------------
private var selectorHeightConstraint: NSLayoutConstraint?
private var selectorWidthConstraint: NSLayoutConstraint?
internal var shapeLayer: CAShapeLayer?
open override func initialSetup() {
@ -75,36 +73,33 @@ open class SelectorBase: Control, SelectorControlable {
open override func setup() {
super.setup()
let layoutGuide = UILayoutGuide()
addLayoutGuide(layoutGuide)
selectorHeightConstraint = layoutGuide.heightAnchor.constraint(equalToConstant: size.height)
selectorHeightConstraint?.isActive = true
selectorWidthConstraint = layoutGuide.widthAnchor.constraint(equalToConstant: size.width)
selectorWidthConstraint?.isActive = true
NSLayoutConstraint.activate([
layoutGuide.topAnchor.constraint(equalTo: topAnchor),
layoutGuide.bottomAnchor.constraint(equalTo: bottomAnchor),
layoutGuide.leadingAnchor.constraint(equalTo: leadingAnchor),
layoutGuide.trailingAnchor.constraint(equalTo: trailingAnchor)])
layer.cornerRadius = 2.0
layer.borderWidth = VDSFormControls.widthBorder
isAccessibilityElement = true
accessibilityTraits = .button
}
open override var intrinsicContentSize: CGSize { size }
open func toggle() { }
open override func updateView() {
super.updateView()
selectorHeightConstraint?.constant = size.height
selectorWidthConstraint?.constant = size.width
setNeedsLayout()
layoutIfNeeded()
}
open override func updateAccessibilityLabel() {
accessibilityValue = isSelected ? "1" : "0"
if !accessibilityTraits.contains(.selected) && isSelected {
accessibilityTraits.insert(.selected)
} else if accessibilityTraits.contains(.selected) && !isSelected{
accessibilityTraits.remove(.selected)
}
if !accessibilityTraits.contains(.notEnabled) && !isEnabled {
accessibilityTraits.insert(.notEnabled)
} else if accessibilityTraits.contains(.notEnabled) && !isEnabled {
accessibilityTraits.remove(.notEnabled)
}
}
}

24
VDS/Classes/SelectorGroupHandlerBase.swift
View File

@ -68,6 +68,21 @@ open class SelectorGroupHandlerBase<HandlerType: Control>: Control, Changeable {
super.reset()
selectorViews.forEach{ $0.reset() }
}
open override func updateAccessibilityLabel() {
if !accessibilityTraits.contains(.selected) && isSelected {
accessibilityTraits.insert(.selected)
} else if accessibilityTraits.contains(.selected) && !isSelected{
accessibilityTraits.remove(.selected)
}
if !accessibilityTraits.contains(.notEnabled) && !isEnabled {
accessibilityTraits.insert(.notEnabled)
} else if accessibilityTraits.contains(.notEnabled) && !isEnabled {
accessibilityTraits.remove(.notEnabled)
}
setAccessibilityLabel(for: selectorViews)
}
}
open class SelectorGroupSelectedHandlerBase<HandlerType: Control>: SelectorGroupHandlerBase<HandlerType>{
@ -76,4 +91,13 @@ open class SelectorGroupSelectedHandlerBase<HandlerType: Control>: SelectorGroup
public var selectedHandler: HandlerType? {
return selectorViews.filter { $0.isSelected == true }.first
}
open override func updateAccessibilityLabel() {
super.updateAccessibilityLabel()
if let selectedHandler, let value = selectedHandler.accessibilityValue, let label = selectedHandler.accessibilityLabel {
accessibilityValue = "\(label) \(value)"
} else {
accessibilityValue = nil
}
}
}

12
VDS/Classes/SelectorItemBase.swift
View File

@ -270,6 +270,18 @@ open class SelectorItemBase<Selector: SelectorControlable>: Control, Errorable,
}
open override func updateAccessibilityLabel() {
accessibilityValue = isSelected ? "1" : "0"
if !accessibilityTraits.contains(.selected) && isSelected {
accessibilityTraits.insert(.selected)
} else if accessibilityTraits.contains(.selected) && !isSelected{
accessibilityTraits.remove(.selected)
}
if !accessibilityTraits.contains(.notEnabled) && !isEnabled {
accessibilityTraits.insert(.notEnabled)
} else if accessibilityTraits.contains(.notEnabled) && !isEnabled {
accessibilityTraits.remove(.notEnabled)
}
setAccessibilityLabel(for: [label, childLabel, errorLabel])
}
}

11
VDS/Classes/View.swift
View File

@ -34,7 +34,16 @@ open class View: UIView, Handlerable, ViewProtocol, Resettable, UserInfoable {
open var surface: Surface = .light { didSet { setNeedsUpdate() } }
/// Whether this object is disabled or not
open var disabled: Bool = false { didSet { setNeedsUpdate(); isUserInteractionEnabled = !disabled } }
open var disabled: Bool {
get { !isEnabled }
set {
if !isEnabled != newValue {
isEnabled = !newValue
}
}
}
open var isEnabled: Bool = true { didSet { setNeedsUpdate(); isUserInteractionEnabled = isEnabled } }
//--------------------------------------------------
// MARK: - Initializers

33
VDS/Components/Buttons/Button/ButtonBase.swift
View File

@ -55,8 +55,6 @@ open class ButtonBase: UIButton, Buttonable, Handlerable, ViewProtocol, Resettab
open var surface: Surface = .light { didSet { setNeedsUpdate() }}
open var disabled: Bool = false { didSet { setNeedsUpdate(); isUserInteractionEnabled = !disabled } }
open var userInfo = [String: Primitive]()
public var touchUpInsideCount: Int = 0
@ -80,28 +78,18 @@ open class ButtonBase: UIButton, Buttonable, Handlerable, ViewProtocol, Resettab
}
}
/// Override to deal with setNeedsUpdate()
open override var isEnabled: Bool {
get { !disabled }
/// Whether this object is disabled or not
open var disabled: Bool {
get { !isEnabled }
set {
if disabled != !newValue {
disabled = !newValue
if !isEnabled != newValue {
isEnabled = !newValue
}
}
}
open override var state: UIControl.State {
get {
var state = super.state
if disabled {
state.insert(.disabled)
} else {
state.remove(.disabled)
}
return state
}
}
open override var isEnabled: Bool { didSet { setNeedsUpdate(); isUserInteractionEnabled = isEnabled } }
open var textStyle: TextStyle { .defaultStyle }
open var textColor: UIColor { .black }
@ -138,7 +126,6 @@ open class ButtonBase: UIButton, Buttonable, Handlerable, ViewProtocol, Resettab
}
open func setup() {
translatesAutoresizingMaskIntoConstraints = false
titleLabel?.adjustsFontSizeToFitWidth = false
@ -172,7 +159,11 @@ open class ButtonBase: UIButton, Buttonable, Handlerable, ViewProtocol, Resettab
}
open func updateAccessibilityLabel() {
if !accessibilityTraits.contains(.notEnabled) && !isEnabled {
accessibilityTraits.insert(.notEnabled)
} else if accessibilityTraits.contains(.notEnabled) && !isEnabled {
accessibilityTraits.remove(.notEnabled)
}
}
//--------------------------------------------------

1
VDS/Components/Buttons/TextLinkCaret/TextLinkCaret.swift
View File

@ -76,6 +76,7 @@ open class TextLinkCaret: ButtonBase {
//--------------------------------------------------
open override func setup() {
super.setup()
accessibilityTraits = .link
}
open override func reset() {

12
VDS/Components/Checkbox/Checkbox.swift
View File

@ -18,6 +18,7 @@ open class Checkbox: SelectorBase {
open override func setup() {
super.setup()
accessibilityLabel = "Checkbox"
backgroundColorConfiguration.setSurfaceColors(VDSColor.elementsPrimaryOnlight, VDSColor.elementsPrimaryOndark, forState: .selected)
backgroundColorConfiguration.setSurfaceColors(VDSColor.elementsPrimaryOnlight, VDSColor.elementsPrimaryOndark, forState: [.selected, .highlighted])
@ -45,7 +46,7 @@ open class Checkbox: SelectorBase {
isSelected.toggle()
sendActions(for: .valueChanged)
}
open override func layoutSubviews() {
super.layoutSubviews()
@ -122,3 +123,12 @@ open class Checkbox: SelectorBase {
}
}
}
// MARK: AppleGuidlinesTouchable
extension Checkbox: AppleGuidlinesTouchable {
override open func point(inside point: CGPoint, with event: UIEvent?) -> Bool {
Self.acceptablyOutsideBounds(point: point, bounds: bounds)
}
}

1
VDS/Components/Checkbox/CheckboxGroup.swift
View File

@ -55,6 +55,7 @@ open class CheckboxGroup: SelectorGroupHandlerBase<CheckboxItem> {
}
}
}
setNeedsUpdate()
}
}

14
VDS/Components/Label/Label.swift
View File

@ -29,8 +29,6 @@ open class Label: UILabel, Handlerable, ViewProtocol, Resettable, UserInfoable {
open var surface: Surface = .light { didSet { setNeedsUpdate() }}
open var disabled: Bool = false { didSet { setNeedsUpdate(); isUserInteractionEnabled = !disabled } }
open var attributes: [any LabelAttributeModel]? { didSet { setNeedsUpdate() }}
open var textStyle: TextStyle = .defaultStyle { didSet { setNeedsUpdate() }}
@ -46,6 +44,18 @@ open class Label: UILabel, Handlerable, ViewProtocol, Resettable, UserInfoable {
}
}
/// Whether this object is disabled or not
open var disabled: Bool {
get { !isEnabled }
set {
if !isEnabled != newValue {
isEnabled = !newValue
}
}
}
open override var isEnabled: Bool { didSet { setNeedsUpdate(); isUserInteractionEnabled = isEnabled } }
//--------------------------------------------------
// MARK: - Configuration Properties
//--------------------------------------------------

4
VDS/Components/RadioBox/RadioBoxGroup.swift
View File

@ -23,6 +23,7 @@ open class RadioBoxGroup: SelectorGroupSelectedHandlerBase<RadioBoxItem> {
for selector in selectorViews {
selector.onClick = { [weak self] handler in
self?.didSelect(handler)
self?.setNeedsUpdate()
}
mainStackView.addArrangedSubview(selector)
}
@ -47,6 +48,7 @@ open class RadioBoxGroup: SelectorGroupSelectedHandlerBase<RadioBoxItem> {
}
}
}
setNeedsUpdate()
}
}
@ -81,8 +83,6 @@ open class RadioBoxGroup: SelectorGroupSelectedHandlerBase<RadioBoxItem> {
open override func setup() {
super.setup()
isAccessibilityElement = true
accessibilityTraits = .button
addSubview(mainStackView)
ensureDevice()
mainStackView.pinToSuperView()

16
VDS/Components/RadioBox/RadioBoxItem.swift
View File

@ -248,7 +248,21 @@ open class RadioBoxItem: Control, Changeable {
}
open override func updateAccessibilityLabel() {
setAccessibilityLabel(for: [textLabel, subTextLabel, subTextRightLabel])
accessibilityValue = isSelected ? "1" : "0"
if !accessibilityTraits.contains(.selected) && isSelected {
accessibilityTraits.insert(.selected)
} else if accessibilityTraits.contains(.selected) && !isSelected{
accessibilityTraits.remove(.selected)
}
if !accessibilityTraits.contains(.notEnabled) && !isEnabled {
accessibilityTraits.insert(.notEnabled)
} else if accessibilityTraits.contains(.notEnabled) && !isEnabled {
accessibilityTraits.remove(.notEnabled)
}
if accessibilityLabel == nil {
setAccessibilityLabel(for: [textLabel, subTextLabel, subTextRightLabel])
}
}
//--------------------------------------------------

20
VDS/Components/RadioButton/RadioButton.swift
View File

@ -36,6 +36,17 @@ open class RadioButton: SelectorBase {
}
open override func toggle() {
guard !isSelected else { return }
//removed error
if showError && isSelected == false {
showError.toggle()
}
isSelected.toggle()
sendActions(for: .valueChanged)
}
open override func layoutSubviews() {
super.layoutSubviews()
@ -71,3 +82,12 @@ open class RadioButton: SelectorBase {
}
}
}
// MARK: AppleGuidlinesTouchable
extension RadioButton: AppleGuidlinesTouchable {
override open func point(inside point: CGPoint, with event: UIEvent?) -> Bool {
Self.acceptablyOutsideBounds(point: point, bounds: bounds)
}
}

4
VDS/Components/RadioButton/RadioButtonGroup.swift
View File

@ -23,6 +23,7 @@ open class RadioButtonGroup: SelectorGroupSelectedHandlerBase<RadioButtonItem> {
for selector in selectorViews {
selector.onClick = { [weak self] handler in
self?.didSelect(handler)
self?.setNeedsUpdate()
}
mainStackView.addArrangedSubview(selector)
}
@ -49,6 +50,7 @@ open class RadioButtonGroup: SelectorGroupSelectedHandlerBase<RadioButtonItem> {
}
}
}
setNeedsUpdate()
}
}
@ -86,8 +88,6 @@ open class RadioButtonGroup: SelectorGroupSelectedHandlerBase<RadioButtonItem> {
open override func setup() {
super.setup()
isAccessibilityElement = true
accessibilityTraits = .button
addSubview(mainStackView)
mainStackView.pinToSuperView()

1
VDS/Components/TextFields/EntryField/EntryField.swift
View File

@ -182,7 +182,6 @@ open class EntryField: Control, Changeable {
super.setup()
isAccessibilityElement = true
accessibilityTraits = .button
addSubview(stackView)
//create the wrapping view

261
VDS/Components/Toggle/Toggle.swift
View File

@ -9,14 +9,7 @@ import Foundation
import UIKit
import VDSColorTokens
import Combine
/**
A custom implementation of Apple's UISwitch.
By default this class begins in the off state.
Container: The background of the toggle control.
Knob: The circular indicator that slides on the container.
*/
@objc(VDSToggle)
open class Toggle: Control, Changeable {
//--------------------------------------------------
@ -50,45 +43,18 @@ open class Toggle: Control, Changeable {
}
//--------------------------------------------------
// MARK: - Private Properties
// MARK: - Constraints
//--------------------------------------------------
private var stackView = UIStackView().with {
$0.isUserInteractionEnabled = false
$0.translatesAutoresizingMaskIntoConstraints = false
$0.axis = .horizontal
$0.distribution = .fill
}
private var toggleView = UIView().with {
$0.translatesAutoresizingMaskIntoConstraints = false
}
private var knobView = UIView().with {
$0.translatesAutoresizingMaskIntoConstraints = false
$0.backgroundColor = .white
}
private var leftConstraints: [NSLayoutConstraint] = []
private var rightConstraints: [NSLayoutConstraint] = []
private var labelConstraints: [NSLayoutConstraint] = []
//--------------------------------------------------
// MARK: - Configuration Properties
//--------------------------------------------------
// Sizes are from InVision design specs.
public let toggleSize = CGSize(width: 52, height: 28)
public let toggleContainerSize = CGSize(width: 52, height: 44)
public let knobSize = CGSize(width: 24, height: 24)
private var toggleColorConfiguration = ControlColorConfiguration().with {
$0.setSurfaceColors(VDSColor.elementsSecondaryOnlight, VDSColor.paletteGray44, forState: .normal)
$0.setSurfaceColors(VDSColor.interactiveDisabledOnlight, VDSColor.interactiveDisabledOndark, forState: .disabled)
$0.setSurfaceColors(VDSColor.interactiveDisabledOnlight, VDSColor.interactiveDisabledOndark, forState: [.selected, .disabled])
$0.setSurfaceColors(VDSColor.paletteGreen26, VDSColor.paletteGreen36, forState: .selected)
}
private var knobColorConfiguration = ControlColorConfiguration().with {
$0.setSurfaceColors(VDSColor.elementsPrimaryOndark, VDSColor.elementsPrimaryOndark, forState: .normal)
$0.setSurfaceColors(VDSColor.paletteGray95, VDSColor.paletteGray44, forState: .disabled)
$0.setSurfaceColors(VDSColor.paletteGray95, VDSColor.paletteGray44, forState: [.selected, .disabled])
$0.setSurfaceColors(VDSColor.elementsPrimaryOndark, VDSColor.elementsPrimaryOndark, forState: .selected)
}
//--------------------------------------------------
private let toggleContainerSize = CGSize(width: 52, height: 44)
private let spacingBetween = VDSLayout.Spacing.space3X.value
private let labelMaxWidth = 40.0
private var textStyle: TextStyle {
if textSize == .small {
@ -109,7 +75,7 @@ open class Toggle: Control, Changeable {
//--------------------------------------------------
// MARK: - Public Properties
//--------------------------------------------------
public var onChangeSubscriber: AnyCancellable? {
open var onChangeSubscriber: AnyCancellable? {
willSet {
if let onChangeSubscriber {
onChangeSubscriber.cancel()
@ -117,8 +83,15 @@ open class Toggle: Control, Changeable {
}
}
open var toggleView = ToggleView().with {
$0.setContentCompressionResistancePriority(.defaultHigh, for: .horizontal)
$0.isUserInteractionEnabled = false
}
open var label = Label().with {
$0.setContentCompressionResistancePriority(.required, for: .vertical)
$0.setContentCompressionResistancePriority(.defaultHigh, for: .horizontal)
$0.setContentHuggingPriority(.defaultHigh, for: .horizontal)
$0.textColorConfiguration = ViewColorConfiguration().with {
$0.setSurfaceColors(VDSColor.elementsSecondaryOnlight, VDSColor.elementsSecondaryOndark, forDisabled: true)
$0.setSurfaceColors(VDSColor.elementsPrimaryOnlight, VDSColor.elementsPrimaryOndark, forDisabled: false)
@ -129,9 +102,9 @@ open class Toggle: Control, Changeable {
get { isSelected }
set {
if isSelected != newValue {
toggleView.isOn = newValue
isSelected = newValue
}
setNeedsUpdate()
}
}
@ -143,6 +116,8 @@ open class Toggle: Control, Changeable {
open var offText: String = "Off" { didSet { setNeedsUpdate() }}
open var statusText: String { isOn ? onText : offText }
open var textSize: TextSize = .small { didSet { setNeedsUpdate() }}
open var textWeight: TextWeight = .regular { didSet { setNeedsUpdate() }}
@ -152,78 +127,7 @@ open class Toggle: Control, Changeable {
open var inputId: String? { didSet { setNeedsUpdate() }}
open var value: AnyHashable? { didSet { setNeedsUpdate() }}
//--------------------------------------------------
// MARK: - Constraints
//--------------------------------------------------
private var knobLeadingConstraint: NSLayoutConstraint?
private var knobTrailingConstraint: NSLayoutConstraint?
//functions
//--------------------------------------------------
// MARK: - Toggle
//--------------------------------------------------
private func constrainKnob(){
self.knobLeadingConstraint?.isActive = false
self.knobTrailingConstraint?.isActive = false
if isOn {
knobTrailingConstraint = toggleView.trailingAnchor.constraint(equalTo: knobView.trailingAnchor, constant: 2)
knobLeadingConstraint = knobView.leadingAnchor.constraint(greaterThanOrEqualTo: toggleView.leadingAnchor)
} else {
knobTrailingConstraint = toggleView.trailingAnchor.constraint(greaterThanOrEqualTo: knobView.trailingAnchor)
knobLeadingConstraint = knobView.leadingAnchor.constraint(equalTo: toggleView.leadingAnchor, constant: 2)
}
knobTrailingConstraint?.isActive = true
knobLeadingConstraint?.isActive = true
self.layoutIfNeeded()
}
private func updateToggle() {
let toggleColor = toggleColorConfiguration.getColor(self)
let knobColor = knobColorConfiguration.getColor(self)
if disabled || !isAnimated {
toggleView.backgroundColor = toggleColor
knobView.backgroundColor = knobColor
constrainKnob()
} else {
UIView.animate(withDuration: 0.2, delay: 0.0, options: .curveEaseIn, animations: {
self.toggleView.backgroundColor = toggleColor
self.knobView.backgroundColor = knobColor
}, completion: nil)
UIView.animate(withDuration: 0.33, delay: 0, usingSpringWithDamping: 0.7, initialSpringVelocity: 0.5, options: [], animations: { [weak self] in
self?.constrainKnob()
}, completion: nil)
}
}
//--------------------------------------------------
// MARK: - Labels
//--------------------------------------------------
private func updateLabel() {
stackView.spacing = showText ? VDSLayout.Spacing.space3X.value : 0
if stackView.subviews.contains(label) {
label.removeFromSuperview()
}
if showText {
label.textPosition = textPosition == .left ? .left : .right
label.textStyle = textStyle
label.text = isOn ? onText : offText
label.surface = surface
label.disabled = disabled
if textPosition == .left {
stackView.insertArrangedSubview(label, at: 0)
} else {
stackView.addArrangedSubview(label)
}
}
}
//--------------------------------------------------
// MARK: - Lifecycle
//--------------------------------------------------
@ -239,41 +143,33 @@ open class Toggle: Control, Changeable {
isAccessibilityElement = true
accessibilityTraits = .button
addSubview(stackView)
//set the h/w to container size, since the width "can" grow if text is there
//allow this to be greaterThanEqualTo
heightAnchor.constraint(equalToConstant: toggleContainerSize.height).isActive = true
widthAnchor.constraint(greaterThanOrEqualToConstant: toggleContainerSize.width).isActive = true
addSubview(label)
addSubview(toggleView)
//create the container for the toggle/knob
let toggleContainerView = UIView()
toggleContainerView.translatesAutoresizingMaskIntoConstraints = false
toggleContainerView.backgroundColor = .clear
toggleContainerView.widthAnchor.constraint(equalToConstant: toggleContainerSize.width).isActive = true
toggleContainerView.heightAnchor.constraint(equalToConstant: toggleContainerSize.height).isActive = true
let heightEqual = heightAnchor.constraint(equalToConstant: toggleContainerSize.height)
heightEqual.priority = .defaultLow
let heightGreater = heightAnchor.constraint(greaterThanOrEqualToConstant: toggleContainerSize.height)
heightGreater.priority = .defaultHigh
//adding views
toggleContainerView.addSubview(toggleView)
toggleView.addSubview(knobView)
stackView.addArrangedSubview(toggleContainerView)
// Set up initial constraints for label and switch
toggleView.centerYAnchor.constraint(equalTo: centerYAnchor).isActive = true
//adding constraints
toggleView.heightAnchor.constraint(equalToConstant: toggleSize.height).isActive = true
toggleView.widthAnchor.constraint(equalToConstant: toggleSize.width).isActive = true
toggleView.layer.cornerRadius = toggleSize.height / 2.0
toggleView.bottomAnchor.constraint(greaterThanOrEqualTo: knobView.bottomAnchor).isActive = true
toggleView.centerXAnchor.constraint(equalTo: toggleContainerView.centerXAnchor).isActive = true
toggleView.centerYAnchor.constraint(equalTo: toggleContainerView.centerYAnchor).isActive = true
labelConstraints = [
heightEqual, heightGreater,
label.widthAnchor.constraint(lessThanOrEqualToConstant: labelMaxWidth),
label.topAnchor.constraint(equalTo: topAnchor),
label.bottomAnchor.constraint(equalTo: bottomAnchor),
]
leftConstraints = [
toggleView.leadingAnchor.constraint(equalTo: label.trailingAnchor, constant: spacingBetween)
]
rightConstraints = [
label.leadingAnchor.constraint(equalTo: toggleView.trailingAnchor, constant: spacingBetween)
]
knobView.layer.cornerRadius = knobSize.height / 2.0
knobView.heightAnchor.constraint(equalToConstant: knobSize.height).isActive = true
knobView.widthAnchor.constraint(equalToConstant: knobSize.width).isActive = true
knobView.centerYAnchor.constraint(equalTo: toggleView.centerYAnchor).isActive = true
knobView.topAnchor.constraint(greaterThanOrEqualTo: toggleView.topAnchor).isActive = true
//pin stackview to edges
stackView.pinToSuperView()
}
open override func reset() {
@ -290,28 +186,83 @@ open class Toggle: Control, Changeable {
textPosition = .left
inputId = nil
value = nil
toggleView.backgroundColor = toggleColorConfiguration.getColor(self)
knobView.backgroundColor = knobColorConfiguration.getColor(self)
shouldUpdateView = true
setNeedsUpdate()
}
/// This will toggle the state of the Toggle and execute the actionBlock if provided.
/// This will toggle the state of the Toggle
open func toggle() {
isOn.toggle()
sendActions(for: .valueChanged)
}
//--------------------------------------------------
// MARK: - State
// MARK: - Labels
//--------------------------------------------------
private var showLabel: Bool {
showText && !statusText.isEmpty
}
private func updateLabel() {
label.isHidden = !showLabel
if showLabel {
label.textPosition = textPosition == .left ? .right : .left
label.textStyle = textStyle
label.text = statusText
label.surface = surface
label.disabled = disabled
switch textPosition {
case .left:
NSLayoutConstraint.deactivate(rightConstraints)
NSLayoutConstraint.activate(leftConstraints)
case .right:
NSLayoutConstraint.deactivate(leftConstraints)
NSLayoutConstraint.activate(rightConstraints)
}
NSLayoutConstraint.activate(labelConstraints)
} else {
NSLayoutConstraint.deactivate(leftConstraints)
NSLayoutConstraint.deactivate(rightConstraints)
NSLayoutConstraint.deactivate(labelConstraints)
}
invalidateIntrinsicContentSize()
}
//--------------------------------------------------
// MARK: - Overrides
//--------------------------------------------------
open override func updateView() {
updateLabel()
updateToggle()
toggleView.surface = surface
toggleView.disabled = disabled
toggleView.isOn = isOn
updateAccessibilityLabel()
}
open override func updateAccessibilityLabel() {
accessibilityValue = isSelected ? "1" : "0"
if !accessibilityTraits.contains(.selected) && isSelected {
accessibilityTraits.insert(.selected)
} else if accessibilityTraits.contains(.selected) && !isSelected{
accessibilityTraits.remove(.selected)
}
if !accessibilityTraits.contains(.notEnabled) && !isEnabled {
accessibilityTraits.insert(.notEnabled)
} else if accessibilityTraits.contains(.notEnabled) && !isEnabled{
accessibilityTraits.remove(.notEnabled)
}
setAccessibilityLabel(for: [label])
}
open override var intrinsicContentSize: CGSize {
if showLabel {
label.sizeToFit()
let size = CGSize(width: label.frame.width + spacingBetween + toggleContainerSize.width,
height: max(toggleContainerSize.height, label.frame.height))
return size
} else {
return toggleContainerSize
}
}
}

228
VDS/Components/Toggle/ToggleView.swift Normal file
View File

@ -0,0 +1,228 @@
//
// ToggleView.swift
// VDS
//
// Created by Matt Bruce on 7/19/23.
//
import Foundation
import UIKit
import VDSColorTokens
import Combine
/**
A custom implementation of Apple's UISwitch.
By default this class begins in the off state.
Container: The background of the toggle control.
Knob: The circular indicator that slides on the container.
*/
@objc(VDSToggleView)
open class ToggleView: Control, Changeable {
//--------------------------------------------------
// MARK: - Initializers
//--------------------------------------------------
required public init() {
super.init(frame: .zero)
}
public override init(frame: CGRect) {
super.init(frame: .zero)
}
public required init?(coder: NSCoder) {
super.init(coder: coder)
}
private var toggleView = UIView().with {
$0.translatesAutoresizingMaskIntoConstraints = false
$0.isUserInteractionEnabled = false
}
private var knobView = UIView().with {
$0.translatesAutoresizingMaskIntoConstraints = false
$0.backgroundColor = .white
$0.isUserInteractionEnabled = false
}
//--------------------------------------------------
// MARK: - Configuration Properties
//--------------------------------------------------
// Sizes are from InVision design specs.
public let toggleSize = CGSize(width: 52, height: 28)
public let knobSize = CGSize(width: 24, height: 24)
private var toggleColorConfiguration = ControlColorConfiguration().with {
$0.setSurfaceColors(VDSColor.elementsSecondaryOnlight, VDSColor.paletteGray44, forState: .normal)
$0.setSurfaceColors(VDSColor.interactiveDisabledOnlight, VDSColor.interactiveDisabledOndark, forState: .disabled)
$0.setSurfaceColors(VDSColor.interactiveDisabledOnlight, VDSColor.interactiveDisabledOndark, forState: [.selected, .disabled])
$0.setSurfaceColors(VDSColor.paletteGreen26, VDSColor.paletteGreen36, forState: .selected)
}
private var knobColorConfiguration = ControlColorConfiguration().with {
$0.setSurfaceColors(VDSColor.elementsPrimaryOndark, VDSColor.elementsPrimaryOndark, forState: .normal)
$0.setSurfaceColors(VDSColor.paletteGray95, VDSColor.paletteGray44, forState: .disabled)
$0.setSurfaceColors(VDSColor.paletteGray95, VDSColor.paletteGray44, forState: [.selected, .disabled])
$0.setSurfaceColors(VDSColor.elementsPrimaryOndark, VDSColor.elementsPrimaryOndark, forState: .selected)
}
//--------------------------------------------------
// MARK: - Public Properties
//--------------------------------------------------
public var onChangeSubscriber: AnyCancellable?
open var isOn: Bool {
get { isSelected }
set {
if isSelected != newValue {
isSelected = newValue
}
setNeedsUpdate()
}
}
open var isAnimated: Bool = true { didSet { setNeedsUpdate() }}
open var inputId: String? { didSet { setNeedsUpdate() }}
open var value: AnyHashable? { didSet { setNeedsUpdate() }}
//--------------------------------------------------
// MARK: - Constraints
//--------------------------------------------------
private var knobLeadingConstraint: NSLayoutConstraint?
private var knobTrailingConstraint: NSLayoutConstraint?
//--------------------------------------------------
// MARK: - Lifecycle
//--------------------------------------------------
open override func initialSetup() {
super.initialSetup()
onClick = { control in
control.toggle()
}
}
open override func setup() {
super.setup()
isAccessibilityElement = true
accessibilityTraits = .button
addSubview(toggleView)
toggleView.addSubview(knobView)
NSLayoutConstraint.activate([
toggleView.widthAnchor.constraint(equalToConstant: toggleSize.width),
toggleView.heightAnchor.constraint(equalToConstant: toggleSize.height),
toggleView.centerYAnchor.constraint(equalTo: centerYAnchor),
knobView.heightAnchor.constraint(equalToConstant: knobSize.height),
knobView.widthAnchor.constraint(equalToConstant: knobSize.width),
knobView.centerYAnchor.constraint(equalTo: toggleView.centerYAnchor),
knobView.topAnchor.constraint(greaterThanOrEqualTo: toggleView.topAnchor)
])
// Set cornerRadius
knobView.layer.cornerRadius = knobSize.height / 2.0
toggleView.layer.cornerRadius = toggleSize.height / 2.0
// Set content hugging priority
toggleView.setContentHuggingPriority(.required, for: .horizontal)
toggleView.setContentHuggingPriority(.required, for: .vertical)
setContentHuggingPriority(.required, for: .horizontal)
setContentHuggingPriority(.required, for: .vertical)
}
open override var intrinsicContentSize: CGSize { toggleSize }
open override func reset() {
super.reset()
shouldUpdateView = false
isOn = false
isAnimated = true
inputId = nil
value = nil
toggleView.backgroundColor = toggleColorConfiguration.getColor(self)
knobView.backgroundColor = knobColorConfiguration.getColor(self)
shouldUpdateView = true
setNeedsUpdate()
}
/// This will toggle the state of the Toggle and execute the actionBlock if provided.
open func toggle() {
isOn.toggle()
sendActions(for: .valueChanged)
}
//--------------------------------------------------
// MARK: - Toggle
//--------------------------------------------------
private func constrainKnob(){
self.knobLeadingConstraint?.isActive = false
self.knobTrailingConstraint?.isActive = false
if isOn {
knobTrailingConstraint = toggleView.trailingAnchor.constraint(equalTo: knobView.trailingAnchor, constant: 2)
knobLeadingConstraint = knobView.leadingAnchor.constraint(greaterThanOrEqualTo: toggleView.leadingAnchor)
} else {
knobTrailingConstraint = toggleView.trailingAnchor.constraint(greaterThanOrEqualTo: knobView.trailingAnchor)
knobLeadingConstraint = knobView.leadingAnchor.constraint(equalTo: toggleView.leadingAnchor, constant: 2)
}
knobTrailingConstraint?.isActive = true
knobLeadingConstraint?.isActive = true
self.layoutIfNeeded()
}
private func updateToggle() {
let toggleColor = toggleColorConfiguration.getColor(self)
let knobColor = knobColorConfiguration.getColor(self)
if disabled || !isAnimated {
toggleView.backgroundColor = toggleColor
knobView.backgroundColor = knobColor
constrainKnob()
} else {
UIView.animate(withDuration: 0.2, delay: 0.0, options: .curveEaseIn, animations: {
self.toggleView.backgroundColor = toggleColor
self.knobView.backgroundColor = knobColor
}, completion: nil)
UIView.animate(withDuration: 0.33, delay: 0, usingSpringWithDamping: 0.7, initialSpringVelocity: 0.5, options: [], animations: { [weak self] in
self?.constrainKnob()
}, completion: nil)
}
}
//--------------------------------------------------
// MARK: - Overrides
//--------------------------------------------------
open override func updateView() {
updateToggle()
updateAccessibilityLabel()
}
open override func updateAccessibilityLabel() {
accessibilityLabel = "Toggle"
accessibilityValue = isSelected ? "1" : "0"
if !accessibilityTraits.contains(.selected) && isSelected {
accessibilityTraits.insert(.selected)
} else if accessibilityTraits.contains(.selected) && !isSelected{
accessibilityTraits.remove(.selected)
}
if !accessibilityTraits.contains(.notEnabled) && !isEnabled {
accessibilityTraits.insert(.notEnabled)
} else if accessibilityTraits.contains(.notEnabled) && !isEnabled{
accessibilityTraits.remove(.notEnabled)
}
}
}
// MARK: AppleGuidlinesTouchable
extension ToggleView: AppleGuidlinesTouchable {
override open func point(inside point: CGPoint, with event: UIEvent?) -> Bool {
Self.acceptablyOutsideBounds(point: point, bounds: bounds)
}
}

16
VDS/Components/Tooltip/Tooltip.swift
View File

@ -53,9 +53,9 @@ open class Tooltip: Control, TooltipLaunchable {
open var title: String? { didSet { setNeedsUpdate() }}
open var content: String? { didSet { setNeedsUpdate() }}
open var contentView: UIView? { didSet { setNeedsUpdate() }}
//--------------------------------------------------
// MARK: - Configuration
//--------------------------------------------------
@ -87,7 +87,7 @@ open class Tooltip: Control, TooltipLaunchable {
$0.setSurfaceColors(VDSColor.elementsBrandhighlight, VDSColor.elementsBrandhighlight, forState: .normal)
$0.setSurfaceColors(VDSColor.elementsBrandhighlight, VDSColor.elementsBrandhighlight, forState: .highlighted)
$0.setSurfaceColors(VDSColor.interactiveDisabledOnlight, VDSColor.interactiveDisabledOndark, forState: .disabled)
}
}
//--------------------------------------------------
// MARK: - Initializers
@ -163,6 +163,14 @@ open class Tooltip: Control, TooltipLaunchable {
//get the color for the image
let imageColor = iconColorConfiguration.getColor(self)
imageView.image = infoImage.withTintColor(imageColor)
}
open override func updateAccessibilityLabel() {
if !accessibilityTraits.contains(.notEnabled) && !isEnabled {
accessibilityTraits.insert(.notEnabled)
} else if accessibilityTraits.contains(.notEnabled) && !isEnabled {
accessibilityTraits.remove(.notEnabled)
}
var label = title
if label == nil {
label = content
@ -171,9 +179,9 @@ open class Tooltip: Control, TooltipLaunchable {
accessibilityLabel = "Tooltip: \(label)"
}
}
}
// MARK: AppleGuidlinesTouchable
extension Tooltip: AppleGuidlinesTouchable {

4
VDS/Protocols/Changeable.swift
View File

@ -17,14 +17,12 @@ extension Changeable {
public var onChange: ((Self) -> ())? {
get { return nil }
set {
onChangeSubscriber?.cancel()
if let newValue {
onChangeSubscriber = publisher(for: .valueChanged)
.sink { c in
newValue(c)
}
} else {
onChangeSubscriber?.cancel()
onChangeSubscriber = nil
}
}
}