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

refactor a Toggle to be the actual Toggle only

Browse Source 
refactor old Toggle + Label = ToggleItem

Signed-off-by: Matt Bruce <matt.bruce@verizon.com>
This commit is contained in:
Matt Bruce 2023-07-19 09:40:04 -05:00
parent 052a6fbe67
commit 900dfd21fc
4 changed files with 419 additions and 189 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
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 /* Toggle.swift in Sources */ = {isa = PBXBuildFile; fileRef = EA0D1C362A681CCE00E5C127 /* Toggle.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 */; };
@ -29,7 +30,7 @@
EA3361B8288B2AAA0071C351 /* ViewProtocol.swift in Sources */ = {isa = PBXBuildFile; fileRef = EA3361B7288B2AAA0071C351 /* ViewProtocol.swift */; };
EA3361BD288B2C760071C351 /* TypeAlias.swift in Sources */ = {isa = PBXBuildFile; fileRef = EA3361BC288B2C760071C351 /* TypeAlias.swift */; };
EA3361BF288B2EA60071C351 /* Handlerable.swift in Sources */ = {isa = PBXBuildFile; fileRef = EA3361BE288B2EA60071C351 /* Handlerable.swift */; };
EA3361C328902D960071C351 /* Toggle.swift in Sources */ = {isa = PBXBuildFile; fileRef = EA3361C228902D960071C351 /* Toggle.swift */; };
EA3361C328902D960071C351 /* ToggleItem.swift in Sources */ = {isa = PBXBuildFile; fileRef = EA3361C228902D960071C351 /* ToggleItem.swift */; };
EA3361C9289054C50071C351 /* Surfaceable.swift in Sources */ = {isa = PBXBuildFile; fileRef = EA3361C8289054C50071C351 /* Surfaceable.swift */; };
EA3362042891E14D0071C351 /* VerizonNHGeTX-Bold.otf in Resources */ = {isa = PBXBuildFile; fileRef = EA3362002891E14C0071C351 /* VerizonNHGeTX-Bold.otf */; };
EA3362052891E14D0071C351 /* VerizonNHGeDS-Bold.otf in Resources */ = {isa = PBXBuildFile; fileRef = EA3362012891E14D0071C351 /* VerizonNHGeDS-Bold.otf */; };
@ -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 /* Toggle.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = Toggle.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>"; };
@ -166,7 +168,7 @@
EA3361B7288B2AAA0071C351 /* ViewProtocol.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ViewProtocol.swift; sourceTree = "<group>"; };
EA3361BC288B2C760071C351 /* TypeAlias.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = TypeAlias.swift; sourceTree = "<group>"; };
EA3361BE288B2EA60071C351 /* Handlerable.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = Handlerable.swift; sourceTree = "<group>"; };
EA3361C228902D960071C351 /* Toggle.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = Toggle.swift; sourceTree = "<group>"; };
EA3361C228902D960071C351 /* ToggleItem.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ToggleItem.swift; sourceTree = "<group>"; };
EA3361C8289054C50071C351 /* Surfaceable.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = Surfaceable.swift; sourceTree = "<group>"; };
EA3362002891E14C0071C351 /* VerizonNHGeTX-Bold.otf */ = {isa = PBXFileReference; lastKnownFileType = file; path = "VerizonNHGeTX-Bold.otf"; sourceTree = "<group>"; };
EA3362012891E14D0071C351 /* VerizonNHGeDS-Bold.otf */ = {isa = PBXFileReference; lastKnownFileType = file; path = "VerizonNHGeDS-Bold.otf"; sourceTree = "<group>"; };
@ -432,7 +434,8 @@
EA3361A0288B1E6F0071C351 /* Toggle */ = {
isa = PBXGroup;
children = (
EA3361C228902D960071C351 /* Toggle.swift */,
EA0D1C362A681CCE00E5C127 /* Toggle.swift */,
EA3361C228902D960071C351 /* ToggleItem.swift */,
);
path = Toggle;
sourceTree = "<group>";
@ -880,7 +883,7 @@
EA89200428AECF4B006B9984 /* UITextField+Publisher.swift in Sources */,
EA5F86C82A1BD99100BC83E4 /* TabModel.swift in Sources */,
EA297A5729FB0A360031ED56 /* AppleGuidlinesTouchable.swift in Sources */,
EA3361C328902D960071C351 /* Toggle.swift in Sources */,
EA3361C328902D960071C351 /* ToggleItem.swift in Sources */,
EAF7F0A0289AB7EC00B287F5 /* View.swift in Sources */,
EA89201328B568D8006B9984 /* RadioBoxItem.swift in Sources */,
EAC9258C2911C9DE00091998 /* InputField.swift in Sources */,
@ -928,6 +931,7 @@
EA89200628B526D6006B9984 /* CheckboxGroup.swift in Sources */,
44604AD429CE186A00E62B51 /* NotificationButtonModel.swift in Sources */,
EAD8D2C128BFDE8B006EB6A6 /* UIGestureRecognizer+Publisher.swift in Sources */,
EA0D1C372A681CCE00E5C127 /* Toggle.swift in Sources */,
EAF7F0B9289C139800B287F5 /* ColorConfiguration.swift in Sources */,
EA3361BD288B2C760071C351 /* TypeAlias.swift in Sources */,
EAB1D2CF28ABEF2B00DAE764 /* Typography.swift in Sources */,

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

@ -1,8 +1,8 @@
//
// Toggle.swift
// ToggleView.swift
// VDS
//
// Created by Matt Bruce on 7/22/22.
// Created by Matt Bruce on 7/19/23.
//
import Foundation
@ -19,21 +19,7 @@ import Combine
*/
@objc(VDSToggle)
open class Toggle: Control, Changeable {
//--------------------------------------------------
// MARK: - Enums
//--------------------------------------------------
public enum TextSize: String, CaseIterable {
case small, large
}
public enum TextWeight: String, CaseIterable {
case regular, bold
}
public enum TextPosition: String, CaseIterable {
case left, right
}
//--------------------------------------------------
// MARK: - Initializers
//--------------------------------------------------
@ -48,32 +34,23 @@ open class Toggle: Control, Changeable {
public required init?(coder: NSCoder) {
super.init(coder: coder)
}
//--------------------------------------------------
// MARK: - Private Properties
//--------------------------------------------------
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
$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 toggleContainerSize = CGSize(width: 52, height: 44)
public let knobSize = CGSize(width: 24, height: 24)
private var toggleColorConfiguration = ControlColorConfiguration().with {
@ -89,41 +66,11 @@ open class Toggle: Control, Changeable {
$0.setSurfaceColors(VDSColor.paletteGray95, VDSColor.paletteGray44, forState: [.selected, .disabled])
$0.setSurfaceColors(VDSColor.elementsPrimaryOndark, VDSColor.elementsPrimaryOndark, forState: .selected)
}
private var textStyle: TextStyle {
if textSize == .small {
if textWeight == .bold {
return .boldBodySmall
} else {
return .bodySmall
}
} else {
if textWeight == .bold {
return .boldBodyLarge
} else {
return .bodyLarge
}
}
}
//--------------------------------------------------
// MARK: - Public Properties
//--------------------------------------------------
public var onChangeSubscriber: AnyCancellable? {
willSet {
if let onChangeSubscriber {
onChangeSubscriber.cancel()
}
}
}
open var label = Label().with {
$0.setContentCompressionResistancePriority(.required, for: .vertical)
$0.textColorConfiguration = ViewColorConfiguration().with {
$0.setSurfaceColors(VDSColor.elementsSecondaryOnlight, VDSColor.elementsSecondaryOndark, forDisabled: true)
$0.setSurfaceColors(VDSColor.elementsPrimaryOnlight, VDSColor.elementsPrimaryOndark, forDisabled: false)
}.eraseToAnyColorable()
}
public var onChangeSubscriber: AnyCancellable?
open var isOn: Bool {
get { isSelected }
@ -137,18 +84,6 @@ open class Toggle: Control, Changeable {
open var isAnimated: Bool = true { didSet { setNeedsUpdate() }}
open var showText: Bool = false { didSet { setNeedsUpdate() }}
open var onText: String = "On" { didSet { setNeedsUpdate() }}
open var offText: String = "Off" { didSet { setNeedsUpdate() }}
open var textSize: TextSize = .small { didSet { setNeedsUpdate() }}
open var textWeight: TextWeight = .regular { didSet { setNeedsUpdate() }}
open var textPosition: TextPosition = .left { didSet { setNeedsUpdate() }}
open var inputId: String? { didSet { setNeedsUpdate() }}
open var value: AnyHashable? { didSet { setNeedsUpdate() }}
@ -158,8 +93,68 @@ open class Toggle: Control, Changeable {
//--------------------------------------------------
private var knobLeadingConstraint: NSLayoutConstraint?
private var knobTrailingConstraint: NSLayoutConstraint?
//--------------------------------------------------
// MARK: - Lifecycle
//--------------------------------------------------
open override func initialSetup() {
super.initialSetup()
onClick = { control in
control.toggle()
}
}
//functions
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
//--------------------------------------------------
@ -197,121 +192,17 @@ open class Toggle: Control, Changeable {
}, 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
// MARK: - Overrides
//--------------------------------------------------
open override func initialSetup() {
super.initialSetup()
onClick = { control in
control.toggle()
}
}
open override func setup() {
super.setup()
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
//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
//adding views
toggleContainerView.addSubview(toggleView)
toggleView.addSubview(knobView)
stackView.addArrangedSubview(toggleContainerView)
//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
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() {
super.reset()
shouldUpdateView = false
label.reset()
isOn = false
isAnimated = true
showText = false
onText = "On"
offText = "Off"
textSize = .small
textWeight = .regular
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.
open func toggle() {
isOn.toggle()
sendActions(for: .valueChanged)
}
//--------------------------------------------------
// MARK: - State
//--------------------------------------------------
open override func updateView() {
updateLabel()
updateToggle()
updateAccessibilityLabel()
}
open override func updateAccessibilityLabel() {
accessibilityLabel = "Toggle"
accessibilityValue = isSelected ? "1" : "0"
if !accessibilityTraits.contains(.selected) && isSelected {
accessibilityTraits.insert(.selected)
@ -324,6 +215,14 @@ open class Toggle: Control, Changeable {
} else if accessibilityTraits.contains(.notEnabled) && !isEnabled{
accessibilityTraits.remove(.notEnabled)
}
setAccessibilityLabel(for: [label])
}
}
// MARK: AppleGuidlinesTouchable
extension Toggle: AppleGuidlinesTouchable {
override open func point(inside point: CGPoint, with event: UIEvent?) -> Bool {
Self.acceptablyOutsideBounds(point: point, bounds: bounds)
}
}

329
VDS/Components/Toggle/ToggleItem.swift Normal file
View File

@ -0,0 +1,329 @@
//
// Toggle.swift
// VDS
//
// Created by Matt Bruce on 7/22/22.
//
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(VDSToggleItem)
open class ToggleItem: Control, Changeable {
//--------------------------------------------------
// MARK: - Enums
//--------------------------------------------------
public enum TextSize: String, CaseIterable {
case small, large
}
public enum TextWeight: String, CaseIterable {
case regular, bold
}
public enum TextPosition: String, CaseIterable {
case left, right
}
//--------------------------------------------------
// 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)
}
//--------------------------------------------------
// MARK: - Private Properties
//--------------------------------------------------
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
}
//--------------------------------------------------
// 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 var textStyle: TextStyle {
if textSize == .small {
if textWeight == .bold {
return .boldBodySmall
} else {
return .bodySmall
}
} else {
if textWeight == .bold {
return .boldBodyLarge
} else {
return .bodyLarge
}
}
}
//--------------------------------------------------
// MARK: - Public Properties
//--------------------------------------------------
public var onChangeSubscriber: AnyCancellable? {
willSet {
if let onChangeSubscriber {
onChangeSubscriber.cancel()
}
}
}
open var label = Label().with {
$0.setContentCompressionResistancePriority(.required, for: .vertical)
$0.textColorConfiguration = ViewColorConfiguration().with {
$0.setSurfaceColors(VDSColor.elementsSecondaryOnlight, VDSColor.elementsSecondaryOndark, forDisabled: true)
$0.setSurfaceColors(VDSColor.elementsPrimaryOnlight, VDSColor.elementsPrimaryOndark, forDisabled: false)
}.eraseToAnyColorable()
}
open var isOn: Bool {
get { isSelected }
set {
if isSelected != newValue {
isSelected = newValue
}
setNeedsUpdate()
}
}
open var isAnimated: Bool = true { didSet { setNeedsUpdate() }}
open var showText: Bool = false { didSet { setNeedsUpdate() }}
open var onText: String = "On" { didSet { setNeedsUpdate() }}
open var offText: String = "Off" { didSet { setNeedsUpdate() }}
open var textSize: TextSize = .small { didSet { setNeedsUpdate() }}
open var textWeight: TextWeight = .regular { didSet { setNeedsUpdate() }}
open var textPosition: TextPosition = .left { didSet { setNeedsUpdate() }}
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
//--------------------------------------------------
open override func initialSetup() {
super.initialSetup()
onClick = { control in
control.toggle()
}
}
open override func setup() {
super.setup()
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
//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
//adding views
toggleContainerView.addSubview(toggleView)
toggleView.addSubview(knobView)
stackView.addArrangedSubview(toggleContainerView)
//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
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() {
super.reset()
shouldUpdateView = false
label.reset()
isOn = false
isAnimated = true
showText = false
onText = "On"
offText = "Off"
textSize = .small
textWeight = .regular
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.
open func toggle() {
isOn.toggle()
sendActions(for: .valueChanged)
}
//--------------------------------------------------
// MARK: - State
//--------------------------------------------------
open override func updateView() {
updateLabel()
updateToggle()
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])
}
}

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
}
}
}