moved underneath tabs class
Signed-off-by: Matt Bruce <matt.bruce@verizon.com>
This commit is contained in:
Matt Bruce
parent
38aff5a637
commit
1205fc7fad
@ -9,132 +9,164 @@ import Foundation
|
|||||||
import VDSColorTokens
|
import VDSColorTokens
|
||||||
import Combine
|
import Combine
|
||||||
|
|
||||||
public class TabItem: View {
|
extension Tabs {
|
||||||
|
|
||||||
//--------------------------------------------------
|
open class TabItem: View {
|
||||||
// MARK: - Public Properties
|
//--------------------------------------------------
|
||||||
//--------------------------------------------------
|
// MARK: - Public Properties
|
||||||
public var label: Label = Label()
|
//--------------------------------------------------
|
||||||
public var orientation: Tabs.Orientation = .horizontal { didSet { setNeedsUpdate() } }
|
///position of the tab
|
||||||
public var size: Tabs.Size = .medium { didSet { setNeedsUpdate() } }
|
open var index: Int = 0
|
||||||
public var indicatorPosition: Tabs.IndicatorPosition = .bottom { didSet { setNeedsUpdate() } }
|
|
||||||
public var onClick: (() -> Void)? { didSet { setNeedsUpdate() } }
|
|
||||||
public var width: CGFloat? { didSet { setNeedsUpdate() } }
|
|
||||||
public var selected: Bool = false { didSet { setNeedsUpdate() } }
|
|
||||||
public var text: String? { didSet { setNeedsUpdate() } }
|
|
||||||
|
|
||||||
//--------------------------------------------------
|
///label to write out the text
|
||||||
// MARK: - Private Properties
|
open var label: Label = Label()
|
||||||
//--------------------------------------------------
|
|
||||||
private var labelWidthConstraint: NSLayoutConstraint?
|
|
||||||
private var labelLeadingConstraint: NSLayoutConstraint?
|
|
||||||
private var labelTopConstraint: NSLayoutConstraint?
|
|
||||||
private var labelBottomConstraint: NSLayoutConstraint?
|
|
||||||
|
|
||||||
//--------------------------------------------------
|
///orientation of the tabs
|
||||||
// MARK: - Configuration
|
open var orientation: Tabs.Orientation = .horizontal { didSet { setNeedsUpdate() } }
|
||||||
//--------------------------------------------------
|
|
||||||
private var textColorConfiguration: SurfaceColorConfiguration { selected ? textColorSelectedConfiguration : textColorNonSelectedConfiguration }
|
|
||||||
private var textColorNonSelectedConfiguration = SurfaceColorConfiguration(VDSColor.elementsSecondaryOnlight , VDSColor.elementsSecondaryOnlight)
|
|
||||||
private var textColorSelectedConfiguration = SurfaceColorConfiguration(VDSColor.elementsPrimaryOnlight, VDSColor.elementsPrimaryOndark)
|
|
||||||
private var indicatorColorConfiguration = SurfaceColorConfiguration(VDSColor.paletteRed, VDSColor.elementsPrimaryOndark)
|
|
||||||
private var indicatorWidth: CGFloat = 4.0
|
|
||||||
|
|
||||||
//--------------------------------------------------
|
///Size for tab
|
||||||
// MARK: - Initializers
|
open var size: Tabs.Size = .medium { didSet { setNeedsUpdate() } }
|
||||||
//--------------------------------------------------
|
|
||||||
public override init(frame: CGRect) {
|
|
||||||
super.init(frame: frame)
|
|
||||||
}
|
|
||||||
|
|
||||||
public required init?(coder: NSCoder) {
|
///Text position left or center
|
||||||
fatalError("init(coder:) has not been implemented")
|
open var textPosition: TextPosition = .left { didSet { setNeedsUpdate() } }
|
||||||
}
|
|
||||||
|
|
||||||
required public convenience init() {
|
///Sets the Position of the Selected/Hover Border Accent for All Tabs.
|
||||||
self.init(frame: .zero)
|
open var indicatorPosition: Tabs.IndicatorPosition = .bottom { didSet { setNeedsUpdate() } }
|
||||||
}
|
|
||||||
|
|
||||||
//--------------------------------------------------
|
///An optional callback that is called when this Tab is clicked. Passes parameters (tabIndex).
|
||||||
// MARK: - Overrides
|
open var onClick: ((Int) -> Void)? { didSet { setNeedsUpdate() } }
|
||||||
//--------------------------------------------------
|
|
||||||
override public func setup() {
|
|
||||||
super.setup()
|
|
||||||
addSubview(label)
|
|
||||||
backgroundColor = .clear
|
|
||||||
label.backgroundColor = .clear
|
|
||||||
|
|
||||||
label.translatesAutoresizingMaskIntoConstraints = false
|
///If provided, it will set fixed width for this Tab.
|
||||||
label.pinTrailing()
|
open var width: CGFloat? { didSet { setNeedsUpdate() } }
|
||||||
|
|
||||||
labelTopConstraint = label.topAnchor.constraint(equalTo: topAnchor, constant: 0)
|
///If provided, it will set this Tab to the Active Tab on render.
|
||||||
labelTopConstraint?.isActive = true
|
open var selected: Bool = false { didSet { setNeedsUpdate() } }
|
||||||
|
|
||||||
labelBottomConstraint = label.bottomAnchor.constraint(equalTo: bottomAnchor, constant: 0)
|
///The text label of the tab.
|
||||||
labelBottomConstraint?.isActive = true
|
open var text: String? { didSet { setNeedsUpdate() } }
|
||||||
|
|
||||||
labelLeadingConstraint = label.leadingAnchor.constraint(equalTo: leadingAnchor, constant: 0)
|
///Minimum width for the tab
|
||||||
labelLeadingConstraint?.isActive = true
|
open var minWidth: CGFloat = 44.0 { didSet { setNeedsUpdate() } }
|
||||||
|
|
||||||
labelWidthConstraint = label.widthAnchor.constraint(greaterThanOrEqualToConstant: 44.0)
|
//--------------------------------------------------
|
||||||
labelWidthConstraint?.isActive = true
|
// MARK: - Private Properties
|
||||||
|
//--------------------------------------------------
|
||||||
|
private var labelWidthConstraint: NSLayoutConstraint?
|
||||||
|
private var labelLeadingConstraint: NSLayoutConstraint?
|
||||||
|
private var labelTopConstraint: NSLayoutConstraint?
|
||||||
|
private var labelBottomConstraint: NSLayoutConstraint?
|
||||||
|
|
||||||
publisher(for: UITapGestureRecognizer())
|
//--------------------------------------------------
|
||||||
.sink { [weak self] _ in
|
// MARK: - Configuration
|
||||||
self?.onClick?()
|
//--------------------------------------------------
|
||||||
}.store(in: &subscribers)
|
private var textColorConfiguration: SurfaceColorConfiguration { selected ? textColorSelectedConfiguration : textColorNonSelectedConfiguration }
|
||||||
|
private var textColorNonSelectedConfiguration = SurfaceColorConfiguration(VDSColor.elementsSecondaryOnlight , VDSColor.elementsSecondaryOnlight)
|
||||||
|
private var textColorSelectedConfiguration = SurfaceColorConfiguration(VDSColor.elementsPrimaryOnlight, VDSColor.elementsPrimaryOndark)
|
||||||
|
private var indicatorColorConfiguration = SurfaceColorConfiguration(VDSColor.paletteRed, VDSColor.elementsPrimaryOndark)
|
||||||
|
private var indicatorWidth: CGFloat = 4.0
|
||||||
|
|
||||||
}
|
//--------------------------------------------------
|
||||||
|
// MARK: - Initializers
|
||||||
public override func updateView() {
|
//--------------------------------------------------
|
||||||
if orientation == .horizontal {
|
public override init(frame: CGRect) {
|
||||||
label.textPosition = .center
|
super.init(frame: frame)
|
||||||
} else {
|
|
||||||
label.textPosition = .left
|
|
||||||
}
|
}
|
||||||
label.text = text
|
|
||||||
label.textStyle = size.textStyle
|
|
||||||
label.textColor = textColorConfiguration.getColor(self)
|
|
||||||
|
|
||||||
labelWidthConstraint?.isActive = false
|
public required init?(coder: NSCoder) {
|
||||||
if let width {
|
fatalError("init(coder:) has not been implemented")
|
||||||
labelWidthConstraint = label.widthAnchor.constraint(equalToConstant: width)
|
|
||||||
} else {
|
|
||||||
labelWidthConstraint = label.widthAnchor.constraint(greaterThanOrEqualToConstant: 44.0)
|
|
||||||
}
|
}
|
||||||
labelWidthConstraint?.isActive = true
|
|
||||||
|
|
||||||
var leadingSpace: CGFloat
|
required public convenience init() {
|
||||||
if orientation == .horizontal {
|
self.init(frame: .zero)
|
||||||
leadingSpace = 0
|
|
||||||
} else {
|
|
||||||
leadingSpace = size == .medium ? VDSLayout.Spacing.space4X.value : VDSLayout.Spacing.space6X.value
|
|
||||||
}
|
}
|
||||||
labelLeadingConstraint?.constant = leadingSpace
|
|
||||||
|
|
||||||
var otherSpace: CGFloat
|
//--------------------------------------------------
|
||||||
if orientation == .horizontal {
|
// MARK: - Overrides
|
||||||
otherSpace = size == .medium ? VDSLayout.Spacing.space3X.value : VDSLayout.Spacing.space4X.value
|
//--------------------------------------------------
|
||||||
} else {
|
open override func setup() {
|
||||||
otherSpace = VDSLayout.Spacing.space2X.value
|
super.setup()
|
||||||
|
addSubview(label)
|
||||||
|
backgroundColor = .clear
|
||||||
|
label.backgroundColor = .clear
|
||||||
|
|
||||||
|
label.translatesAutoresizingMaskIntoConstraints = false
|
||||||
|
label.pinTrailing()
|
||||||
|
|
||||||
|
labelTopConstraint = label.topAnchor.constraint(equalTo: topAnchor)
|
||||||
|
labelTopConstraint?.isActive = true
|
||||||
|
|
||||||
|
labelBottomConstraint = label.bottomAnchor.constraint(equalTo: bottomAnchor)
|
||||||
|
labelBottomConstraint?.isActive = true
|
||||||
|
|
||||||
|
labelLeadingConstraint = label.leadingAnchor.constraint(equalTo: leadingAnchor)
|
||||||
|
labelLeadingConstraint?.isActive = true
|
||||||
|
|
||||||
|
let layoutGuide = UILayoutGuide()
|
||||||
|
addLayoutGuide(layoutGuide)
|
||||||
|
|
||||||
|
|
||||||
|
labelWidthConstraint = layoutGuide.widthAnchor.constraint(greaterThanOrEqualToConstant: 44.0)
|
||||||
|
labelWidthConstraint?.isActive = true
|
||||||
|
|
||||||
|
//activate the constraints
|
||||||
|
NSLayoutConstraint.activate([layoutGuide.topAnchor.constraint(equalTo: topAnchor),
|
||||||
|
layoutGuide.bottomAnchor.constraint(equalTo: bottomAnchor),
|
||||||
|
layoutGuide.leadingAnchor.constraint(equalTo: leadingAnchor),
|
||||||
|
layoutGuide.trailingAnchor.constraint(equalTo: trailingAnchor)])
|
||||||
|
|
||||||
|
publisher(for: UITapGestureRecognizer())
|
||||||
|
.sink { [weak self] _ in
|
||||||
|
guard let self else { return }
|
||||||
|
self.onClick?(self.index)
|
||||||
|
}.store(in: &subscribers)
|
||||||
|
|
||||||
}
|
}
|
||||||
labelTopConstraint?.constant = otherSpace
|
|
||||||
labelBottomConstraint?.constant = -otherSpace
|
|
||||||
|
|
||||||
setNeedsLayout()
|
open override func updateView() {
|
||||||
}
|
label.text = text
|
||||||
|
label.textPosition = textPosition
|
||||||
public override func layoutSubviews() {
|
label.textStyle = size.textStyle
|
||||||
super.layoutSubviews()
|
label.textColor = textColorConfiguration.getColor(self)
|
||||||
|
labelWidthConstraint?.isActive = false
|
||||||
removeBorders()
|
if let width {
|
||||||
|
labelWidthConstraint = label.widthAnchor.constraint(equalToConstant: width)
|
||||||
if selected {
|
} else {
|
||||||
var indicator: UIRectEdge = .left
|
labelWidthConstraint = label.widthAnchor.constraint(greaterThanOrEqualToConstant: 44.0)
|
||||||
if orientation == .horizontal {
|
}
|
||||||
indicator = indicatorPosition.value
|
labelWidthConstraint?.isActive = true
|
||||||
|
|
||||||
|
var leadingSpace: CGFloat
|
||||||
|
if orientation == .horizontal {
|
||||||
|
leadingSpace = 0
|
||||||
|
} else {
|
||||||
|
leadingSpace = size == .medium ? VDSLayout.Spacing.space4X.value : VDSLayout.Spacing.space6X.value
|
||||||
|
}
|
||||||
|
labelLeadingConstraint?.constant = leadingSpace
|
||||||
|
|
||||||
|
var otherSpace: CGFloat
|
||||||
|
if orientation == .horizontal {
|
||||||
|
otherSpace = size == .medium ? VDSLayout.Spacing.space3X.value : VDSLayout.Spacing.space4X.value
|
||||||
|
} else {
|
||||||
|
otherSpace = VDSLayout.Spacing.space2X.value
|
||||||
|
}
|
||||||
|
labelTopConstraint?.constant = otherSpace
|
||||||
|
labelBottomConstraint?.constant = -otherSpace
|
||||||
|
|
||||||
|
setNeedsLayout()
|
||||||
|
}
|
||||||
|
|
||||||
|
open override func layoutSubviews() {
|
||||||
|
super.layoutSubviews()
|
||||||
|
|
||||||
|
removeBorders()
|
||||||
|
|
||||||
|
if selected {
|
||||||
|
var indicator: UIRectEdge = .left
|
||||||
|
if orientation == .horizontal {
|
||||||
|
indicator = indicatorPosition.value
|
||||||
|
}
|
||||||
|
addBorder(side: indicator, width: indicatorWidth, color: indicatorColorConfiguration.getColor(self), offset: 1)
|
||||||
}
|
}
|
||||||
addBorder(side: indicator, width: indicatorWidth, color: indicatorColorConfiguration.getColor(self))
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -7,14 +7,22 @@
|
|||||||
|
|
||||||
import Foundation
|
import Foundation
|
||||||
|
|
||||||
public struct TabModel {
|
extension Tabs {
|
||||||
public var text: String
|
public struct TabModel {
|
||||||
public var onClick: (() -> Void)?
|
|
||||||
public var width: CGFloat?
|
|
||||||
|
|
||||||
public init(text: String, onClick: (() -> Void)? = nil, width: CGFloat? = nil) {
|
///Text that goes in the Tab
|
||||||
self.text = text
|
public var text: String
|
||||||
self.onClick = onClick
|
|
||||||
self.width = width
|
///Click event when you click on a tab
|
||||||
|
public var onClick: ((Int) -> Void)?
|
||||||
|
|
||||||
|
///Width of the tab
|
||||||
|
public var width: CGFloat?
|
||||||
|
|
||||||
|
public init(text: String, onClick: ((Int) -> Void)? = nil, width: CGFloat? = nil) {
|
||||||
|
self.text = text
|
||||||
|
self.onClick = onClick
|
||||||
|
self.width = width
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user