Digital ACT-191 ONEAPP-7016 story: added header view and updated with week days
This commit is contained in:
vasavk
parent
ef80db9e73
commit
23831589f0
@ -25,6 +25,8 @@
|
||||
18FEA1AD2BDD137500A56439 /* CalendarIndicatorModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = 18FEA1AC2BDD137500A56439 /* CalendarIndicatorModel.swift */; };
|
||||
18FEA1B12BE0B69300A56439 /* CalendarLegendView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 18FEA1B02BE0B69300A56439 /* CalendarLegendView.swift */; };
|
||||
18FEA1B32BE0BC8700A56439 /* CalendarReusableView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 18FEA1B22BE0BC8700A56439 /* CalendarReusableView.swift */; };
|
||||
18FEA1B52BE0E63600A56439 /* Date+Extension.swift in Sources */ = {isa = PBXBuildFile; fileRef = 18FEA1B42BE0E63600A56439 /* Date+Extension.swift */; };
|
||||
18FEA1B72BE0EBFE00A56439 /* CalendarHeaderView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 18FEA1B62BE0EBFE00A56439 /* CalendarHeaderView.swift */; };
|
||||
445BA07829C07B3D0036A7C5 /* Notification.swift in Sources */ = {isa = PBXBuildFile; fileRef = 445BA07729C07B3D0036A7C5 /* Notification.swift */; };
|
||||
44604AD429CE186A00E62B51 /* NotificationButtonModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = 44604AD329CE186A00E62B51 /* NotificationButtonModel.swift */; };
|
||||
44604AD729CE196600E62B51 /* Line.swift in Sources */ = {isa = PBXBuildFile; fileRef = 44604AD629CE196600E62B51 /* Line.swift */; };
|
||||
@ -219,6 +221,8 @@
|
||||
18FEA1AC2BDD137500A56439 /* CalendarIndicatorModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CalendarIndicatorModel.swift; sourceTree = "<group>"; };
|
||||
18FEA1B02BE0B69300A56439 /* CalendarLegendView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CalendarLegendView.swift; sourceTree = "<group>"; };
|
||||
18FEA1B22BE0BC8700A56439 /* CalendarReusableView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CalendarReusableView.swift; sourceTree = "<group>"; };
|
||||
18FEA1B42BE0E63600A56439 /* Date+Extension.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = "Date+Extension.swift"; sourceTree = "<group>"; };
|
||||
18FEA1B62BE0EBFE00A56439 /* CalendarHeaderView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CalendarHeaderView.swift; sourceTree = "<group>"; };
|
||||
445BA07729C07B3D0036A7C5 /* Notification.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = Notification.swift; sourceTree = "<group>"; };
|
||||
44604AD329CE186A00E62B51 /* NotificationButtonModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = NotificationButtonModel.swift; sourceTree = "<group>"; };
|
||||
44604AD629CE196600E62B51 /* Line.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = Line.swift; sourceTree = "<group>"; };
|
||||
@ -433,6 +437,8 @@
|
||||
18FEA1AC2BDD137500A56439 /* CalendarIndicatorModel.swift */,
|
||||
18FEA1B02BE0B69300A56439 /* CalendarLegendView.swift */,
|
||||
18FEA1B22BE0BC8700A56439 /* CalendarReusableView.swift */,
|
||||
18FEA1B42BE0E63600A56439 /* Date+Extension.swift */,
|
||||
18FEA1B62BE0EBFE00A56439 /* CalendarHeaderView.swift */,
|
||||
);
|
||||
path = Calendar;
|
||||
sourceTree = "<group>";
|
||||
@ -1170,6 +1176,7 @@
|
||||
71FC86DE2B9738B900700965 /* SurfaceConfigurationValue.swift in Sources */,
|
||||
EA297A5529FB07760031ED56 /* TooltipLabelAttribute.swift in Sources */,
|
||||
EA985BEA29689B6D00F2FF2E /* TileletSubTitleModel.swift in Sources */,
|
||||
18FEA1B72BE0EBFE00A56439 /* CalendarHeaderView.swift in Sources */,
|
||||
EA3361C9289054C50071C351 /* Surfaceable.swift in Sources */,
|
||||
EAB5FEED2927E1B200998C17 /* ButtonGroupPositionLayout.swift in Sources */,
|
||||
EA4DB30228DCBCA500103EE3 /* Badge.swift in Sources */,
|
||||
@ -1239,6 +1246,7 @@
|
||||
5F21D7BF28DCEB3D003E7CD6 /* Useable.swift in Sources */,
|
||||
EAF7F0B7289C12A600B287F5 /* UITapGestureRecognizer.swift in Sources */,
|
||||
EA0D1C392A6AD4DF00E5C127 /* Typography+SpacingConfig.swift in Sources */,
|
||||
18FEA1B52BE0E63600A56439 /* Date+Extension.swift in Sources */,
|
||||
EAB2376629E9952D00AABE9A /* UIApplication.swift in Sources */,
|
||||
EAB5FED429267EB300998C17 /* UIView+NSLayoutConstraint.swift in Sources */,
|
||||
EAB2376829E9992800AABE9A /* TooltipAlertViewController.swift in Sources */,
|
||||
|
||||
@ -101,6 +101,15 @@ open class CalendarBase: View {
|
||||
return collectionView
|
||||
}()
|
||||
|
||||
//--------------------------------------------------
|
||||
// MARK: - Configuration
|
||||
//--------------------------------------------------
|
||||
internal var containerBorderColorConfiguration = SurfaceColorConfiguration(VDSColor.elementsPrimaryOnlight , VDSColor.elementsPrimaryOndark)
|
||||
internal var backgroundColorConfiguration = ControlColorConfiguration().with {
|
||||
$0.setSurfaceColors(VDSFormControlsColor.backgroundOnlight, VDSFormControlsColor.backgroundOndark, forState: .normal)
|
||||
$0.setSurfaceColors(VDSFormControlsColor.backgroundOnlight, VDSFormControlsColor.backgroundOndark, forState: .disabled)
|
||||
}
|
||||
|
||||
//--------------------------------------------------
|
||||
// MARK: - Lifecycle
|
||||
//--------------------------------------------------
|
||||
@ -122,7 +131,8 @@ open class CalendarBase: View {
|
||||
.width(containerSize.width)
|
||||
|
||||
containerView.centerXAnchor.constraint(equalTo: centerXAnchor).activate()
|
||||
|
||||
containerView.layer.borderWidth = VDSFormControls.borderWidth
|
||||
|
||||
// Calendar View
|
||||
containerView.addSubview(collectionView)
|
||||
collectionView.pinToSuperView()
|
||||
@ -131,6 +141,7 @@ open class CalendarBase: View {
|
||||
open override func updateView() {
|
||||
super.updateView()
|
||||
collectionView.reloadData()
|
||||
containerView.layer.borderColor = containerBorderColorConfiguration.getColor(self).cgColor
|
||||
}
|
||||
|
||||
override open func layoutSubviews() {
|
||||
|
||||
195
VDS/Components/Calendar/CalendarHeaderView.swift
Normal file
195
VDS/Components/Calendar/CalendarHeaderView.swift
Normal file
@ -0,0 +1,195 @@
|
||||
//
|
||||
// CalendarHeaderView.swift
|
||||
// VDS
|
||||
//
|
||||
// Created by Kanamarlapudi, Vasavi on 30/04/24.
|
||||
//
|
||||
|
||||
import Foundation
|
||||
import UIKit
|
||||
import VDSTokens
|
||||
|
||||
/// Header view to display month and year along with days of week
|
||||
open class CalendarHeaderView: View {
|
||||
//--------------------------------------------------
|
||||
// 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: - Public Properties
|
||||
//--------------------------------------------------
|
||||
|
||||
//--------------------------------------------------
|
||||
// MARK: - Private Properties
|
||||
//--------------------------------------------------
|
||||
internal var containerSize: CGSize { CGSize(width: 320, height: 104) } //width:320/328
|
||||
|
||||
private lazy var stackView = UIStackView().with {
|
||||
$0.translatesAutoresizingMaskIntoConstraints = false
|
||||
$0.distribution = .fill
|
||||
$0.spacing = VDSLayout.space1X
|
||||
$0.axis = .vertical
|
||||
$0.backgroundColor = .clear
|
||||
}
|
||||
|
||||
private lazy var monthHeaderStackView = UIStackView().with {
|
||||
$0.translatesAutoresizingMaskIntoConstraints = false
|
||||
$0.distribution = .fill
|
||||
$0.spacing = VDSLayout.space1X
|
||||
$0.axis = .horizontal
|
||||
$0.backgroundColor = .clear
|
||||
}
|
||||
|
||||
internal var containerView = View().with {
|
||||
$0.clipsToBounds = true
|
||||
$0.backgroundColor = .clear
|
||||
}
|
||||
internal var monthView = View()
|
||||
internal var daysView = View()
|
||||
internal let daysOfWeek = Date.capitalizedFirstLettersOfWeekdays
|
||||
|
||||
private lazy var daysCollectionView: UICollectionView = {
|
||||
let collectionView = UICollectionView(frame: .zero, collectionViewLayout: UICollectionViewFlowLayout())
|
||||
collectionView.isScrollEnabled = false
|
||||
collectionView.translatesAutoresizingMaskIntoConstraints = false
|
||||
collectionView.delegate = self
|
||||
collectionView.dataSource = self
|
||||
collectionView.showsHorizontalScrollIndicator = false
|
||||
collectionView.showsVerticalScrollIndicator = false
|
||||
collectionView.backgroundColor = .clear
|
||||
collectionView.register(collectionViewCell.self, forCellWithReuseIdentifier: collectionViewCell.identifier)
|
||||
return collectionView
|
||||
}()
|
||||
|
||||
//--------------------------------------------------
|
||||
// MARK: - Lifecycle
|
||||
//--------------------------------------------------
|
||||
open override func initialSetup() {
|
||||
super.initialSetup()
|
||||
}
|
||||
|
||||
open override func setup() {
|
||||
super.setup()
|
||||
isAccessibilityElement = false
|
||||
|
||||
// stackView
|
||||
addSubview(containerView)
|
||||
containerView
|
||||
.pinTop()
|
||||
.pinBottom()
|
||||
.pinLeadingGreaterThanOrEqualTo()
|
||||
.pinTrailingLessThanOrEqualTo()
|
||||
.height(containerSize.height)
|
||||
.width(containerSize.width)
|
||||
containerView.centerXAnchor.constraint(equalTo: centerXAnchor).activate()
|
||||
|
||||
// stackview
|
||||
containerView.addSubview(stackView)
|
||||
stackView
|
||||
.pinTop(VDSLayout.space4X)
|
||||
.pinLeading()
|
||||
.pinTrailing()
|
||||
.pinBottom(VDSLayout.space1X)
|
||||
|
||||
// month label view, previous and next buttons
|
||||
stackView.addArrangedSubview(monthView)
|
||||
monthView.backgroundColor = .orange
|
||||
monthView.heightAnchor.constraint(equalToConstant: 40).isActive = true
|
||||
|
||||
// days Collection View
|
||||
stackView.addArrangedSubview(daysCollectionView)
|
||||
daysCollectionView.widthAnchor.constraint(equalTo: widthAnchor).activate()
|
||||
daysCollectionView.heightAnchor.constraint(equalTo: monthView.heightAnchor).activate()
|
||||
print("daysOfWeek: \(daysOfWeek)")
|
||||
}
|
||||
|
||||
open override func updateView() {
|
||||
super.updateView()
|
||||
daysCollectionView.reloadData()
|
||||
}
|
||||
|
||||
override open func layoutSubviews() {
|
||||
super.layoutSubviews()
|
||||
}
|
||||
|
||||
open override func reset() {
|
||||
super.reset()
|
||||
}
|
||||
}
|
||||
|
||||
extension CalendarHeaderView: UICollectionViewDelegate, UICollectionViewDataSource, UICollectionViewDelegateFlowLayout {
|
||||
|
||||
public func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
|
||||
return daysOfWeek.count
|
||||
}
|
||||
|
||||
public func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
|
||||
guard let cell = collectionView.dequeueReusableCell(withReuseIdentifier: collectionViewCell.identifier, for: indexPath) as? collectionViewCell else { return UICollectionViewCell() }
|
||||
cell.updateTitle(text: daysOfWeek[indexPath.row], surface: surface)
|
||||
return cell
|
||||
}
|
||||
|
||||
public func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
|
||||
return CGSize(width: 40, height: 40)
|
||||
}
|
||||
|
||||
public func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAt section: Int) -> CGFloat {
|
||||
return VDSLayout.space1X
|
||||
}
|
||||
|
||||
public func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumInteritemSpacingForSectionAt section: Int) -> CGFloat {
|
||||
return VDSLayout.space1X
|
||||
}
|
||||
}
|
||||
|
||||
private class collectionViewCell: UICollectionViewCell {
|
||||
|
||||
static let identifier: String = String(describing: collectionViewCell.self)
|
||||
|
||||
private let textColorConfiguration = SurfaceColorConfiguration(VDSColor.elementsSecondaryOnlight, VDSColor.elementsSecondaryOndark)
|
||||
|
||||
private var title = Label().with {
|
||||
$0.translatesAutoresizingMaskIntoConstraints = false
|
||||
$0.textAlignment = .center
|
||||
$0.numberOfLines = 1
|
||||
$0.textStyle = .bodySmall
|
||||
$0.backgroundColor = .clear
|
||||
$0.isAccessibilityElement = false
|
||||
}
|
||||
|
||||
//--------------------------------------------------
|
||||
// MARK: - Initializers
|
||||
//--------------------------------------------------
|
||||
override init(frame: CGRect) {
|
||||
super.init(frame: frame)
|
||||
setupCell()
|
||||
}
|
||||
|
||||
required init?(coder: NSCoder) {
|
||||
super.init(coder: coder)
|
||||
setupCell()
|
||||
}
|
||||
|
||||
func setupCell() {
|
||||
addSubview(title)
|
||||
title.pinToSuperView()
|
||||
}
|
||||
|
||||
func updateTitle(text: String, surface: Surface) {
|
||||
title.surface = surface
|
||||
title.text = text
|
||||
title.textColor = textColorConfiguration.getColor(surface)
|
||||
title.backgroundColor = .clear
|
||||
}
|
||||
}
|
||||
@ -14,6 +14,8 @@ class CalendarHeaderReusableView: UICollectionReusableView {
|
||||
///Identifier for the Calendar Header Reusable View
|
||||
static let identifier: String = String(describing: CalendarHeaderReusableView.self)
|
||||
|
||||
private lazy var headerView = CalendarHeaderView()
|
||||
|
||||
override init(frame: CGRect) {
|
||||
super.init(frame: frame)
|
||||
}
|
||||
@ -23,7 +25,7 @@ class CalendarHeaderReusableView: UICollectionReusableView {
|
||||
}
|
||||
|
||||
func configure(with color: Bool) {
|
||||
// Make a view and make in generic and dynamic
|
||||
addSubview(headerView)
|
||||
}
|
||||
|
||||
override func layoutSubviews() {
|
||||
|
||||
20
VDS/Components/Calendar/Date+Extension.swift
Normal file
20
VDS/Components/Calendar/Date+Extension.swift
Normal file
@ -0,0 +1,20 @@
|
||||
//
|
||||
// Date+Extension.swift
|
||||
// VDS
|
||||
//
|
||||
// Created by Kanamarlapudi, Vasavi on 26/04/24.
|
||||
//
|
||||
|
||||
import Foundation
|
||||
|
||||
extension Date {
|
||||
static var capitalizedFirstLettersOfWeekdays: [String] {
|
||||
let calendar = Calendar.current
|
||||
let weekdays = calendar.shortWeekdaySymbols
|
||||
|
||||
return weekdays.map { weekday in
|
||||
guard let firstLetter = weekday.first else { return "" }
|
||||
return String(firstLetter).capitalized
|
||||
}
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user