Added custom dot animation

1Weather/AppDelegate.swift

@@ -80,9 +80,16 @@ class AppDelegate: UIResponder, UIApplicationDelegate {
         FirebaseApp.configure()
         FirebaseApp.configure()
         ConfigManager.shared.updateConfig()
         ConfigManager.shared.updateConfig()
         
         
-        //App UI
-        let appCoordinator = AppCoordinator(window: self.window!)
-        appCoordinator.start()
+        #if DEBUG
+        let ctr = OnboardingPageController(coordinator: AppCoordinator(window: self.window!))
+        window?.rootViewController = ctr
+        window?.makeKeyAndVisible()
+        #else
+        #endif
+        
+//        //App UI
+//        let appCoordinator = AppCoordinator(window: self.window!)
+//        appCoordinator.start()
         
         
         
         
         ThemeManager.setBaseTheme()
         ThemeManager.setBaseTheme()

1Weather/UI/View controllers/Onboarding/InitialOnboarding/OnboardingPageControl.swift

@@ -11,10 +11,24 @@ class OnboardingPageControl: UIView {
     //Private
     //Private
     private let kSpacePerDot: CGFloat = 10
     private let kSpacePerDot: CGFloat = 10
     private let kDotSize: CGSize = .init(width: 9, height: 9)
     private let kDotSize: CGSize = .init(width: 9, height: 9)
-    private let kIndicatorSize: CGSize = .init(width: 6, height: 6)
+    private let kIndicatorSize: CGSize = .init(width: 23, height: 9)
+    private let kDotColor = UIColor(hex: 0xD0D0D0)
+    private let kIndicatorColor = ThemeManager.currentTheme.graphTintColor
     private let totalPagesCount: Int
     private let totalPagesCount: Int
-    private let indicator = UIView()
     private var dots = [UIView]()
     private var dots = [UIView]()
+    private lazy var dotColorComponents: (red: CGFloat, green: CGFloat, blue: CGFloat) = {
+        let components = kDotColor.cgColor.components
+        return (components?[0] ?? 0,
+                components?[1] ?? 0,
+                components?[2] ?? 0)
+    }()
+    
+    private lazy var indicatorColorComponents: (red: CGFloat, green: CGFloat, blue: CGFloat) = {
+        let components = kIndicatorColor.cgColor.components
+        return (components?[0] ?? 0,
+                components?[1] ?? 0,
+                components?[2] ?? 0)
+    }()
     
     
     init(totalPagesCount: Int) {
     init(totalPagesCount: Int) {
         self.totalPagesCount = totalPagesCount
         self.totalPagesCount = totalPagesCount
@@ -22,7 +36,6 @@ class OnboardingPageControl: UIView {
         
         
         prepareView()
         prepareView()
         prepareDots()
         prepareDots()
-        prepareIndicator()
     }
     }
     
     
     required init?(coder: NSCoder) {
     required init?(coder: NSCoder) {
@@ -37,25 +50,33 @@ class OnboardingPageControl: UIView {
         let targetDot = dots[nextPageIndex]
         let targetDot = dots[nextPageIndex]
         let previousDot = dots[currentPageIndex]
         let previousDot = dots[currentPageIndex]
         
         
-        //Scale
-        let scaleDelta = (kDotSize.width - kIndicatorSize.width) * scrollProgress
+        //Width
+        let widthDelta = (kIndicatorSize.width - kDotSize.width) * scrollProgress
         targetDot.snp.updateConstraints { update in
         targetDot.snp.updateConstraints { update in
-            update.width.equalTo(kDotSize.width - scaleDelta)
-            update.height.equalTo(kDotSize.height - scaleDelta)
+            update.width.equalTo(kDotSize.width + widthDelta)
         }
         }
-        targetDot.layer.cornerRadius = (kDotSize.height - scaleDelta) / 2
-        
         previousDot.snp.updateConstraints { update in
         previousDot.snp.updateConstraints { update in
-            update.width.equalTo(kIndicatorSize.width + scaleDelta)
-            update.height.equalTo(kIndicatorSize.height + scaleDelta)
+            update.width.equalTo(kIndicatorSize.width - widthDelta)
         }
         }
-        previousDot.layer.cornerRadius = (kIndicatorSize.height + scaleDelta) / 2
         
         
-        //Offset
-        let offsetDelta = targetDot.frame.origin.x - previousDot.frame.origin.x
-        indicator.snp.updateConstraints { update in
-            update.left.equalToSuperview().inset(previousDot.frame.origin.x + offsetDelta * scrollProgress)
-        }
+        //Color
+        //Blue to gray
+        let previousColorDelta: (red: CGFloat, green: CGFloat, blue: CGFloat) = (indicatorColorComponents.red - dotColorComponents.red,
+                                                                                 indicatorColorComponents.green - dotColorComponents.green,
+                                                                                 indicatorColorComponents.blue - dotColorComponents.blue)
+        previousDot.backgroundColor = UIColor(red: indicatorColorComponents.red - previousColorDelta.red * scrollProgress,
+                                              green: indicatorColorComponents.green - previousColorDelta.green * scrollProgress,
+                                              blue: indicatorColorComponents.blue - previousColorDelta.blue * scrollProgress,
+                                              alpha: 1)
+        
+        //Gray to blue
+        let targetColorDelta: (red: CGFloat, green: CGFloat, blue: CGFloat) = (dotColorComponents.red - indicatorColorComponents.red,
+                                                                               dotColorComponents.green - indicatorColorComponents.green,
+                                                                               dotColorComponents.blue - indicatorColorComponents.blue)
+        targetDot.backgroundColor = UIColor(red: dotColorComponents.red - targetColorDelta.red * scrollProgress,
+                                            green: dotColorComponents.green - targetColorDelta.green * scrollProgress,
+                                            blue: dotColorComponents.blue - targetColorDelta.blue * scrollProgress,
+                                            alpha: 1)
     }
     }
 }
 }
 
 
@@ -70,7 +91,7 @@ private extension OnboardingPageControl {
     func prepareDots() {
     func prepareDots() {
         for index in 0..<totalPagesCount {
         for index in 0..<totalPagesCount {
             let dot = UIView()
             let dot = UIView()
-            dot.backgroundColor = UIColor(hex: 0xD0D0D0)
+            dot.backgroundColor = index == 0 ? kIndicatorColor : kDotColor
             dot.layer.cornerRadius = kDotSize.height / 2
             dot.layer.cornerRadius = kDotSize.height / 2
             addSubview(dot)
             addSubview(dot)
             dots.append(dot)
             dots.append(dot)
@@ -78,23 +99,18 @@ private extension OnboardingPageControl {
             dot.snp.makeConstraints { make in
             dot.snp.makeConstraints { make in
                 make.size.equalTo(index == 0 ? kIndicatorSize : kDotSize)
                 make.size.equalTo(index == 0 ? kIndicatorSize : kDotSize)
                 make.centerY.equalToSuperview()
                 make.centerY.equalToSuperview()
-                make.left.equalToSuperview().inset(CGFloat(index) * (kDotSize.width + kSpacePerDot))
+                
+                if index == 0 {
+                    make.left.equalToSuperview()
+                }
+                else {
+                    make.left.equalTo(dots[index - 1].snp.right).offset(kSpacePerDot)
+                }
+
                 if index == totalPagesCount - 1 {
                 if index == totalPagesCount - 1 {
                     make.right.equalToSuperview()
                     make.right.equalToSuperview()
                 }
                 }
             }
             }
         }
         }
     }
     }
-    
-    func prepareIndicator() {
-        indicator.backgroundColor = ThemeManager.currentTheme.graphTintColor
-        indicator.layer.cornerRadius = kIndicatorSize.height / 2
-        addSubview(indicator)
-        
-        indicator.snp.makeConstraints { make in
-            make.left.equalToSuperview()
-            make.centerY.equalToSuperview()
-            make.size.equalTo(kIndicatorSize)
-        }
-    }
 }
 }