From 11618e88a0f2a511422c179ac816b29915e5d71e Mon Sep 17 00:00:00 2001 From: vasavk Date: Wed, 20 Mar 2024 23:14:04 +0530 Subject: [PATCH] Digital ACT-191 ONEAPP-6830 story: did set color configurations and removed unused code --- .../CarouselScrollbar/CarouselScrollbar.swift | 174 ++++-------------- 1 file changed, 34 insertions(+), 140 deletions(-) diff --git a/VDS/Components/CarouselScrollbar/CarouselScrollbar.swift b/VDS/Components/CarouselScrollbar/CarouselScrollbar.swift index 8e60f4f9..a0523342 100644 --- a/VDS/Components/CarouselScrollbar/CarouselScrollbar.swift +++ b/VDS/Components/CarouselScrollbar/CarouselScrollbar.swift @@ -30,29 +30,10 @@ open class CarouselScrollbar: View { public required init?(coder: NSCoder) { super.init(coder: coder) } - - /// TO Do: take three view containers with fixed sizes - track view, active track view, thumb view. - /// add pan gesture to background container - /// set variable width to thumb container based on inputs. add pan gesture to track. - /// Not applicable to touch or keyboard devices - set width to 8 for three views if is in active state - /// scrollbar track only changes color on the side of the scrollbar that was interacted with. Track color changes will apply to whatever state the scrollbar is in before becoming active. if hovered via mouse, the scrollbar height will be increased when active. For touch or keyboard devices, the scrollbar will be the same size as the default state when the active track color change is applied. - /// - + //-------------------------------------------------- // MARK: - Public Properties //-------------------------------------------------- - - // Sizes are from InVision design specs. - internal var containerSize: CGSize { CGSize(width: 45, height: 44) } - - // TO DO: to be remove - // open var numberOfSlides: Int? { didSet { setNeedsUpdate() } } - /// Used to set total number of slides within carousel open var numberOfSlides: Int? { get { return _numberOfSlides } @@ -113,7 +94,7 @@ open class CarouselScrollbar: View { /// Used to set the position of the thumb(scrubber). This is used when the carousel container changes position, it will align the position of thumb(scrubber). open var position: Int? { didSet { setNeedsUpdate() } } - + /// Allows a unique id to be passed into the thumb and track of the thumb(scrubber). open var scrubberId: Int? { didSet { setNeedsUpdate() } } @@ -121,37 +102,23 @@ open class CarouselScrollbar: View { //-------------------------------------------------- // MARK: - Private Properties //-------------------------------------------------- + // Sizes are from InVision design specs. + internal var containerSize: CGSize { CGSize(width: 45, height: 44) } private let trackViewWidth = 96 private let trackViewHeight: CGFloat = 4 private let minThumbWidth: Float = 16.0 - private var thumbWidth: Float = 16.0 private var actualThumbWidth: Float = 0.0 - private var _selectedLayout: Layout = .oneUP - private var _numberOfSlides: Int? = 1 - internal var cornerRadius: CGFloat = 4.0 - internal var leftOverlayWidth: NSLayoutConstraint? - internal var rightOverlayXPos: NSLayoutConstraint? - internal var rightOverlayTrailingConstraint: NSLayoutConstraint? - internal var heightConstraint: NSLayoutConstraint? - - - internal var containerView: UIView = { - return UIView().with { - $0.translatesAutoresizingMaskIntoConstraints = false - } - }() /// Track view with fixed width internal var trackView: UIView = { return UIView().with { $0.translatesAutoresizingMaskIntoConstraints = false -// $0.tag = 1 } }() @@ -175,10 +142,16 @@ open class CarouselScrollbar: View { internal var thumbView: UIView = { return UIView().with { $0.translatesAutoresizingMaskIntoConstraints = false -// $0.tag = 4 } }() + //-------------------------------------------------- + // MARK: - Configuration + //-------------------------------------------------- + private var thumbColorConfiguration = SurfaceColorConfiguration(VDSColor.interactiveScrollthumbOnlight , VDSColor.interactiveScrollthumbOndark) + private var trackColorConfiguration = SurfaceColorConfiguration(VDSColor.interactiveScrolltrackOnlight , VDSColor.interactiveScrolltrackOndark) + private var activeOverlayColorConfiguration = SurfaceColorConfiguration(VDSColor.paletteBlack, VDSColor.paletteWhite) + //-------------------------------------------------- // MARK: - Lifecycle //-------------------------------------------------- @@ -194,26 +167,21 @@ open class CarouselScrollbar: View { heightConstraint = self.heightAnchor.constraint(equalToConstant: containerSize.height) heightConstraint?.priority = .defaultHigh heightConstraint?.isActive = true - + //Trackview trackView.frame = CGRectMake(20, 20, CGFloat(trackViewWidth), trackViewHeight) -// trackView.backgroundColor = .blue -// trackView.addGestureRecognizer(UITapGestureRecognizer(target: self, action: #selector(self.handleTap(_:)))) -// trackView.isUserInteractionEnabled = true trackView.layer.cornerRadius = cornerRadius addSubview(trackView) - - ///Left active overlay width variable depends on thumb position + + ///Left active overlay leftActiveOverlay.frame = CGRectMake(trackView.frame.origin.x, 20, CGFloat(trackViewWidth), trackViewHeight) -// leftActiveOverlay.backgroundColor = .yellow leftActiveOverlay.addGestureRecognizer(UITapGestureRecognizer(target: self, action: #selector(self.handleTap(_:)))) leftActiveOverlay.isUserInteractionEnabled = true leftActiveOverlay.layer.cornerRadius = cornerRadius addSubview(leftActiveOverlay) - ///Right active overlay width variable depends on thumbView position & trailing positon of trackView + ///Right active overlay rightActiveOverlay.frame = CGRectMake(thumbView.frame.origin.x + thumbView.frame.size.width, 20, CGFloat(trackViewWidth), trackViewHeight) -// rightActiveOverlay.backgroundColor = .orange rightActiveOverlay.addGestureRecognizer(UITapGestureRecognizer(target: self, action: #selector(self.handleTap(_:)))) rightActiveOverlay.isUserInteractionEnabled = true rightActiveOverlay.layer.cornerRadius = cornerRadius @@ -221,31 +189,22 @@ open class CarouselScrollbar: View { //Thumbview thumbView.frame = CGRectMake(20, 20, CGFloat(thumbWidth), trackViewHeight) -// thumbView.backgroundColor = .green thumbView.layer.cornerRadius = cornerRadius -// thumbView.addGestureRecognizer(UITapGestureRecognizer(target: self, action: #selector(self.handleTap(_:)))) -// thumbView.isUserInteractionEnabled = true thumbView.addGestureRecognizer(UIPanGestureRecognizer(target: self, action:(#selector(self.handleGesture(_:))))) addSubview(thumbView) updateFrames() - } + } - open override func updateView() { + open override func updateView() { super.updateView() -// updateFrames() - //left active overlay origin - x, width -// leftActiveOverlay.leadingAnchor.constraint(equalTo: trackView.leadingAnchor).activate() -// leftActiveOverlay.trailingAnchor.constraint(equalTo: thumbView.leadingAnchor).activate() - - //right active overlay origin - x, width, trailing position exact to trackView -// rightActiveOverlay.leadingAnchor.constraint(equalTo: thumbView.trailingAnchor).activate() -// rightActiveOverlay.trailingAnchor.constraint(equalTo: trackView.trailingAnchor).activate() + trackView.backgroundColor = trackColorConfiguration.getColor(surface) + thumbView.backgroundColor = thumbColorConfiguration.getColor(surface) } open override func updateAccessibility() { super.updateAccessibility() } - + open override func reset() { for subview in subviews { for recognizer in subview.gestureRecognizers ?? [] { @@ -255,37 +214,26 @@ open class CarouselScrollbar: View { super.reset() } -// open override func layoutSubviews() { -// super.layoutSubviews() -// setNeedsUpdate() -// } - //-------------------------------------------------- // MARK: - Private Methods //-------------------------------------------------- @objc func handleTap(_ gestureRecognizer: UITapGestureRecognizer) { // handling code let tag = gestureRecognizer.view?.tag - switch tag! { -// case 1 : -// print("select first view") - case 2 : - thumbView.frame.origin.x = thumbView.frame.origin.x - CGFloat(actualThumbWidth) - updateFrames() -// print("select second view") - case 3 : - thumbView.frame.origin.x = thumbView.frame.origin.x + CGFloat(actualThumbWidth) - updateFrames() -// print("select third view") -// case 4 : -// print("select fourth view") - default: - print("default") - } + switch tag! { + case 2 : + thumbView.frame.origin.x = thumbView.frame.origin.x - CGFloat(actualThumbWidth) + updateFrames() + case 3 : + thumbView.frame.origin.x = thumbView.frame.origin.x + CGFloat(actualThumbWidth) + updateFrames() + default: + print("default") + } } @objc func handleGesture(_ sender: UIPanGestureRecognizer) { - + switch sender.state { case .began: print("began") @@ -306,46 +254,18 @@ open class CarouselScrollbar: View { private func setThumbWidth() { let width = Float (trackViewWidth / (numberOfSlides ?? 1) * _selectedLayout.value) - actualThumbWidth = width - thumbWidth = width < minThumbWidth ? minThumbWidth : width + actualThumbWidth = (width > Float(trackViewWidth)) ? Float(trackViewWidth) : width + thumbWidth = (width < Float(trackViewWidth) && width > minThumbWidth) ? width : ((width > Float(trackViewWidth)) ? Float(trackViewWidth) : minThumbWidth) thumbView.frame.size.width = CGFloat(thumbWidth) thumbView.frame.origin.x = trackView.frame.origin.x - // print("trackViewWidth: \(trackViewWidth), numberOfSlides: \(String(describing: numberOfSlides)), tiles per set: \(_selectedLayout.value), actualThumbWidth: \(actualThumbWidth), thumbWidth: \(thumbWidth)") - //carousel position also to be update accordingly updateFrames() } - //Known bug: when actual width is less than minimum width -// private func updateThumbFrame() { -// -// //right active overlay origin - x, width, trailing position exact to trackView -// // adjusting thumb position if it goes beyond trackView. -// let position1 = thumbView.frame.origin.x + thumbView.frame.size.width -// let position2 = trackView.frame.origin.x + trackView.frame.size.width -// if position1 > position2 { -// thumbView.frame.origin.x = position2 - thumbView.frame.size.width -// } else if thumbView.frame.origin.x < 0 { -// thumbView.frame.origin.x = trackView.frame.origin.x -// } else { -// rightActiveOverlay.frame.origin.x = position1 -// rightActiveOverlay.frame.size.width = position2 - position1 -// } -// DispatchQueue.main.asyncAfter(deadline: .now() + 2 , execute: { -// //left active overlay origin - x, width -// self.updateOverlay() -// }) -// } -// -// private func updateOverlay() { -// //left active overlay origin - x, width -// leftActiveOverlay.frame.size.width = thumbView.frame.origin.x - trackView.frame.origin.x -// } -// private func updateFrames() { //left active overlay origin - x, width leftActiveOverlay.frame.size.width = thumbView.frame.origin.x - trackView.frame.origin.x - //right active overlay origin - x, width, trailing position exact to trackView + //right active overlay origin - x, width let position1 = thumbView.frame.origin.x + thumbView.frame.size.width let position2 = trackView.frame.origin.x + trackView.frame.size.width rightActiveOverlay.frame.origin.x = position1 @@ -353,29 +273,3 @@ open class CarouselScrollbar: View { } } - - - - - - -//private func updateFrames() { -// //right active overlay origin - x, width, trailing position exact to trackView -// let position1 = thumbView.frame.origin.x + thumbView.frame.size.width -// let position2 = trackView.frame.origin.x + trackView.frame.size.width -// rightActiveOverlay.frame.origin.x = position1 -// rightActiveOverlay.frame.size.width = position2 - position1 - - -////right active overlay origin - x, width, trailing position exact to trackView -//// adjusting thumb position if it goes beyond trackView. -//let position1 = thumbView.frame.origin.x + thumbView.frame.size.width -//let position2 = trackView.frame.origin.x + trackView.frame.size.width -//if position1 > position2 { -// thumbView.frame.origin.x = position2 - thumbView.frame.size.width -//} else if thumbView.frame.origin.x < 0 { -// thumbView.frame.origin.x = trackView.frame.origin.x -//} else { -// rightActiveOverlay.frame.origin.x = position1 -// rightActiveOverlay.frame.size.width = position2 - position1 -//}