From 0f655b534eeeb873dfe22f32d4db3a5480cf9053 Mon Sep 17 00:00:00 2001 From: Lekshmi S Date: Wed, 16 Sep 2020 18:46:26 +0530 Subject: [PATCH 1/8] Initial commit for MOBFIRST-22354 Star story. --- MVMCoreUI.xcodeproj/project.pbxproj | 8 ++ MVMCoreUI/Atomic/Atoms/Views/Star.swift | 111 +++++++++++++++++++ MVMCoreUI/Atomic/Atoms/Views/StarModel.swift | 65 +++++++++++ MVMCoreUI/Atomic/MoleculeObjectMapping.swift | 2 +- 4 files changed, 185 insertions(+), 1 deletion(-) create mode 100644 MVMCoreUI/Atomic/Atoms/Views/Star.swift create mode 100644 MVMCoreUI/Atomic/Atoms/Views/StarModel.swift diff --git a/MVMCoreUI.xcodeproj/project.pbxproj b/MVMCoreUI.xcodeproj/project.pbxproj index b67f6235..14152a0b 100644 --- a/MVMCoreUI.xcodeproj/project.pbxproj +++ b/MVMCoreUI.xcodeproj/project.pbxproj @@ -199,6 +199,8 @@ 94CA227D24058534002D6750 /* VerizonNHGeDS-Regular.otf in Resources */ = {isa = PBXBuildFile; fileRef = 94CA227924058533002D6750 /* VerizonNHGeDS-Regular.otf */; }; 94CA227E24058534002D6750 /* VerizonNHGeDS-Bold.otf in Resources */ = {isa = PBXBuildFile; fileRef = 94CA227A24058533002D6750 /* VerizonNHGeDS-Bold.otf */; }; 94F6516D2437954100631BF9 /* Tabs.swift in Sources */ = {isa = PBXBuildFile; fileRef = 94F6516C2437954100631BF9 /* Tabs.swift */; }; + AA07EA912510A442009A2AE3 /* StarModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = AA07EA902510A442009A2AE3 /* StarModel.swift */; }; + AA07EA932510A451009A2AE3 /* Star.swift in Sources */ = {isa = PBXBuildFile; fileRef = AA07EA922510A451009A2AE3 /* Star.swift */; }; AA0A257824766C8A00862F64 /* ListLeftVariableIconWithRightCaretBodyTextModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = AA0A257724766C8A00862F64 /* ListLeftVariableIconWithRightCaretBodyTextModel.swift */; }; AA0A257A24766CA200862F64 /* ListLeftVariableIconWithRightCaretBodyText.swift in Sources */ = {isa = PBXBuildFile; fileRef = AA0A257924766CA200862F64 /* ListLeftVariableIconWithRightCaretBodyText.swift */; }; AA104AC724472DB0004D2810 /* HeadersH1Button.swift in Sources */ = {isa = PBXBuildFile; fileRef = AA104AC624472DB0004D2810 /* HeadersH1Button.swift */; }; @@ -687,6 +689,8 @@ 94CA227A24058533002D6750 /* VerizonNHGeDS-Bold.otf */ = {isa = PBXFileReference; lastKnownFileType = file; path = "VerizonNHGeDS-Bold.otf"; sourceTree = ""; }; 94CA227B24058533002D6750 /* VerizonNHGeTX-Regular.otf */ = {isa = PBXFileReference; lastKnownFileType = file; path = "VerizonNHGeTX-Regular.otf"; sourceTree = ""; }; 94F6516C2437954100631BF9 /* Tabs.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = Tabs.swift; sourceTree = ""; }; + AA07EA902510A442009A2AE3 /* StarModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = StarModel.swift; sourceTree = ""; }; + AA07EA922510A451009A2AE3 /* Star.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = Star.swift; sourceTree = ""; }; AA0A257724766C8A00862F64 /* ListLeftVariableIconWithRightCaretBodyTextModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ListLeftVariableIconWithRightCaretBodyTextModel.swift; sourceTree = ""; }; AA0A257924766CA200862F64 /* ListLeftVariableIconWithRightCaretBodyText.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ListLeftVariableIconWithRightCaretBodyText.swift; sourceTree = ""; }; AA104AC624472DB0004D2810 /* HeadersH1Button.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = HeadersH1Button.swift; sourceTree = ""; }; @@ -1875,6 +1879,8 @@ D20492A524329CE200A5EED6 /* LoadImageView.swift */, 0A51F3E02475CB73002E08B6 /* LoadingSpinnerModel.swift */, 0A51F3E12475CB73002E08B6 /* LoadingSpinner.swift */, + AA07EA902510A442009A2AE3 /* StarModel.swift */, + AA07EA922510A451009A2AE3 /* Star.swift */, ); path = Views; sourceTree = ""; @@ -2306,6 +2312,7 @@ AA1EC59724373985003D6F50 /* ListThreeColumnSpeedTestDividerModel.swift in Sources */, BB1D17E0244EAA30001D2002 /* ListDeviceComplexButtonMediumModel.swift in Sources */, D2CAC7D3251105A700C75681 /* MVMCoreUITopAlertExpandableView+Extension.swift in Sources */, + AA07EA932510A451009A2AE3 /* Star.swift in Sources */, D29DF2CF21E7C104003B2FB9 /* MFLoadingViewController.m in Sources */, D28A837B23C928DA00DFE4FC /* MoleculeListCellProtocol.swift in Sources */, D28BA74D248589C800B75CB8 /* TabPageModelProtocol.swift in Sources */, @@ -2569,6 +2576,7 @@ BB2BF0EC2452A9D5001D0FC2 /* ListDeviceComplexButtonSmallModel.swift in Sources */, 943784F6236B77BB006A1E82 /* WheelAnimationHandler.swift in Sources */, 011D95A1240453D0000E3791 /* RuleEqualsModel.swift in Sources */, + AA07EA912510A442009A2AE3 /* StarModel.swift in Sources */, D29DF2AA21E7B2F9003B2FB9 /* MVMCoreUIConstants.m in Sources */, 011D95892404249B000E3791 /* FormHolderModelProtocol.swift in Sources */, BB54C5202434D92F0038326C /* ListRightVariableButtonAllTextAndLinks.swift in Sources */, diff --git a/MVMCoreUI/Atomic/Atoms/Views/Star.swift b/MVMCoreUI/Atomic/Atoms/Views/Star.swift new file mode 100644 index 00000000..c0cd6f56 --- /dev/null +++ b/MVMCoreUI/Atomic/Atoms/Views/Star.swift @@ -0,0 +1,111 @@ +// +// Star.swift +// MVMCoreUI +// +// Created by Lekshmi S on 15/09/20. +// Copyright © 2020 Verizon Wireless. All rights reserved. +// + +import Foundation + +@objcMembers open class Star: View { + + //-------------------------------------------------- + // MARK: - Properties + //-------------------------------------------------- + private var starLayer: CAShapeLayer? + let maskLayer = CAShapeLayer() + + var starModel: StarModel? + var progressBar = ProgressBar(frame: CGRect(x: 0, y: 0, width: 30, height: 30)) + + //-------------------------------------------------- + // MARK: - Constraints + //-------------------------------------------------- + public var widthConstraint: NSLayoutConstraint? + public var heightConstraint: NSLayoutConstraint? + + //------------------------------------------------------ + // MARK: - State Handling + //------------------------------------------------------ + + open override func draw(_ rect: CGRect) { + //Draw the heart + starLayer?.removeFromSuperlayer() + let star = drawStar() + layer.addSublayer(star) + starLayer = star + + //Mask the star + maskLayer.removeFromSuperlayer() + maskLayer.path = star.path + self.layer.mask = maskLayer + } + + func drawStar() -> CAShapeLayer { + let shapeLayer = CAShapeLayer() + shapeLayer.frame = self.bounds + let starPath = UIBezierPath() + let center = shapeLayer.position + let theta = .pi / CGFloat(5.0) + let outerRadius = center.x * 1.039 + let excessRadius = outerRadius - center.x + let innerRadius = CGFloat(outerRadius * 0.382) + let leftEdgePointX = (center.x + cos(4.0 * theta) * outerRadius) + excessRadius + let horizontalOffset = leftEdgePointX / 2.0 + let offsetCenter = CGPoint(x: center.x - horizontalOffset, y: center.y) + for i in 0 ..< 10 { + let radius = i % 2 == 0 ? outerRadius : innerRadius + let pointX = offsetCenter.x + cos(CGFloat(i) * theta) * radius + let pointY = offsetCenter.y + sin(CGFloat(i) * theta) * radius + let point = CGPoint(x: pointX, y: pointY) + if i == 0 { + starPath.move(to: point) + } else { + starPath.addLine(to: point) + } + } + starPath.close() + // Rotate the path so the star points up as expected + var pathTransform = CGAffineTransform.identity + pathTransform = pathTransform.translatedBy(x: center.x, y: center.y) + pathTransform = pathTransform.rotated(by: CGFloat(-.pi / 2.0)) + pathTransform = pathTransform.translatedBy(x: -center.x, y: -center.y) + starPath.apply(pathTransform) + shapeLayer.path = starPath.cgPath + shapeLayer.fillColor = UIColor.clear.cgColor + shapeLayer.opacity = 1.0 + shapeLayer.lineWidth = 1 + shapeLayer.strokeColor = starModel?.borderColor.cgColor + return shapeLayer + } + + //-------------------------------------------------- + // MARK: - Lifecycle + //-------------------------------------------------- + open override func setupView() { + super.setupView() + addSubview(progressBar) + NSLayoutConstraint.constraintPinSubview(toSuperview: progressBar) + } + + public override func set(with model: MoleculeModelProtocol, _ delegateObject: MVMCoreUIDelegateObject?, _ additionalData: [AnyHashable: Any]?) { + super.set(with: model, delegateObject, additionalData) + guard let model = model as? StarModel else { return } + self.starModel = model + progressBar.progress = Float((model.percent) / 100.0) + progressBar.progressTintColor = model.fillColor.uiColor + progressBar.trackTintColor = .mvmWhite + setSizeForProgressBar(size: model.size) + } + + func setSizeForProgressBar(size: CGFloat) { + progressBar.transform = progressBar.transform.scaledBy(x: 1, y: size/9) + progressBar.transform = progressBar.transform.translatedBy(x: 0, y: -3.5) + widthConstraint = widthAnchor.constraint(equalToConstant: size) + widthConstraint?.isActive = true + heightConstraint = heightAnchor.constraint(equalTo: widthAnchor, multiplier: 1) + heightConstraint?.isActive = true + setNeedsDisplay() + } +} diff --git a/MVMCoreUI/Atomic/Atoms/Views/StarModel.swift b/MVMCoreUI/Atomic/Atoms/Views/StarModel.swift new file mode 100644 index 00000000..402ada9a --- /dev/null +++ b/MVMCoreUI/Atomic/Atoms/Views/StarModel.swift @@ -0,0 +1,65 @@ +// +// StarModel.swift +// MVMCoreUI +// +// Created by Lekshmi S on 15/09/20. +// Copyright © 2020 Verizon Wireless. All rights reserved. +// + +import Foundation + +open class StarModel: MoleculeModelProtocol { + + //-------------------------------------------------- + // MARK: - Properties + //-------------------------------------------------- + public static var identifier: String = "star" + public var backgroundColor: Color? + @Percent public var percent: CGFloat = 0 + public var borderColor: Color = Color(uiColor: .mvmBlack) + public var fillColor: Color = Color(uiColor: .mvmBlack) + public var size: CGFloat = 30.0 + + //-------------------------------------------------- + // MARK: - Keys + //-------------------------------------------------- + private enum CodingKeys: String, CodingKey { + case moleculeName + case backgroundColor + case percent + case borderColor + case fillColor + case size + } + + //-------------------------------------------------- + // MARK: - Codec + //-------------------------------------------------- + required public init(from decoder: Decoder) throws { + let typeContainer = try decoder.container(keyedBy: CodingKeys.self) + + if let percent = try typeContainer.decodeIfPresent(CGFloat.self, forKey: .percent) { + self.percent = percent + } + backgroundColor = try typeContainer.decodeIfPresent(Color.self, forKey: .backgroundColor) + if let borderColor = try typeContainer.decodeIfPresent(Color.self, forKey: .borderColor) { + self.borderColor = borderColor + } + if let fillColor = try typeContainer.decodeIfPresent(Color.self, forKey: .fillColor) { + self.fillColor = fillColor + } + if let size = try typeContainer.decodeIfPresent(CGFloat.self, forKey: .size) { + self.size = size + } + } + + public func encode(to encoder: Encoder) throws { + var container = encoder.container(keyedBy: CodingKeys.self) + try container.encodeIfPresent(backgroundColor, forKey: .backgroundColor) + try container.encode(moleculeName, forKey: .moleculeName) + try container.encodeIfPresent(percent, forKey: .percent) + try container.encodeIfPresent(borderColor, forKey: .borderColor) + try container.encodeIfPresent(fillColor, forKey: .fillColor) + try container.encodeIfPresent(size, forKey: .size) + } +} diff --git a/MVMCoreUI/Atomic/MoleculeObjectMapping.swift b/MVMCoreUI/Atomic/MoleculeObjectMapping.swift index a598b113..a2dc068f 100644 --- a/MVMCoreUI/Atomic/MoleculeObjectMapping.swift +++ b/MVMCoreUI/Atomic/MoleculeObjectMapping.swift @@ -87,7 +87,7 @@ import Foundation MoleculeObjectMapping.shared()?.register(viewClass: RadioSwatches.self, viewModelClass: RadioSwatchesModel.self) MoleculeObjectMapping.shared()?.register(viewClass: Tags.self, viewModelClass: TagsModel.self) MoleculeObjectMapping.shared()?.register(viewClass: Tag.self, viewModelClass: TagModel.self) - + MoleculeObjectMapping.shared()?.register(viewClass: Star.self, viewModelClass: StarModel.self) // MARK:- Other Atoms From 25b88d47583251523bfd7cf6bd77975733de0f19 Mon Sep 17 00:00:00 2001 From: Lekshmi S Date: Thu, 24 Sep 2020 21:45:31 +0530 Subject: [PATCH 2/8] StarsModel and molecule class commit. --- MVMCoreUI.xcodeproj/project.pbxproj | 12 ++ MVMCoreUI/Atomic/Atoms/Views/Star.swift | 16 +- .../Atoms/Views/StarCollectionViewCell.swift | 24 +++ MVMCoreUI/Atomic/Atoms/Views/Stars.swift | 155 ++++++++++++++++++ MVMCoreUI/Atomic/Atoms/Views/StarsModel.swift | 72 ++++++++ MVMCoreUI/Atomic/MoleculeObjectMapping.swift | 1 + 6 files changed, 271 insertions(+), 9 deletions(-) create mode 100644 MVMCoreUI/Atomic/Atoms/Views/StarCollectionViewCell.swift create mode 100644 MVMCoreUI/Atomic/Atoms/Views/Stars.swift create mode 100644 MVMCoreUI/Atomic/Atoms/Views/StarsModel.swift diff --git a/MVMCoreUI.xcodeproj/project.pbxproj b/MVMCoreUI.xcodeproj/project.pbxproj index 14152a0b..177a69d3 100644 --- a/MVMCoreUI.xcodeproj/project.pbxproj +++ b/MVMCoreUI.xcodeproj/project.pbxproj @@ -219,6 +219,8 @@ AA2AD118244EE48C00BBFFE3 /* ListDeviceComplexLinkMediumModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = AA2AD117244EE48C00BBFFE3 /* ListDeviceComplexLinkMediumModel.swift */; }; AA3561AC24C9684400452EB1 /* ListRightVariableRightCaretAllTextAndLinksModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = AA3561AB24C9684400452EB1 /* ListRightVariableRightCaretAllTextAndLinksModel.swift */; }; AA3561AE24C96B9000452EB1 /* ListRightVariableRightCaretAllTextAndLinks.swift in Sources */ = {isa = PBXBuildFile; fileRef = AA3561AD24C96B9000452EB1 /* ListRightVariableRightCaretAllTextAndLinks.swift */; }; + AA37CBD3251907200027344C /* StarsModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = AA37CBD2251907200027344C /* StarsModel.swift */; }; + AA37CBD52519072F0027344C /* Stars.swift in Sources */ = {isa = PBXBuildFile; fileRef = AA37CBD42519072F0027344C /* Stars.swift */; }; AA45AA0B24BF0263007A6EA7 /* LockUpsPlanNamesModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = AA45AA0A24BF0263007A6EA7 /* LockUpsPlanNamesModel.swift */; }; AA45AA0D24BF0276007A6EA7 /* LockUpsPlanNames.swift in Sources */ = {isa = PBXBuildFile; fileRef = AA45AA0C24BF0276007A6EA7 /* LockUpsPlanNames.swift */; }; AA56A20F243C5EE900303286 /* ListTwoColumnSubsectionDividerModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = AA56A20E243C5EE900303286 /* ListTwoColumnSubsectionDividerModel.swift */; }; @@ -233,6 +235,7 @@ AA71AD4024A32FE700ACA76F /* HeadersH2Link.swift in Sources */ = {isa = PBXBuildFile; fileRef = AA71AD3F24A32FE700ACA76F /* HeadersH2Link.swift */; }; AA7F32AB246C0F7900C965BA /* ListLeftVariableRadioButtonAllTextAndLinksModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = AA7F32AA246C0F7900C965BA /* ListLeftVariableRadioButtonAllTextAndLinksModel.swift */; }; AA7F32AD246C0F8C00C965BA /* ListLeftVariableRadioButtonAllTextAndLinks.swift in Sources */ = {isa = PBXBuildFile; fileRef = AA7F32AC246C0F8C00C965BA /* ListLeftVariableRadioButtonAllTextAndLinks.swift */; }; + AA817FE6251C71B600EF0C6C /* StarCollectionViewCell.swift in Sources */ = {isa = PBXBuildFile; fileRef = AA817FE5251C71B600EF0C6C /* StarCollectionViewCell.swift */; }; AA85236C244435A20059CC1E /* RadioSwatchCollectionViewCell.swift in Sources */ = {isa = PBXBuildFile; fileRef = AA85236B244435A20059CC1E /* RadioSwatchCollectionViewCell.swift */; }; AA9972502475309F00FC7472 /* ListLeftVariableIconAllTextLinksModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = AA99724F2475309F00FC7472 /* ListLeftVariableIconAllTextLinksModel.swift */; }; AA997252247530B100FC7472 /* ListLeftVariableIconAllTextLinks.swift in Sources */ = {isa = PBXBuildFile; fileRef = AA997251247530B100FC7472 /* ListLeftVariableIconAllTextLinks.swift */; }; @@ -709,6 +712,8 @@ AA2AD117244EE48C00BBFFE3 /* ListDeviceComplexLinkMediumModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ListDeviceComplexLinkMediumModel.swift; sourceTree = ""; }; AA3561AB24C9684400452EB1 /* ListRightVariableRightCaretAllTextAndLinksModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ListRightVariableRightCaretAllTextAndLinksModel.swift; sourceTree = ""; }; AA3561AD24C96B9000452EB1 /* ListRightVariableRightCaretAllTextAndLinks.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ListRightVariableRightCaretAllTextAndLinks.swift; sourceTree = ""; }; + AA37CBD2251907200027344C /* StarsModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = StarsModel.swift; sourceTree = ""; }; + AA37CBD42519072F0027344C /* Stars.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = Stars.swift; sourceTree = ""; }; AA45AA0A24BF0263007A6EA7 /* LockUpsPlanNamesModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = LockUpsPlanNamesModel.swift; sourceTree = ""; }; AA45AA0C24BF0276007A6EA7 /* LockUpsPlanNames.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = LockUpsPlanNames.swift; sourceTree = ""; }; AA56A20E243C5EE900303286 /* ListTwoColumnSubsectionDividerModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ListTwoColumnSubsectionDividerModel.swift; sourceTree = ""; }; @@ -723,6 +728,7 @@ AA71AD3F24A32FE700ACA76F /* HeadersH2Link.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = HeadersH2Link.swift; sourceTree = ""; }; AA7F32AA246C0F7900C965BA /* ListLeftVariableRadioButtonAllTextAndLinksModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ListLeftVariableRadioButtonAllTextAndLinksModel.swift; sourceTree = ""; }; AA7F32AC246C0F8C00C965BA /* ListLeftVariableRadioButtonAllTextAndLinks.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ListLeftVariableRadioButtonAllTextAndLinks.swift; sourceTree = ""; }; + AA817FE5251C71B600EF0C6C /* StarCollectionViewCell.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = StarCollectionViewCell.swift; sourceTree = ""; }; AA85236B244435A20059CC1E /* RadioSwatchCollectionViewCell.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = RadioSwatchCollectionViewCell.swift; sourceTree = ""; }; AA99724F2475309F00FC7472 /* ListLeftVariableIconAllTextLinksModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ListLeftVariableIconAllTextLinksModel.swift; sourceTree = ""; }; AA997251247530B100FC7472 /* ListLeftVariableIconAllTextLinks.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ListLeftVariableIconAllTextLinks.swift; sourceTree = ""; }; @@ -1879,8 +1885,11 @@ D20492A524329CE200A5EED6 /* LoadImageView.swift */, 0A51F3E02475CB73002E08B6 /* LoadingSpinnerModel.swift */, 0A51F3E12475CB73002E08B6 /* LoadingSpinner.swift */, + AA37CBD2251907200027344C /* StarsModel.swift */, + AA37CBD42519072F0027344C /* Stars.swift */, AA07EA902510A442009A2AE3 /* StarModel.swift */, AA07EA922510A451009A2AE3 /* Star.swift */, + AA817FE5251C71B600EF0C6C /* StarCollectionViewCell.swift */, ); path = Views; sourceTree = ""; @@ -2216,6 +2225,7 @@ AAC6F167243332E400F295C1 /* RadioSwatchesModel.swift in Sources */, 324FB6AA249366F3002552C7 /* ListLeftVariableNumberedListBodyTextModel.swift in Sources */, 5248BFED23F12E350059236A /* ListThreeColumnPlanDataDividerModel.swift in Sources */, + AA817FE6251C71B600EF0C6C /* StarCollectionViewCell.swift in Sources */, AA0A257824766C8A00862F64 /* ListLeftVariableIconWithRightCaretBodyTextModel.swift in Sources */, 0A5D59C223AD2F5700EFD9E9 /* AppleGuidelinesProtocol.swift in Sources */, 8D070BB0241B56530099AC56 /* ListRightVariableTotalDataModel.swift in Sources */, @@ -2337,6 +2347,7 @@ 525239C02407BCFF00454969 /* ListTwoColumnPriceDetailsModel.swift in Sources */, D2E2A99A23D8D6B4000B42E6 /* HeadlineBodyButtonModel.swift in Sources */, D202AFE6242A6A9C00E5BEDF /* UICollectionViewScrollPosition+Extension.swift in Sources */, + AA37CBD3251907200027344C /* StarsModel.swift in Sources */, 8D084AD22410BF7600951227 /* ListOneColumnFullWidthTextBodyText.swift in Sources */, 94C0150C2421564A005811A9 /* ActionCollapseNotificationModel.swift in Sources */, D2CAC7CB251104E100C75681 /* NotificationXButtonModel.swift in Sources */, @@ -2432,6 +2443,7 @@ 01EB368F23609801006832FA /* LabelModel.swift in Sources */, 0A6682AC243531C300AD3CA1 /* Padding.swift in Sources */, AA1EC59924373994003D6F50 /* ListThreeColumnSpeedTestDivider.swift in Sources */, + AA37CBD52519072F0027344C /* Stars.swift in Sources */, 942C378E2412F5B60066E45E /* ModalMoleculeStackTemplate.swift in Sources */, 8D8067D32444473A00203BE8 /* ListRightVariablePriceChangeAllTextAndLinks.swift in Sources */, 8D4687E4242E2DF300802879 /* ListFourColumnDataUsageListItem.swift in Sources */, diff --git a/MVMCoreUI/Atomic/Atoms/Views/Star.swift b/MVMCoreUI/Atomic/Atoms/Views/Star.swift index c0cd6f56..50639dc3 100644 --- a/MVMCoreUI/Atomic/Atoms/Views/Star.swift +++ b/MVMCoreUI/Atomic/Atoms/Views/Star.swift @@ -14,10 +14,9 @@ import Foundation // MARK: - Properties //-------------------------------------------------- private var starLayer: CAShapeLayer? - let maskLayer = CAShapeLayer() - - var starModel: StarModel? - var progressBar = ProgressBar(frame: CGRect(x: 0, y: 0, width: 30, height: 30)) + private let maskLayer = CAShapeLayer() + public var starModel: StarModel? + public var progressBar = UIProgressView(progressViewStyle: .bar) //-------------------------------------------------- // MARK: - Constraints @@ -28,7 +27,6 @@ import Foundation //------------------------------------------------------ // MARK: - State Handling //------------------------------------------------------ - open override func draw(_ rect: CGRect) { //Draw the heart starLayer?.removeFromSuperlayer() @@ -85,6 +83,7 @@ import Foundation //-------------------------------------------------- open override func setupView() { super.setupView() + progressBar.translatesAutoresizingMaskIntoConstraints = false addSubview(progressBar) NSLayoutConstraint.constraintPinSubview(toSuperview: progressBar) } @@ -96,12 +95,11 @@ import Foundation progressBar.progress = Float((model.percent) / 100.0) progressBar.progressTintColor = model.fillColor.uiColor progressBar.trackTintColor = .mvmWhite - setSizeForProgressBar(size: model.size) + setFrame(with: model.size) } - func setSizeForProgressBar(size: CGFloat) { - progressBar.transform = progressBar.transform.scaledBy(x: 1, y: size/9) - progressBar.transform = progressBar.transform.translatedBy(x: 0, y: -3.5) + func setFrame(with size: CGFloat) { + progressBar.frame = CGRect(x: 0, y: 0, width: size, height: size) widthConstraint = widthAnchor.constraint(equalToConstant: size) widthConstraint?.isActive = true heightConstraint = heightAnchor.constraint(equalTo: widthAnchor, multiplier: 1) diff --git a/MVMCoreUI/Atomic/Atoms/Views/StarCollectionViewCell.swift b/MVMCoreUI/Atomic/Atoms/Views/StarCollectionViewCell.swift new file mode 100644 index 00000000..08774d45 --- /dev/null +++ b/MVMCoreUI/Atomic/Atoms/Views/StarCollectionViewCell.swift @@ -0,0 +1,24 @@ +// +// StarCollectionViewCell.swift +// MVMCoreUI +// +// Created by Lekshmi S on 24/09/20. +// Copyright © 2020 Verizon Wireless. All rights reserved. +// + +import Foundation + +open class StarCollectionViewCell: CollectionViewCell { + public let star = Star() + + open override func setupView() { + super.setupView() + addMolecule(star) + MVMCoreUIUtility.setMarginsFor(contentView, leading: 0, top: 0, trailing: 0, bottom: 0) + } + + open override func set(with model: MoleculeModelProtocol, _ delegateObject: MVMCoreUIDelegateObject?, _ additionalData: [AnyHashable: Any]?) { + guard let model = model as? StarModel else { return } + star.set(with: model, delegateObject, additionalData) + } +} diff --git a/MVMCoreUI/Atomic/Atoms/Views/Stars.swift b/MVMCoreUI/Atomic/Atoms/Views/Stars.swift new file mode 100644 index 00000000..41f80bc0 --- /dev/null +++ b/MVMCoreUI/Atomic/Atoms/Views/Stars.swift @@ -0,0 +1,155 @@ +// +// Stars.swift +// MVMCoreUI +// +// Created by Lekshmi S on 21/09/20. +// Copyright © 2020 Verizon Wireless. All rights reserved. +// + +import Foundation + +open class Stars: View { + //-------------------------------------------------- + // MARK: - Properties + //-------------------------------------------------- + public var collectionView: CollectionView! + public var stars: [StarModel]? + private var size: CGFloat? + private var delegateObject: MVMCoreUIDelegateObject? + private var starBackgroundColor: Color? + private var borderColor: Color? + private var fillColor: Color? + private var progress: CGFloat? + private var cellSize: CGFloat = 30.0 + + //------------------------------------------------------ + // MARK: - Constraints + //------------------------------------------------------ + public var collectionViewHeight: NSLayoutConstraint? + private let itemSpacing: CGFloat = 3.0 + + //-------------------------------------------------- + // MARK: - Lifecycle + //-------------------------------------------------- + open override func layoutSubviews() { + super.layoutSubviews() + // Accounts for any collection size changes + setHeight() + DispatchQueue.main.async { + self.collectionView.collectionViewLayout.invalidateLayout() + } + } + + open override func setupView() { + super.setupView() + collectionView = createCollectionView() + addSubview(collectionView) + NSLayoutConstraint.constraintPinSubview(toSuperview: collectionView) + collectionViewHeight = collectionView.heightAnchor.constraint(equalToConstant: 30) + collectionViewHeight?.isActive = true + } + + @objc override open func updateView(_ size: CGFloat) { + super.updateView(size) + self.size = size + collectionView.updateView(size) + } + + open override func set(with model: MoleculeModelProtocol, _ delegateObject: MVMCoreUIDelegateObject?, _ additionalData: [AnyHashable: Any]?) { + super.set(with: model, delegateObject, additionalData) + self.delegateObject = delegateObject + + guard let starsModel = model as? StarsModel else { return } + stars = starsModel.stars + cellSize = starsModel.size + starBackgroundColor = starsModel.starBackgroundColor ?? Color(uiColor: .clear) + borderColor = starsModel.borderColor + fillColor = starsModel.fillColor + progress = starsModel.percent + collectionView.reloadData() + } + + //------------------------------------------------------ + // MARK: - Methods + //------------------------------------------------------ + /// Creates the collection view. + open func createCollectionView() -> CollectionView { + let collection = CollectionView(frame: .zero, collectionViewLayout: createCollectionViewLayout()) + collection.dataSource = self + collection.delegate = self + collection.register(StarCollectionViewCell.self, forCellWithReuseIdentifier: "StarCollectionViewCell") + return collection + } + + /// Creates the layout for the collection. + open func createCollectionViewLayout() -> UICollectionViewLayout { + let layout = UICollectionViewFlowLayout() + layout.scrollDirection = .vertical + layout.minimumLineSpacing = itemSpacing + layout.minimumInteritemSpacing = itemSpacing + return layout + } + + open func setHeight() { + guard let stars = stars, stars.count > 0 else { + collectionViewHeight?.constant = 0 + return + } + // Calculate the height + let starsInRow = floor(CGFloat(collectionView.bounds.width/(cellSize + itemSpacing))) + let numberOfRows = ceil(CGFloat(stars.count)/starsInRow) + let height = (numberOfRows * cellSize) + (itemSpacing * (numberOfRows-1)) + + if let oldHeight = collectionViewHeight?.constant, + height != oldHeight { + // Notify delegate of height change, called async to avoid various race conditions caused while happening while laying out initially. + DispatchQueue.main.async { + self.delegateObject?.moleculeDelegate?.moleculeLayoutUpdated(self) + } + } + collectionViewHeight?.constant = CGFloat(height) + } +} + +//------------------------------------------------------ +// MARK: - Delegate methods +//------------------------------------------------------ +extension Stars: UICollectionViewDelegateFlowLayout { + open func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize { + return CGSize(width: cellSize, height: cellSize) + } +} + +extension Stars: UICollectionViewDataSource { + open func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int { + return stars?.count ?? 0 + } + + open func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell { + guard let molecule = stars?[indexPath.row], let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "StarCollectionViewCell", for: indexPath) as? StarCollectionViewCell else { + fatalError() + } + cell.reset() + + //Fill the stars based on percentage. Ex: if there were 4 stars, 75 percent is 3 full stars + let percentRequiredToFillStarFully = CGFloat(100/(stars?.count ?? 1)) + let numberOfFilledStars = Int((progress ?? 0)/percentRequiredToFillStarFully) + if indexPath.row < numberOfFilledStars { + molecule.percent = 100 + } else if indexPath.row == numberOfFilledStars { + let remainingProgress = (progress ?? 0).truncatingRemainder(dividingBy: percentRequiredToFillStarFully) + let fillPercent = (remainingProgress/percentRequiredToFillStarFully) * 100 + molecule.percent = fillPercent + } else { + molecule.percent = 0 + } + molecule.backgroundColor = starBackgroundColor + molecule.borderColor = borderColor ?? Color(uiColor: .mvmBlack) + molecule.fillColor = fillColor ?? Color(uiColor: .mvmBlack) + molecule.size = cellSize + cell.set(with: molecule, delegateObject, nil) + cell.updateView(size ?? collectionView.bounds.width) + cell.layoutIfNeeded() + return cell + } +} diff --git a/MVMCoreUI/Atomic/Atoms/Views/StarsModel.swift b/MVMCoreUI/Atomic/Atoms/Views/StarsModel.swift new file mode 100644 index 00000000..ef94c4b8 --- /dev/null +++ b/MVMCoreUI/Atomic/Atoms/Views/StarsModel.swift @@ -0,0 +1,72 @@ +// +// StarsModel.swift +// MVMCoreUI +// +// Created by Lekshmi S on 21/09/20. +// Copyright © 2020 Verizon Wireless. All rights reserved. +// + +import Foundation + +@objcMembers public class StarsModel: MoleculeModelProtocol { + + //-------------------------------------------------- + // MARK: - Properties + //-------------------------------------------------- + public static var identifier: String = "stars" + public var backgroundColor: Color? + public var starBackgroundColor: Color? + public var stars: [StarModel] + @Percent public var percent: CGFloat = 0 + public var borderColor: Color = Color(uiColor: .mvmBlack) + public var fillColor: Color = Color(uiColor: .mvmBlack) + public var size: CGFloat = 30.0 + + //-------------------------------------------------- + // MARK: - Keys + //-------------------------------------------------- + private enum CodingKeys: String, CodingKey { + case moleculeName + case backgroundColor + case starBackgroundColor + case stars + case percent + case borderColor + case fillColor + case size + } + + //-------------------------------------------------- + // MARK: - Codec + //-------------------------------------------------- + required public init(from decoder: Decoder) throws { + let typeContainer = try decoder.container(keyedBy: CodingKeys.self) + stars = try typeContainer.decode([StarModel].self, forKey: .stars) + backgroundColor = try typeContainer.decodeIfPresent(Color.self, forKey: .backgroundColor) + starBackgroundColor = try typeContainer.decodeIfPresent(Color.self, forKey: .starBackgroundColor) + if let percent = try typeContainer.decodeIfPresent(CGFloat.self, forKey: .percent) { + self.percent = percent + } + if let borderColor = try typeContainer.decodeIfPresent(Color.self, forKey: .borderColor) { + self.borderColor = borderColor + } + if let fillColor = try typeContainer.decodeIfPresent(Color.self, forKey: .fillColor) { + self.fillColor = fillColor + } + if let size = try typeContainer.decodeIfPresent(CGFloat.self, forKey: .size) { + self.size = size + } + } + + public func encode(to encoder: Encoder) throws { + var container = encoder.container(keyedBy: CodingKeys.self) + try container.encode(moleculeName, forKey: .moleculeName) + try container.encode(stars, forKey: .stars) + try container.encodeIfPresent(backgroundColor, forKey: .backgroundColor) + try container.encodeIfPresent(starBackgroundColor, forKey: .starBackgroundColor) + try container.encodeIfPresent(percent, forKey: .percent) + try container.encodeIfPresent(borderColor, forKey: .borderColor) + try container.encodeIfPresent(fillColor, forKey: .fillColor) + try container.encodeIfPresent(size, forKey: .size) + } +} diff --git a/MVMCoreUI/Atomic/MoleculeObjectMapping.swift b/MVMCoreUI/Atomic/MoleculeObjectMapping.swift index a2dc068f..e27182db 100644 --- a/MVMCoreUI/Atomic/MoleculeObjectMapping.swift +++ b/MVMCoreUI/Atomic/MoleculeObjectMapping.swift @@ -87,6 +87,7 @@ import Foundation MoleculeObjectMapping.shared()?.register(viewClass: RadioSwatches.self, viewModelClass: RadioSwatchesModel.self) MoleculeObjectMapping.shared()?.register(viewClass: Tags.self, viewModelClass: TagsModel.self) MoleculeObjectMapping.shared()?.register(viewClass: Tag.self, viewModelClass: TagModel.self) + MoleculeObjectMapping.shared()?.register(viewClass: Stars.self, viewModelClass: StarsModel.self) MoleculeObjectMapping.shared()?.register(viewClass: Star.self, viewModelClass: StarModel.self) From 95ed215d34fdf05abd1f65459cdcfa51f02dcc3c Mon Sep 17 00:00:00 2001 From: Lekshmi S Date: Wed, 30 Sep 2020 19:38:53 +0530 Subject: [PATCH 3/8] Using stackview instead of colletionview for stars. --- MVMCoreUI.xcodeproj/project.pbxproj | 4 - MVMCoreUI/Atomic/Atoms/Views/Star.swift | 18 +- .../Atoms/Views/StarCollectionViewCell.swift | 24 --- MVMCoreUI/Atomic/Atoms/Views/StarModel.swift | 8 +- MVMCoreUI/Atomic/Atoms/Views/Stars.swift | 157 +++++------------- MVMCoreUI/Atomic/Atoms/Views/StarsModel.swift | 8 +- 6 files changed, 60 insertions(+), 159 deletions(-) delete mode 100644 MVMCoreUI/Atomic/Atoms/Views/StarCollectionViewCell.swift diff --git a/MVMCoreUI.xcodeproj/project.pbxproj b/MVMCoreUI.xcodeproj/project.pbxproj index 2cee3c22..07b1b263 100644 --- a/MVMCoreUI.xcodeproj/project.pbxproj +++ b/MVMCoreUI.xcodeproj/project.pbxproj @@ -235,7 +235,6 @@ AA71AD4024A32FE700ACA76F /* HeadersH2Link.swift in Sources */ = {isa = PBXBuildFile; fileRef = AA71AD3F24A32FE700ACA76F /* HeadersH2Link.swift */; }; AA7F32AB246C0F7900C965BA /* ListLeftVariableRadioButtonAllTextAndLinksModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = AA7F32AA246C0F7900C965BA /* ListLeftVariableRadioButtonAllTextAndLinksModel.swift */; }; AA7F32AD246C0F8C00C965BA /* ListLeftVariableRadioButtonAllTextAndLinks.swift in Sources */ = {isa = PBXBuildFile; fileRef = AA7F32AC246C0F8C00C965BA /* ListLeftVariableRadioButtonAllTextAndLinks.swift */; }; - AA817FE6251C71B600EF0C6C /* StarCollectionViewCell.swift in Sources */ = {isa = PBXBuildFile; fileRef = AA817FE5251C71B600EF0C6C /* StarCollectionViewCell.swift */; }; AA85236C244435A20059CC1E /* RadioSwatchCollectionViewCell.swift in Sources */ = {isa = PBXBuildFile; fileRef = AA85236B244435A20059CC1E /* RadioSwatchCollectionViewCell.swift */; }; AA9972502475309F00FC7472 /* ListLeftVariableIconAllTextLinksModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = AA99724F2475309F00FC7472 /* ListLeftVariableIconAllTextLinksModel.swift */; }; AA997252247530B100FC7472 /* ListLeftVariableIconAllTextLinks.swift in Sources */ = {isa = PBXBuildFile; fileRef = AA997251247530B100FC7472 /* ListLeftVariableIconAllTextLinks.swift */; }; @@ -733,7 +732,6 @@ AA71AD3F24A32FE700ACA76F /* HeadersH2Link.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = HeadersH2Link.swift; sourceTree = ""; }; AA7F32AA246C0F7900C965BA /* ListLeftVariableRadioButtonAllTextAndLinksModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ListLeftVariableRadioButtonAllTextAndLinksModel.swift; sourceTree = ""; }; AA7F32AC246C0F8C00C965BA /* ListLeftVariableRadioButtonAllTextAndLinks.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ListLeftVariableRadioButtonAllTextAndLinks.swift; sourceTree = ""; }; - AA817FE5251C71B600EF0C6C /* StarCollectionViewCell.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = StarCollectionViewCell.swift; sourceTree = ""; }; AA85236B244435A20059CC1E /* RadioSwatchCollectionViewCell.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = RadioSwatchCollectionViewCell.swift; sourceTree = ""; }; AA99724F2475309F00FC7472 /* ListLeftVariableIconAllTextLinksModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ListLeftVariableIconAllTextLinksModel.swift; sourceTree = ""; }; AA997251247530B100FC7472 /* ListLeftVariableIconAllTextLinks.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ListLeftVariableIconAllTextLinks.swift; sourceTree = ""; }; @@ -1900,7 +1898,6 @@ AA37CBD42519072F0027344C /* Stars.swift */, AA07EA902510A442009A2AE3 /* StarModel.swift */, AA07EA922510A451009A2AE3 /* Star.swift */, - AA817FE5251C71B600EF0C6C /* StarCollectionViewCell.swift */, ); path = Views; sourceTree = ""; @@ -2240,7 +2237,6 @@ AAC6F167243332E400F295C1 /* RadioSwatchesModel.swift in Sources */, 324FB6AA249366F3002552C7 /* ListLeftVariableNumberedListBodyTextModel.swift in Sources */, 5248BFED23F12E350059236A /* ListThreeColumnPlanDataDividerModel.swift in Sources */, - AA817FE6251C71B600EF0C6C /* StarCollectionViewCell.swift in Sources */, AA0A257824766C8A00862F64 /* ListLeftVariableIconWithRightCaretBodyTextModel.swift in Sources */, 0A5D59C223AD2F5700EFD9E9 /* AppleGuidelinesProtocol.swift in Sources */, 8D070BB0241B56530099AC56 /* ListRightVariableTotalDataModel.swift in Sources */, diff --git a/MVMCoreUI/Atomic/Atoms/Views/Star.swift b/MVMCoreUI/Atomic/Atoms/Views/Star.swift index 50639dc3..2c532f46 100644 --- a/MVMCoreUI/Atomic/Atoms/Views/Star.swift +++ b/MVMCoreUI/Atomic/Atoms/Views/Star.swift @@ -15,7 +15,9 @@ import Foundation //-------------------------------------------------- private var starLayer: CAShapeLayer? private let maskLayer = CAShapeLayer() - public var starModel: StarModel? + public var starModel: StarModel? { + return model as? StarModel + } public var progressBar = UIProgressView(progressViewStyle: .bar) //-------------------------------------------------- @@ -37,12 +39,12 @@ import Foundation //Mask the star maskLayer.removeFromSuperlayer() maskLayer.path = star.path - self.layer.mask = maskLayer + layer.mask = maskLayer } func drawStar() -> CAShapeLayer { let shapeLayer = CAShapeLayer() - shapeLayer.frame = self.bounds + shapeLayer.frame = bounds let starPath = UIBezierPath() let center = shapeLayer.position let theta = .pi / CGFloat(5.0) @@ -86,12 +88,15 @@ import Foundation progressBar.translatesAutoresizingMaskIntoConstraints = false addSubview(progressBar) NSLayoutConstraint.constraintPinSubview(toSuperview: progressBar) + widthConstraint = widthAnchor.constraint(equalToConstant: 30) + widthConstraint?.isActive = true + heightConstraint = heightAnchor.constraint(equalTo: widthAnchor, multiplier: 1) + heightConstraint?.isActive = true } public override func set(with model: MoleculeModelProtocol, _ delegateObject: MVMCoreUIDelegateObject?, _ additionalData: [AnyHashable: Any]?) { super.set(with: model, delegateObject, additionalData) guard let model = model as? StarModel else { return } - self.starModel = model progressBar.progress = Float((model.percent) / 100.0) progressBar.progressTintColor = model.fillColor.uiColor progressBar.trackTintColor = .mvmWhite @@ -100,10 +105,7 @@ import Foundation func setFrame(with size: CGFloat) { progressBar.frame = CGRect(x: 0, y: 0, width: size, height: size) - widthConstraint = widthAnchor.constraint(equalToConstant: size) - widthConstraint?.isActive = true - heightConstraint = heightAnchor.constraint(equalTo: widthAnchor, multiplier: 1) - heightConstraint?.isActive = true + widthConstraint?.constant = size setNeedsDisplay() } } diff --git a/MVMCoreUI/Atomic/Atoms/Views/StarCollectionViewCell.swift b/MVMCoreUI/Atomic/Atoms/Views/StarCollectionViewCell.swift deleted file mode 100644 index 08774d45..00000000 --- a/MVMCoreUI/Atomic/Atoms/Views/StarCollectionViewCell.swift +++ /dev/null @@ -1,24 +0,0 @@ -// -// StarCollectionViewCell.swift -// MVMCoreUI -// -// Created by Lekshmi S on 24/09/20. -// Copyright © 2020 Verizon Wireless. All rights reserved. -// - -import Foundation - -open class StarCollectionViewCell: CollectionViewCell { - public let star = Star() - - open override func setupView() { - super.setupView() - addMolecule(star) - MVMCoreUIUtility.setMarginsFor(contentView, leading: 0, top: 0, trailing: 0, bottom: 0) - } - - open override func set(with model: MoleculeModelProtocol, _ delegateObject: MVMCoreUIDelegateObject?, _ additionalData: [AnyHashable: Any]?) { - guard let model = model as? StarModel else { return } - star.set(with: model, delegateObject, additionalData) - } -} diff --git a/MVMCoreUI/Atomic/Atoms/Views/StarModel.swift b/MVMCoreUI/Atomic/Atoms/Views/StarModel.swift index 402ada9a..1d473b86 100644 --- a/MVMCoreUI/Atomic/Atoms/Views/StarModel.swift +++ b/MVMCoreUI/Atomic/Atoms/Views/StarModel.swift @@ -57,9 +57,9 @@ open class StarModel: MoleculeModelProtocol { var container = encoder.container(keyedBy: CodingKeys.self) try container.encodeIfPresent(backgroundColor, forKey: .backgroundColor) try container.encode(moleculeName, forKey: .moleculeName) - try container.encodeIfPresent(percent, forKey: .percent) - try container.encodeIfPresent(borderColor, forKey: .borderColor) - try container.encodeIfPresent(fillColor, forKey: .fillColor) - try container.encodeIfPresent(size, forKey: .size) + try container.encode(percent, forKey: .percent) + try container.encode(borderColor, forKey: .borderColor) + try container.encode(fillColor, forKey: .fillColor) + try container.encode(size, forKey: .size) } } diff --git a/MVMCoreUI/Atomic/Atoms/Views/Stars.swift b/MVMCoreUI/Atomic/Atoms/Views/Stars.swift index 41f80bc0..d7dba177 100644 --- a/MVMCoreUI/Atomic/Atoms/Views/Stars.swift +++ b/MVMCoreUI/Atomic/Atoms/Views/Stars.swift @@ -12,144 +12,71 @@ open class Stars: View { //-------------------------------------------------- // MARK: - Properties //-------------------------------------------------- - public var collectionView: CollectionView! - public var stars: [StarModel]? - private var size: CGFloat? + private var stack = UIStackView() + public var starsModel: StarsModel? { + return model as? StarsModel + } private var delegateObject: MVMCoreUIDelegateObject? - private var starBackgroundColor: Color? - private var borderColor: Color? - private var fillColor: Color? - private var progress: CGFloat? - private var cellSize: CGFloat = 30.0 - - //------------------------------------------------------ - // MARK: - Constraints - //------------------------------------------------------ - public var collectionViewHeight: NSLayoutConstraint? private let itemSpacing: CGFloat = 3.0 //-------------------------------------------------- // MARK: - Lifecycle //-------------------------------------------------- - open override func layoutSubviews() { - super.layoutSubviews() - // Accounts for any collection size changes - setHeight() - DispatchQueue.main.async { - self.collectionView.collectionViewLayout.invalidateLayout() - } - } - open override func setupView() { super.setupView() - collectionView = createCollectionView() - addSubview(collectionView) - NSLayoutConstraint.constraintPinSubview(toSuperview: collectionView) - collectionViewHeight = collectionView.heightAnchor.constraint(equalToConstant: 30) - collectionViewHeight?.isActive = true + stack.translatesAutoresizingMaskIntoConstraints = false + addSubview(stack) + stack.topAnchor.constraint(equalTo: topAnchor).isActive = true + bottomAnchor.constraint(equalTo: stack.bottomAnchor).isActive = true + stack.axis = .horizontal + stack.spacing = itemSpacing } @objc override open func updateView(_ size: CGFloat) { super.updateView(size) - self.size = size - collectionView.updateView(size) + stack.updateView(size) } open override func set(with model: MoleculeModelProtocol, _ delegateObject: MVMCoreUIDelegateObject?, _ additionalData: [AnyHashable: Any]?) { super.set(with: model, delegateObject, additionalData) self.delegateObject = delegateObject - - guard let starsModel = model as? StarsModel else { return } - stars = starsModel.stars - cellSize = starsModel.size - starBackgroundColor = starsModel.starBackgroundColor ?? Color(uiColor: .clear) - borderColor = starsModel.borderColor - fillColor = starsModel.fillColor - progress = starsModel.percent - collectionView.reloadData() + createStar() } //------------------------------------------------------ // MARK: - Methods //------------------------------------------------------ - /// Creates the collection view. - open func createCollectionView() -> CollectionView { - let collection = CollectionView(frame: .zero, collectionViewLayout: createCollectionViewLayout()) - collection.dataSource = self - collection.delegate = self - collection.register(StarCollectionViewCell.self, forCellWithReuseIdentifier: "StarCollectionViewCell") - return collection - } - - /// Creates the layout for the collection. - open func createCollectionViewLayout() -> UICollectionViewLayout { - let layout = UICollectionViewFlowLayout() - layout.scrollDirection = .vertical - layout.minimumLineSpacing = itemSpacing - layout.minimumInteritemSpacing = itemSpacing - return layout - } - - open func setHeight() { - guard let stars = stars, stars.count > 0 else { - collectionViewHeight?.constant = 0 - return - } - // Calculate the height - let starsInRow = floor(CGFloat(collectionView.bounds.width/(cellSize + itemSpacing))) - let numberOfRows = ceil(CGFloat(stars.count)/starsInRow) - let height = (numberOfRows * cellSize) + (itemSpacing * (numberOfRows-1)) - - if let oldHeight = collectionViewHeight?.constant, - height != oldHeight { - // Notify delegate of height change, called async to avoid various race conditions caused while happening while laying out initially. - DispatchQueue.main.async { - self.delegateObject?.moleculeDelegate?.moleculeLayoutUpdated(self) + func createStar() { + if let starsModel = starsModel { + stack.subviews.forEach({$0.removeFromSuperview()}) + let stars = starsModel.stars + for (index, starModel) in stars.enumerated() { + let star = Star() + + //Fill the stars based on percentage. Ex: if there were 4 stars, 75 percent is 3 full stars + let percentRequiredToFillStarFully = CGFloat(100/(starsModel.stars.count)) + let numberOfFilledStars = Int(starsModel.percent/percentRequiredToFillStarFully) + if index < numberOfFilledStars { + starModel.percent = 100 + } else if index == numberOfFilledStars { + let remainingProgress = (starsModel.percent).truncatingRemainder(dividingBy: percentRequiredToFillStarFully) + let fillPercent = (remainingProgress/percentRequiredToFillStarFully) * 100 + starModel.percent = fillPercent + } else { + starModel.percent = 0 + } + + starModel.backgroundColor = starsModel.starBackgroundColor + if let borderColor = starsModel.borderColor { + starModel.borderColor = borderColor + } + if let fillColor = starsModel.fillColor { + starModel.fillColor = fillColor + } + starModel.size = starsModel.size + star.set(with: starModel, delegateObject, nil) + stack.addArrangedSubview(star) } } - collectionViewHeight?.constant = CGFloat(height) - } -} - -//------------------------------------------------------ -// MARK: - Delegate methods -//------------------------------------------------------ -extension Stars: UICollectionViewDelegateFlowLayout { - open func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize { - return CGSize(width: cellSize, height: cellSize) - } -} - -extension Stars: UICollectionViewDataSource { - open func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int { - return stars?.count ?? 0 - } - - open func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell { - guard let molecule = stars?[indexPath.row], let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "StarCollectionViewCell", for: indexPath) as? StarCollectionViewCell else { - fatalError() - } - cell.reset() - - //Fill the stars based on percentage. Ex: if there were 4 stars, 75 percent is 3 full stars - let percentRequiredToFillStarFully = CGFloat(100/(stars?.count ?? 1)) - let numberOfFilledStars = Int((progress ?? 0)/percentRequiredToFillStarFully) - if indexPath.row < numberOfFilledStars { - molecule.percent = 100 - } else if indexPath.row == numberOfFilledStars { - let remainingProgress = (progress ?? 0).truncatingRemainder(dividingBy: percentRequiredToFillStarFully) - let fillPercent = (remainingProgress/percentRequiredToFillStarFully) * 100 - molecule.percent = fillPercent - } else { - molecule.percent = 0 - } - molecule.backgroundColor = starBackgroundColor - molecule.borderColor = borderColor ?? Color(uiColor: .mvmBlack) - molecule.fillColor = fillColor ?? Color(uiColor: .mvmBlack) - molecule.size = cellSize - cell.set(with: molecule, delegateObject, nil) - cell.updateView(size ?? collectionView.bounds.width) - cell.layoutIfNeeded() - return cell } } diff --git a/MVMCoreUI/Atomic/Atoms/Views/StarsModel.swift b/MVMCoreUI/Atomic/Atoms/Views/StarsModel.swift index ef94c4b8..ad52b18e 100644 --- a/MVMCoreUI/Atomic/Atoms/Views/StarsModel.swift +++ b/MVMCoreUI/Atomic/Atoms/Views/StarsModel.swift @@ -18,8 +18,8 @@ import Foundation public var starBackgroundColor: Color? public var stars: [StarModel] @Percent public var percent: CGFloat = 0 - public var borderColor: Color = Color(uiColor: .mvmBlack) - public var fillColor: Color = Color(uiColor: .mvmBlack) + public var borderColor: Color? + public var fillColor: Color? public var size: CGFloat = 30.0 //-------------------------------------------------- @@ -64,9 +64,9 @@ import Foundation try container.encode(stars, forKey: .stars) try container.encodeIfPresent(backgroundColor, forKey: .backgroundColor) try container.encodeIfPresent(starBackgroundColor, forKey: .starBackgroundColor) - try container.encodeIfPresent(percent, forKey: .percent) try container.encodeIfPresent(borderColor, forKey: .borderColor) try container.encodeIfPresent(fillColor, forKey: .fillColor) - try container.encodeIfPresent(size, forKey: .size) + try container.encode(percent, forKey: .percent) + try container.encode(size, forKey: .size) } } From ad345dacd81f7d941449b0070e76bf4221ebbddc Mon Sep 17 00:00:00 2001 From: Lekshmi S Date: Tue, 6 Oct 2020 13:06:31 +0530 Subject: [PATCH 4/8] Code changes as per review comments. --- MVMCoreUI/Atomic/Atoms/Views/Star.swift | 1 - MVMCoreUI/Atomic/Atoms/Views/Stars.swift | 17 ++++++++++++----- 2 files changed, 12 insertions(+), 6 deletions(-) diff --git a/MVMCoreUI/Atomic/Atoms/Views/Star.swift b/MVMCoreUI/Atomic/Atoms/Views/Star.swift index 2c532f46..6e712053 100644 --- a/MVMCoreUI/Atomic/Atoms/Views/Star.swift +++ b/MVMCoreUI/Atomic/Atoms/Views/Star.swift @@ -104,7 +104,6 @@ import Foundation } func setFrame(with size: CGFloat) { - progressBar.frame = CGRect(x: 0, y: 0, width: size, height: size) widthConstraint?.constant = size setNeedsDisplay() } diff --git a/MVMCoreUI/Atomic/Atoms/Views/Stars.swift b/MVMCoreUI/Atomic/Atoms/Views/Stars.swift index d7dba177..90a8e43a 100644 --- a/MVMCoreUI/Atomic/Atoms/Views/Stars.swift +++ b/MVMCoreUI/Atomic/Atoms/Views/Stars.swift @@ -18,6 +18,7 @@ open class Stars: View { } private var delegateObject: MVMCoreUIDelegateObject? private let itemSpacing: CGFloat = 3.0 + private var heightConstraint: NSLayoutConstraint? //-------------------------------------------------- // MARK: - Lifecycle @@ -26,8 +27,9 @@ open class Stars: View { super.setupView() stack.translatesAutoresizingMaskIntoConstraints = false addSubview(stack) - stack.topAnchor.constraint(equalTo: topAnchor).isActive = true - bottomAnchor.constraint(equalTo: stack.bottomAnchor).isActive = true + NSLayoutConstraint.pinView(toSuperview: stack, useMargins: true) + heightConstraint = heightAnchor.constraint(equalToConstant: 30) + heightConstraint?.isActive = true stack.axis = .horizontal stack.spacing = itemSpacing } @@ -48,14 +50,13 @@ open class Stars: View { //------------------------------------------------------ func createStar() { if let starsModel = starsModel { - stack.subviews.forEach({$0.removeFromSuperview()}) let stars = starsModel.stars + let percentRequiredToFillStarFully = CGFloat(100/(starsModel.stars.count)) + let numberOfFilledStars = Int(starsModel.percent/percentRequiredToFillStarFully) for (index, starModel) in stars.enumerated() { let star = Star() //Fill the stars based on percentage. Ex: if there were 4 stars, 75 percent is 3 full stars - let percentRequiredToFillStarFully = CGFloat(100/(starsModel.stars.count)) - let numberOfFilledStars = Int(starsModel.percent/percentRequiredToFillStarFully) if index < numberOfFilledStars { starModel.percent = 100 } else if index == numberOfFilledStars { @@ -77,6 +78,12 @@ open class Stars: View { star.set(with: starModel, delegateObject, nil) stack.addArrangedSubview(star) } + heightConstraint?.constant = starsModel.size } } + + public override func reset() { + super.reset() + stack.subviews.forEach({$0.removeFromSuperview()}) + } } From 93943b25186065153a9355ccae2d4a447e862d2d Mon Sep 17 00:00:00 2001 From: Lekshmi S Date: Mon, 12 Oct 2020 19:46:35 +0530 Subject: [PATCH 5/8] Code changes based on review comments. --- MVMCoreUI/Atomic/Atoms/Views/Star.swift | 13 ++++--- MVMCoreUI/Atomic/Atoms/Views/Stars.swift | 49 ++++++++++++------------ 2 files changed, 32 insertions(+), 30 deletions(-) diff --git a/MVMCoreUI/Atomic/Atoms/Views/Star.swift b/MVMCoreUI/Atomic/Atoms/Views/Star.swift index 6e712053..f2a95b94 100644 --- a/MVMCoreUI/Atomic/Atoms/Views/Star.swift +++ b/MVMCoreUI/Atomic/Atoms/Views/Star.swift @@ -19,6 +19,12 @@ import Foundation return model as? StarModel } public var progressBar = UIProgressView(progressViewStyle: .bar) + public var size: CGFloat = 30 { + didSet { + widthConstraint?.constant = size + setNeedsDisplay() + } + } //-------------------------------------------------- // MARK: - Constraints @@ -100,11 +106,6 @@ import Foundation progressBar.progress = Float((model.percent) / 100.0) progressBar.progressTintColor = model.fillColor.uiColor progressBar.trackTintColor = .mvmWhite - setFrame(with: model.size) - } - - func setFrame(with size: CGFloat) { - widthConstraint?.constant = size - setNeedsDisplay() + size = model.size } } diff --git a/MVMCoreUI/Atomic/Atoms/Views/Stars.swift b/MVMCoreUI/Atomic/Atoms/Views/Stars.swift index 90a8e43a..42224d87 100644 --- a/MVMCoreUI/Atomic/Atoms/Views/Stars.swift +++ b/MVMCoreUI/Atomic/Atoms/Views/Stars.swift @@ -13,6 +13,7 @@ open class Stars: View { // MARK: - Properties //-------------------------------------------------- private var stack = UIStackView() + public var starElements = [Star]() public var starsModel: StarsModel? { return model as? StarsModel } @@ -43,6 +44,7 @@ open class Stars: View { super.set(with: model, delegateObject, additionalData) self.delegateObject = delegateObject createStar() + updateStar() } //------------------------------------------------------ @@ -50,38 +52,37 @@ open class Stars: View { //------------------------------------------------------ func createStar() { if let starsModel = starsModel { - let stars = starsModel.stars - let percentRequiredToFillStarFully = CGFloat(100/(starsModel.stars.count)) - let numberOfFilledStars = Int(starsModel.percent/percentRequiredToFillStarFully) - for (index, starModel) in stars.enumerated() { + for starModel in starsModel.stars { let star = Star() - - //Fill the stars based on percentage. Ex: if there were 4 stars, 75 percent is 3 full stars - if index < numberOfFilledStars { - starModel.percent = 100 - } else if index == numberOfFilledStars { - let remainingProgress = (starsModel.percent).truncatingRemainder(dividingBy: percentRequiredToFillStarFully) - let fillPercent = (remainingProgress/percentRequiredToFillStarFully) * 100 - starModel.percent = fillPercent - } else { - starModel.percent = 0 - } - - starModel.backgroundColor = starsModel.starBackgroundColor - if let borderColor = starsModel.borderColor { - starModel.borderColor = borderColor - } - if let fillColor = starsModel.fillColor { - starModel.fillColor = fillColor - } - starModel.size = starsModel.size star.set(with: starModel, delegateObject, nil) stack.addArrangedSubview(star) + starElements.append(star) } heightConstraint?.constant = starsModel.size } } + //Update star progress and size with starsModel values + func updateStar() { + if let starsModel = starsModel { + let percentRequiredToFillStarFully = CGFloat(100/(starElements.count)) + let numberOfFilledStars = Int(starsModel.percent/percentRequiredToFillStarFully) + for (index, star) in starElements.enumerated() { + //Fill the stars based on percentage. Ex: if there were 4 stars, 75 percent is 3 full stars + if index < numberOfFilledStars { + star.progressBar.progress = 1 + } else if index == numberOfFilledStars { + let remainingProgress = (starsModel.percent).truncatingRemainder(dividingBy: percentRequiredToFillStarFully) + let fillPercent = remainingProgress/percentRequiredToFillStarFully + star.progressBar.progress = Float(fillPercent) + } else { + star.progressBar.progress = 0 + } + star.size = starsModel.size + } + } + } + public override func reset() { super.reset() stack.subviews.forEach({$0.removeFromSuperview()}) From 4c15bef289b81e8c47fb2dd9f7510a61e0d87222 Mon Sep 17 00:00:00 2001 From: Lekshmi S Date: Thu, 15 Oct 2020 17:03:57 +0530 Subject: [PATCH 6/8] Added accessibility and code review fixes. --- MVMCoreUI/Atomic/Atoms/Views/Star.swift | 19 +++++++++++-- MVMCoreUI/Atomic/Atoms/Views/StarModel.swift | 16 +++++------ MVMCoreUI/Atomic/Atoms/Views/Stars.swift | 27 ++++++++++++++++++- .../Strings/en.lproj/Localizable.strings | 5 ++++ .../Strings/es-MX.lproj/Localizable.strings | 4 +++ .../Strings/es.lproj/Localizable.strings | 5 ++++ 6 files changed, 63 insertions(+), 13 deletions(-) diff --git a/MVMCoreUI/Atomic/Atoms/Views/Star.swift b/MVMCoreUI/Atomic/Atoms/Views/Star.swift index f2a95b94..7f12d6f4 100644 --- a/MVMCoreUI/Atomic/Atoms/Views/Star.swift +++ b/MVMCoreUI/Atomic/Atoms/Views/Star.swift @@ -19,12 +19,14 @@ import Foundation return model as? StarModel } public var progressBar = UIProgressView(progressViewStyle: .bar) + public var percent: Int = 0 public var size: CGFloat = 30 { didSet { widthConstraint?.constant = size setNeedsDisplay() } } + public var borderColor: Color = Color(uiColor: .mvmBlack) //-------------------------------------------------- // MARK: - Constraints @@ -82,7 +84,7 @@ import Foundation shapeLayer.fillColor = UIColor.clear.cgColor shapeLayer.opacity = 1.0 shapeLayer.lineWidth = 1 - shapeLayer.strokeColor = starModel?.borderColor.cgColor + shapeLayer.strokeColor = borderColor.cgColor return shapeLayer } @@ -98,14 +100,27 @@ import Foundation widthConstraint?.isActive = true heightConstraint = heightAnchor.constraint(equalTo: widthAnchor, multiplier: 1) heightConstraint?.isActive = true + isAccessibilityElement = true + updateAccessibilityLabel() } public override func set(with model: MoleculeModelProtocol, _ delegateObject: MVMCoreUIDelegateObject?, _ additionalData: [AnyHashable: Any]?) { super.set(with: model, delegateObject, additionalData) guard let model = model as? StarModel else { return } progressBar.progress = Float((model.percent) / 100.0) - progressBar.progressTintColor = model.fillColor.uiColor + percent = Int(model.percent) + progressBar.progressTintColor = (model.fillColor != nil) ? model.fillColor?.uiColor : .mvmBlack progressBar.trackTintColor = .mvmWhite + if let border = model.borderColor { + borderColor = border + } size = model.size + updateAccessibilityLabel() + } + + // MARK: - Accessibility + func updateAccessibilityLabel() { + accessibilityLabel = MVMCoreUIUtility.hardcodedString(withKey: "star") + accessibilityValue = String(format: MVMCoreUIUtility.hardcodedString(withKey: "star_percent") ?? "", percent) } } diff --git a/MVMCoreUI/Atomic/Atoms/Views/StarModel.swift b/MVMCoreUI/Atomic/Atoms/Views/StarModel.swift index 1d473b86..6ab85a3b 100644 --- a/MVMCoreUI/Atomic/Atoms/Views/StarModel.swift +++ b/MVMCoreUI/Atomic/Atoms/Views/StarModel.swift @@ -16,8 +16,8 @@ open class StarModel: MoleculeModelProtocol { public static var identifier: String = "star" public var backgroundColor: Color? @Percent public var percent: CGFloat = 0 - public var borderColor: Color = Color(uiColor: .mvmBlack) - public var fillColor: Color = Color(uiColor: .mvmBlack) + public var borderColor: Color? + public var fillColor: Color? public var size: CGFloat = 30.0 //-------------------------------------------------- @@ -42,12 +42,8 @@ open class StarModel: MoleculeModelProtocol { self.percent = percent } backgroundColor = try typeContainer.decodeIfPresent(Color.self, forKey: .backgroundColor) - if let borderColor = try typeContainer.decodeIfPresent(Color.self, forKey: .borderColor) { - self.borderColor = borderColor - } - if let fillColor = try typeContainer.decodeIfPresent(Color.self, forKey: .fillColor) { - self.fillColor = fillColor - } + borderColor = try typeContainer.decodeIfPresent(Color.self, forKey: .borderColor) + fillColor = try typeContainer.decodeIfPresent(Color.self, forKey: .fillColor) if let size = try typeContainer.decodeIfPresent(CGFloat.self, forKey: .size) { self.size = size } @@ -58,8 +54,8 @@ open class StarModel: MoleculeModelProtocol { try container.encodeIfPresent(backgroundColor, forKey: .backgroundColor) try container.encode(moleculeName, forKey: .moleculeName) try container.encode(percent, forKey: .percent) - try container.encode(borderColor, forKey: .borderColor) - try container.encode(fillColor, forKey: .fillColor) + try container.encodeIfPresent(borderColor, forKey: .borderColor) + try container.encodeIfPresent(fillColor, forKey: .fillColor) try container.encode(size, forKey: .size) } } diff --git a/MVMCoreUI/Atomic/Atoms/Views/Stars.swift b/MVMCoreUI/Atomic/Atoms/Views/Stars.swift index 42224d87..742dc580 100644 --- a/MVMCoreUI/Atomic/Atoms/Views/Stars.swift +++ b/MVMCoreUI/Atomic/Atoms/Views/Stars.swift @@ -20,6 +20,7 @@ open class Stars: View { private var delegateObject: MVMCoreUIDelegateObject? private let itemSpacing: CGFloat = 3.0 private var heightConstraint: NSLayoutConstraint? + private var starsFilledValue: Float = 0 //-------------------------------------------------- // MARK: - Lifecycle @@ -28,11 +29,16 @@ open class Stars: View { super.setupView() stack.translatesAutoresizingMaskIntoConstraints = false addSubview(stack) - NSLayoutConstraint.pinView(toSuperview: stack, useMargins: true) + NSLayoutConstraint.constraintPinSubview(toSuperview: stack) + let leading = stack.leadingAnchor.constraint(equalTo: self.leadingAnchor) + leading.priority = UILayoutPriority(rawValue: 1000) + leading.isActive = true heightConstraint = heightAnchor.constraint(equalToConstant: 30) heightConstraint?.isActive = true stack.axis = .horizontal stack.spacing = itemSpacing + isAccessibilityElement = true + updateAccessibilityLabel() } @objc override open func updateView(_ size: CGFloat) { @@ -45,6 +51,7 @@ open class Stars: View { self.delegateObject = delegateObject createStar() updateStar() + updateAccessibilityLabel() } //------------------------------------------------------ @@ -57,6 +64,17 @@ open class Stars: View { star.set(with: starModel, delegateObject, nil) stack.addArrangedSubview(star) starElements.append(star) + star.isAccessibilityElement = false + //Star model colors should take priority over stars. + if let borderColor = starsModel.borderColor, starModel.borderColor == nil { + star.borderColor = borderColor + } + if let fillColor = starsModel.fillColor, starModel.fillColor == nil { + star.progressBar.progressTintColor = fillColor.uiColor + } + if let backgroundColor = starsModel.starBackgroundColor, starModel.backgroundColor == nil { + star.backgroundColor = backgroundColor.uiColor + } } heightConstraint?.constant = starsModel.size } @@ -67,6 +85,7 @@ open class Stars: View { if let starsModel = starsModel { let percentRequiredToFillStarFully = CGFloat(100/(starElements.count)) let numberOfFilledStars = Int(starsModel.percent/percentRequiredToFillStarFully) + starsFilledValue = Float(numberOfFilledStars) for (index, star) in starElements.enumerated() { //Fill the stars based on percentage. Ex: if there were 4 stars, 75 percent is 3 full stars if index < numberOfFilledStars { @@ -74,6 +93,7 @@ open class Stars: View { } else if index == numberOfFilledStars { let remainingProgress = (starsModel.percent).truncatingRemainder(dividingBy: percentRequiredToFillStarFully) let fillPercent = remainingProgress/percentRequiredToFillStarFully + starsFilledValue += Float(fillPercent) star.progressBar.progress = Float(fillPercent) } else { star.progressBar.progress = 0 @@ -87,4 +107,9 @@ open class Stars: View { super.reset() stack.subviews.forEach({$0.removeFromSuperview()}) } + + // MARK: - Accessibility + func updateAccessibilityLabel() { + accessibilityLabel = String(format: MVMCoreUIUtility.hardcodedString(withKey: "stars_filled") ?? "", starsFilledValue, starElements.count) + } } diff --git a/MVMCoreUI/SupportingFiles/Strings/en.lproj/Localizable.strings b/MVMCoreUI/SupportingFiles/Strings/en.lproj/Localizable.strings index ee0b1849..f14fe02e 100644 --- a/MVMCoreUI/SupportingFiles/Strings/en.lproj/Localizable.strings +++ b/MVMCoreUI/SupportingFiles/Strings/en.lproj/Localizable.strings @@ -87,3 +87,8 @@ "CountDownHours" = " hours"; "CountDownMins" = " mins"; "CountDownSecs" = " secs"; + +// MARK: Star +"star" = "Star"; +"star_percent" = "%d percent progress"; +"stars_filled" = "%.1f out of %d stars"; diff --git a/MVMCoreUI/SupportingFiles/Strings/es-MX.lproj/Localizable.strings b/MVMCoreUI/SupportingFiles/Strings/es-MX.lproj/Localizable.strings index 0a37e1a5..4d14292c 100644 --- a/MVMCoreUI/SupportingFiles/Strings/es-MX.lproj/Localizable.strings +++ b/MVMCoreUI/SupportingFiles/Strings/es-MX.lproj/Localizable.strings @@ -66,3 +66,7 @@ "CountDownHours" = " horas"; "CountDownMins" = " min"; "CountDownSecs" = " seg"; +// Star +"star" = "Estrella"; +"star_percent" = "%@ porcentaje de progreso"; +"stars_filled" = "%.1f de %d estrellas"; diff --git a/MVMCoreUI/SupportingFiles/Strings/es.lproj/Localizable.strings b/MVMCoreUI/SupportingFiles/Strings/es.lproj/Localizable.strings index a64c3915..585e2c1a 100644 --- a/MVMCoreUI/SupportingFiles/Strings/es.lproj/Localizable.strings +++ b/MVMCoreUI/SupportingFiles/Strings/es.lproj/Localizable.strings @@ -70,3 +70,8 @@ "CountDownHours" = " horas"; "CountDownMins" = " min"; "CountDownSecs" = " seg"; + +// Star +"star" = "Estrella"; +"star_percent" = "%@ porcentaje de progreso"; +"stars_filled" = "%.1f de %d estrellas"; From ad7e88082c7663ec5c074cd33d14d23bbc1ced16 Mon Sep 17 00:00:00 2001 From: "Pfeil, Scott Robert" Date: Fri, 16 Oct 2020 12:59:48 -0400 Subject: [PATCH 7/8] Stars: Change UIProgressView to draw due to apple defect Remove unneeded constant Re-prioritized Create and update stars functions --- MVMCoreUI/Atomic/Atoms/Views/Star.swift | 78 +++++++++---- MVMCoreUI/Atomic/Atoms/Views/Stars.swift | 107 +++++++++--------- MVMCoreUI/Atomic/Atoms/Views/StarsModel.swift | 8 +- 3 files changed, 106 insertions(+), 87 deletions(-) diff --git a/MVMCoreUI/Atomic/Atoms/Views/Star.swift b/MVMCoreUI/Atomic/Atoms/Views/Star.swift index 7f12d6f4..87e81a72 100644 --- a/MVMCoreUI/Atomic/Atoms/Views/Star.swift +++ b/MVMCoreUI/Atomic/Atoms/Views/Star.swift @@ -18,15 +18,28 @@ import Foundation public var starModel: StarModel? { return model as? StarModel } - public var progressBar = UIProgressView(progressViewStyle: .bar) - public var percent: Int = 0 + @Percent public var percent = 0 { + didSet { + updateAccessibilityLabel() + setNeedsDisplay() + } + } public var size: CGFloat = 30 { didSet { widthConstraint?.constant = size setNeedsDisplay() } } - public var borderColor: Color = Color(uiColor: .mvmBlack) + public var fillColor = UIColor.mvmBlack { + didSet { + setNeedsDisplay() + } + } + public var borderColor: CGColor = UIColor.mvmBlack.cgColor { + didSet { + setNeedsDisplay() + } + } //-------------------------------------------------- // MARK: - Constraints @@ -38,7 +51,14 @@ import Foundation // MARK: - State Handling //------------------------------------------------------ open override func draw(_ rect: CGRect) { - //Draw the heart + //Draw progress + let width = bounds.size.width * percent / 100.0 + let progressRect = CGRect(x: 0, y: 0, width: width, height: bounds.height) + fillColor.set() + guard let context = UIGraphicsGetCurrentContext() else { return } + context.fill(progressRect) + + //Draw the star starLayer?.removeFromSuperlayer() let star = drawStar() layer.addSublayer(star) @@ -84,18 +104,40 @@ import Foundation shapeLayer.fillColor = UIColor.clear.cgColor shapeLayer.opacity = 1.0 shapeLayer.lineWidth = 1 - shapeLayer.strokeColor = borderColor.cgColor + shapeLayer.strokeColor = borderColor return shapeLayer } - + //-------------------------------------------------- - // MARK: - Lifecycle + // MARK: - MoleculeViewProtocol + //-------------------------------------------------- + open override func reset() { + super.reset() + borderColor = UIColor.mvmBlack.cgColor + fillColor = .mvmBlack + percent = 0 + } + + public override func set(with model: MoleculeModelProtocol, _ delegateObject: MVMCoreUIDelegateObject?, _ additionalData: [AnyHashable: Any]?) { + super.set(with: model, delegateObject, additionalData) + guard let model = model as? StarModel else { return } + percent = model.percent + if let fillColor = model.fillColor?.uiColor { + self.fillColor = fillColor + } + if let borderColor = model.borderColor?.cgColor { + self.borderColor = borderColor + } + size = model.size + updateAccessibilityLabel() + } + + //-------------------------------------------------- + // MARK: - MVMCoreViewProtocol //-------------------------------------------------- open override func setupView() { super.setupView() - progressBar.translatesAutoresizingMaskIntoConstraints = false - addSubview(progressBar) - NSLayoutConstraint.constraintPinSubview(toSuperview: progressBar) + backgroundColor = .clear widthConstraint = widthAnchor.constraint(equalToConstant: 30) widthConstraint?.isActive = true heightConstraint = heightAnchor.constraint(equalTo: widthAnchor, multiplier: 1) @@ -104,23 +146,9 @@ import Foundation updateAccessibilityLabel() } - public override func set(with model: MoleculeModelProtocol, _ delegateObject: MVMCoreUIDelegateObject?, _ additionalData: [AnyHashable: Any]?) { - super.set(with: model, delegateObject, additionalData) - guard let model = model as? StarModel else { return } - progressBar.progress = Float((model.percent) / 100.0) - percent = Int(model.percent) - progressBar.progressTintColor = (model.fillColor != nil) ? model.fillColor?.uiColor : .mvmBlack - progressBar.trackTintColor = .mvmWhite - if let border = model.borderColor { - borderColor = border - } - size = model.size - updateAccessibilityLabel() - } - // MARK: - Accessibility func updateAccessibilityLabel() { accessibilityLabel = MVMCoreUIUtility.hardcodedString(withKey: "star") - accessibilityValue = String(format: MVMCoreUIUtility.hardcodedString(withKey: "star_percent") ?? "", percent) + accessibilityValue = String(format: MVMCoreUIUtility.hardcodedString(withKey: "star_percent") ?? "", Int(percent)) } } diff --git a/MVMCoreUI/Atomic/Atoms/Views/Stars.swift b/MVMCoreUI/Atomic/Atoms/Views/Stars.swift index 742dc580..07a78e95 100644 --- a/MVMCoreUI/Atomic/Atoms/Views/Stars.swift +++ b/MVMCoreUI/Atomic/Atoms/Views/Stars.swift @@ -13,7 +13,6 @@ open class Stars: View { // MARK: - Properties //-------------------------------------------------- private var stack = UIStackView() - public var starElements = [Star]() public var starsModel: StarsModel? { return model as? StarsModel } @@ -23,20 +22,17 @@ open class Stars: View { private var starsFilledValue: Float = 0 //-------------------------------------------------- - // MARK: - Lifecycle + // MARK: - MVMCoreViewProtocol //-------------------------------------------------- open override func setupView() { super.setupView() stack.translatesAutoresizingMaskIntoConstraints = false - addSubview(stack) - NSLayoutConstraint.constraintPinSubview(toSuperview: stack) - let leading = stack.leadingAnchor.constraint(equalTo: self.leadingAnchor) - leading.priority = UILayoutPriority(rawValue: 1000) - leading.isActive = true - heightConstraint = heightAnchor.constraint(equalToConstant: 30) - heightConstraint?.isActive = true stack.axis = .horizontal stack.spacing = itemSpacing + addSubview(stack) + NSLayoutConstraint.constraintPinSubview(toSuperview: stack) + heightConstraint = heightAnchor.constraint(equalToConstant: 30) + heightConstraint?.isActive = true isAccessibilityElement = true updateAccessibilityLabel() } @@ -46,70 +42,69 @@ open class Stars: View { stack.updateView(size) } + //-------------------------------------------------- + // MARK: - MoleculeViewProtocol + //-------------------------------------------------- open override func set(with model: MoleculeModelProtocol, _ delegateObject: MVMCoreUIDelegateObject?, _ additionalData: [AnyHashable: Any]?) { super.set(with: model, delegateObject, additionalData) self.delegateObject = delegateObject - createStar() - updateStar() + createStars() + updateStars() updateAccessibilityLabel() } + public override func reset() { + stack.subviews.forEach({$0.removeFromSuperview()}) + super.reset() + } + //------------------------------------------------------ // MARK: - Methods //------------------------------------------------------ - func createStar() { - if let starsModel = starsModel { - for starModel in starsModel.stars { - let star = Star() - star.set(with: starModel, delegateObject, nil) - stack.addArrangedSubview(star) - starElements.append(star) - star.isAccessibilityElement = false - //Star model colors should take priority over stars. - if let borderColor = starsModel.borderColor, starModel.borderColor == nil { - star.borderColor = borderColor - } - if let fillColor = starsModel.fillColor, starModel.fillColor == nil { - star.progressBar.progressTintColor = fillColor.uiColor - } - if let backgroundColor = starsModel.starBackgroundColor, starModel.backgroundColor == nil { - star.backgroundColor = backgroundColor.uiColor - } - } - heightConstraint?.constant = starsModel.size + func createStars() { + guard let starsModel = starsModel else { return } + for starModel in starsModel.stars { + let star = Star(model: starModel, delegateObject, nil) + star.isAccessibilityElement = false + stack.addArrangedSubview(star) } + heightConstraint?.constant = starsModel.size } - //Update star progress and size with starsModel values - func updateStar() { - if let starsModel = starsModel { - let percentRequiredToFillStarFully = CGFloat(100/(starElements.count)) - let numberOfFilledStars = Int(starsModel.percent/percentRequiredToFillStarFully) - starsFilledValue = Float(numberOfFilledStars) - for (index, star) in starElements.enumerated() { - //Fill the stars based on percentage. Ex: if there were 4 stars, 75 percent is 3 full stars - if index < numberOfFilledStars { - star.progressBar.progress = 1 - } else if index == numberOfFilledStars { - let remainingProgress = (starsModel.percent).truncatingRemainder(dividingBy: percentRequiredToFillStarFully) - let fillPercent = remainingProgress/percentRequiredToFillStarFully - starsFilledValue += Float(fillPercent) - star.progressBar.progress = Float(fillPercent) - } else { - star.progressBar.progress = 0 - } - star.size = starsModel.size + func updateStars() { + guard let starsModel = starsModel else { return } + let percentRequiredToFillStarFully = CGFloat(100/(stack.arrangedSubviews.count)) + let numberOfFilledStars = Int(starsModel.percent/percentRequiredToFillStarFully) + starsFilledValue = Float(numberOfFilledStars) + for case let (index, star as Star) in stack.arrangedSubviews.enumerated() { + //Star model colors should take priority over stars. + if let borderColor = starsModel.borderColor?.cgColor, star.starModel?.borderColor == nil { + star.borderColor = borderColor } + if let fillColor = starsModel.fillColor?.uiColor, star.starModel?.fillColor == nil { + star.fillColor = fillColor + } + if let backgroundColor = starsModel.starBackgroundColor?.uiColor, star.starModel?.backgroundColor == nil { + star.backgroundColor = backgroundColor + } + + //Fill the stars based on percentage. Ex: if there were 4 stars, 75 percent is 3 full stars + if index < numberOfFilledStars { + star.percent = 100 + } else if index == numberOfFilledStars { + let remainingProgress = (starsModel.percent).truncatingRemainder(dividingBy: percentRequiredToFillStarFully) + let fillPercent = remainingProgress/percentRequiredToFillStarFully + starsFilledValue += Float(fillPercent) + star.percent = fillPercent * 100 + } else { + star.percent = 0 + } + star.size = starsModel.size } } - public override func reset() { - super.reset() - stack.subviews.forEach({$0.removeFromSuperview()}) - } - // MARK: - Accessibility func updateAccessibilityLabel() { - accessibilityLabel = String(format: MVMCoreUIUtility.hardcodedString(withKey: "stars_filled") ?? "", starsFilledValue, starElements.count) + accessibilityLabel = String(format: MVMCoreUIUtility.hardcodedString(withKey: "stars_filled") ?? "", starsFilledValue, stack.arrangedSubviews.count) } } diff --git a/MVMCoreUI/Atomic/Atoms/Views/StarsModel.swift b/MVMCoreUI/Atomic/Atoms/Views/StarsModel.swift index ad52b18e..27515a64 100644 --- a/MVMCoreUI/Atomic/Atoms/Views/StarsModel.swift +++ b/MVMCoreUI/Atomic/Atoms/Views/StarsModel.swift @@ -47,12 +47,8 @@ import Foundation if let percent = try typeContainer.decodeIfPresent(CGFloat.self, forKey: .percent) { self.percent = percent } - if let borderColor = try typeContainer.decodeIfPresent(Color.self, forKey: .borderColor) { - self.borderColor = borderColor - } - if let fillColor = try typeContainer.decodeIfPresent(Color.self, forKey: .fillColor) { - self.fillColor = fillColor - } + borderColor = try typeContainer.decodeIfPresent(Color.self, forKey: .borderColor) + fillColor = try typeContainer.decodeIfPresent(Color.self, forKey: .fillColor) if let size = try typeContainer.decodeIfPresent(CGFloat.self, forKey: .size) { self.size = size } From 2702f105b7d72c722ef70b53e06928d8b288efbc Mon Sep 17 00:00:00 2001 From: Lekshmi S Date: Thu, 22 Oct 2020 18:21:55 +0530 Subject: [PATCH 8/8] Code changes after review. --- MVMCoreUI/Atomic/Atoms/Views/Star.swift | 20 ++++++++++++------- MVMCoreUI/Atomic/Atoms/Views/StarModel.swift | 2 -- MVMCoreUI/Atomic/Atoms/Views/Stars.swift | 2 -- MVMCoreUI/Atomic/Atoms/Views/StarsModel.swift | 2 -- 4 files changed, 13 insertions(+), 13 deletions(-) diff --git a/MVMCoreUI/Atomic/Atoms/Views/Star.swift b/MVMCoreUI/Atomic/Atoms/Views/Star.swift index 87e81a72..30ca8e4f 100644 --- a/MVMCoreUI/Atomic/Atoms/Views/Star.swift +++ b/MVMCoreUI/Atomic/Atoms/Views/Star.swift @@ -6,14 +6,13 @@ // Copyright © 2020 Verizon Wireless. All rights reserved. // -import Foundation - @objcMembers open class Star: View { //-------------------------------------------------- // MARK: - Properties //-------------------------------------------------- private var starLayer: CAShapeLayer? + private var progressLayer: CAShapeLayer? private let maskLayer = CAShapeLayer() public var starModel: StarModel? { return model as? StarModel @@ -52,11 +51,10 @@ import Foundation //------------------------------------------------------ open override func draw(_ rect: CGRect) { //Draw progress - let width = bounds.size.width * percent / 100.0 - let progressRect = CGRect(x: 0, y: 0, width: width, height: bounds.height) - fillColor.set() - guard let context = UIGraphicsGetCurrentContext() else { return } - context.fill(progressRect) + progressLayer?.removeFromSuperlayer() + let progress = drawProgress() + layer.addSublayer(progress) + progressLayer = progress //Draw the star starLayer?.removeFromSuperlayer() @@ -70,6 +68,14 @@ import Foundation layer.mask = maskLayer } + func drawProgress() -> CAShapeLayer { + let shapeLayer = CAShapeLayer() + let width = bounds.size.width * percent / 100.0 + shapeLayer.path = UIBezierPath(rect: CGRect(x: 0, y: 0, width: width, height: bounds.height)).cgPath + shapeLayer.fillColor = fillColor.cgColor + return shapeLayer + } + func drawStar() -> CAShapeLayer { let shapeLayer = CAShapeLayer() shapeLayer.frame = bounds diff --git a/MVMCoreUI/Atomic/Atoms/Views/StarModel.swift b/MVMCoreUI/Atomic/Atoms/Views/StarModel.swift index 6ab85a3b..dc404a71 100644 --- a/MVMCoreUI/Atomic/Atoms/Views/StarModel.swift +++ b/MVMCoreUI/Atomic/Atoms/Views/StarModel.swift @@ -6,8 +6,6 @@ // Copyright © 2020 Verizon Wireless. All rights reserved. // -import Foundation - open class StarModel: MoleculeModelProtocol { //-------------------------------------------------- diff --git a/MVMCoreUI/Atomic/Atoms/Views/Stars.swift b/MVMCoreUI/Atomic/Atoms/Views/Stars.swift index 07a78e95..268f955e 100644 --- a/MVMCoreUI/Atomic/Atoms/Views/Stars.swift +++ b/MVMCoreUI/Atomic/Atoms/Views/Stars.swift @@ -6,8 +6,6 @@ // Copyright © 2020 Verizon Wireless. All rights reserved. // -import Foundation - open class Stars: View { //-------------------------------------------------- // MARK: - Properties diff --git a/MVMCoreUI/Atomic/Atoms/Views/StarsModel.swift b/MVMCoreUI/Atomic/Atoms/Views/StarsModel.swift index 27515a64..91470100 100644 --- a/MVMCoreUI/Atomic/Atoms/Views/StarsModel.swift +++ b/MVMCoreUI/Atomic/Atoms/Views/StarsModel.swift @@ -6,8 +6,6 @@ // Copyright © 2020 Verizon Wireless. All rights reserved. // -import Foundation - @objcMembers public class StarsModel: MoleculeModelProtocol { //--------------------------------------------------